facebookでのopen graph protocolの対応について確認する

概要

facebook内で外部サイトのURLを告知する下記3つの方法について
open graph protocolがどのように反映されるのか確認してみる

  • 今回記述したopen graph tag
    • og:title
    • og:description
    • og:image
    • og:url

open graph protocol

The Open Graph protocol enables any web page to become a rich object in a social graph. For instance, this is used on Facebook to enable any web page to have the same functionality as a Facebook Page.

The Open Graph Protocol
http://ogp.me/

方法1 直打ち

facebookのフィードの「今なにしてる?」のテキストボックスに直接URLを書きこむ

  • open graph protocolの内容が反映されたもの
    • og:title -> タイトルとして表示
    • og:description -> 説明文として表示
    • og:image -> サムネイル画像として表示
  • open graph protocolの内容が反映されなかったもの
    • og:url -> リンク先URLに利用されず(直書きしたURLが反映)

方法2 「いいね!」ボタン

  • open graph protocolの内容が反映されたもの
    • og:title -> タイトルとして表示
    • og:description -> 説明文として表示
    • og:image -> サムネイル画像として表示
    • og:url -> リンク先URLに利用

方法3 「送信」ボタン

「いいね!」ボタンと同じ

注意点

facebookはページのopen graph protocolの情報をキャッシュしてります。
open graph protocolが間違った状態で「いいね!」ボタンが押下されると
その後も、間違った状態で送信される。

facebookは24時間毎にページの情報を確認しにいき、httpヘッダーのcacheやexpireの情報を参考にアップデートされているか確認する
詳しくは下記を参照

  • Like Button

When does Facebook scrape my page?
http://developers.facebook.com/docs/reference/plugins/like/

確認方法

facebookが取得したopen graph protocolは下記リンクで確認できる
http://developers.facebook.com/tools/lint/