ローカル環境でOGPをテストできるChrome拡張機能をリリースしました

LocalhostでOGPの確認を行える同じようなChrome拡張機能があったのですが、使えなくなっていたのでこの度Localhost Open Graph DebuggerというChrome拡張機能を作りました。

使い方

1. Chrome ウェブストアから拡張機能を追加
2. チェックしたいローカル上のサイトで拡張機能のアイコンをクリック
3. ページ生成処理が完了するとポップアップが開きますので「Open debug page」というリンクをクリック
4. すると下記のようなオンラインのページが新しいタブで開きますのでURLをコピーして各デバッガーツールで検証します。

仕組み＆やっていること

1. 拡張機能のアイコンをクリック
2. 表示しているローカル上のサイトのmetaタグ及びmetaタグで指定されている画像を取得
3. 取得したmetaタグと画像をog.nullnull.devに送信
4. og.nullnull.dev側で送られて来たデータを整形して保存
5. metaタグを吐き出す新しいページを生成

という流れになっています。

生成した新しいページ、metaタグ、画像等の全てのデータは15分以上経つと自動で削除されるようになっています。 Cronで10分置きにページの生成時間をチェックして15分以上経過したものを削除するようにしているので、正確には生成されてから15-25分の範囲で削除されるようになっています。

Delete this pageボタンを押すことで即座に削除することも可能です。