KonifarPod

Facebook OpengraphAPIのローカルテスト方法

   

Pocket

FacebookのOpenGraphAPIを実装した場合、従来のGraphAPIと違って有効なURLを指定しないとエラーが出てシェアされません。

有効なURLとはつまり、Facebook Debug Tool で有効とみなされるURLです。localhost:3000なんてURLはもちろんダメです。

そのため、シェアされるページを実装してog:url、og:typeなどのプロパティをバッチリ用意しても、ローカル環境だとOpenGraphによるシェアのテストは行えません。これは困ったと思い調べてみたので、ローカルでのテスト方法を2つ紹介します。

 

1.SampleObjectのURLを使う

OpenGraphでオブジェクトを作った時に作成される、SampleページのURLを利用する方法があります。ogプロパティが全てセットされたページなので、問題なくシェアできます。

SampleページのURLを取得するには、まずFacebookDeveloperのOpenGraphの設定ページからサンプルデータの管理をクリックします。ダイアログが表示され、サンプルオブジェクトを設定しているとDebugリンクが出ているはずなので、クリックします。

Opengraph2 3

 

表示されたURLがサンプルURLです。

Opengraph2 2

 

サンプルURLを表示すると、設定されたogプロパティを確認することができます。

Opengraph2 1

 

あとは、開発中だけはこのURLをシェアするように実装します。Railsの場合はRails.env.development?の時はこのURLをシェアするようにすると良いと思います。これは割と簡単な方法ですね。

 

2.Proxyサーバー経由でローカルのwebサーバーを一時的に公開する

もう一つの方法は、テストの時だけProxyサーバー経由でローカルのwebサーバーに外部からアクセスする方法です。こちらにいくつかツールが紹介されています。

Railsの場合はProxyLocalというgemを使うのが楽ちんみたいです。ターミナルから proxylocal 3000 —host konifar と叩くだけで、http://konifar.t.proxylocal.com/ というURLからローカルサーバーに接続することができるようになる優れものです。

ProxyLocalのインストール、実行のやり方はこちらに詳しく載っています。難しいことは何もなく、インストールから導入まで5分以内で終わると思います。

Facebook Developer のAppDomainsの設定にURLを追加するのを忘れないように注意してください。追加しないとドメインがダメと言われて落ちます。

Opengraph2 4

 

まぁOpenGraphは一度ワークしてしまえばそんなにテストする必要はないかもしれませんが、いきなり本番環境で動かすのも不安だと思うので開発環境でテストする時には参考にしてみてください。

Pocket

 - Develop, Facebook , ,