オープングラフを導入しよう

 オープングラフを導入しよう

at Facebook Night Vol.9

Ff822949384025796e11fd7f681df060?s=128

Katsuhiro OGAWA

August 29, 2012
Tweet

Transcript

  1. オープングラフを 導⼊入しよう 株式会社クロコス ⼩小川雄⼤大 https://www.facebook.com/katsuhiro.ogawa Facebook Night Vol.9

  2. ⾃自⼰己紹介 ‣খ઒༤େ / OGAWA Katsuhiro ‣ http://fvstr.jp/ ‣גࣜձࣾΫϩίε

  3. None
  4. Ϡϑʔͷ100ˋࢠձࣾʹͳΓ·ͨ͠ʂ

  5. None
  6. None
  7. ‣גࣜձࣾΫϩίε / Crocos Inc. ‣ http://crocos.co.jp/ ‣ https://www.facebook.com/Crocos.Inc ‣ೝఆϚʔέςΟϯάσϕϩούʔ

  8. Crocosマーケティング ‣ ݒ৆ΞϓϦ ‣ ྦྷܭԠื 185ສ݅ ‣ ྦྷܭ։࠵ 6,000݅ ‣

    ಉ࣌։࠵ 500݅ ‣ MAU 90,000~120,000 ‣ ίϯςετΞϓϦ ‣ ϓϨϛΞϜϓϥϯݶఆ NEW!!
  9. 本⽇日の内容 ‣Φʔϓϯάϥϑͱ͸ ‣ΞΫγϣϯͱΦϒδΣΫτ ‣ΦʔϓϯάϥϑΛಋೖ͢Δ ‣ΦʔϓϯάϥϑΛެ։͢Δ ‣ΞΫγϣϯϦϯΫ

  10. オープングラフとは ‣Ϣʔβ͕ΞϓϦ্Ͱߦ༷ͬͨʑͳ ߦಈΛγΣΞ͢Δ࢓૊Έ ‣ http://developers.facebook.com/docs/ opengraph/

  11. ΫϦοΫͯ͠ ΫʔϙϯΛऔಘ

  12. ςΟοΧʔͳͲͰ γΣΞ

  13. オブジェクトとアクション ‣ʮΫʔϙϯΛऔಘʯ ‣ ΦϒδΣΫτ Ϋʔϙϯ ‣ ΞΫγϣϯ औಘ ‣ ΞϓϦ͝ͱʹ೚ҙͰઃఆՄೳ

    ࣮ࡍ͸ӳޠ “get a coupon”
  14. どんなシーンでオープングラフを 活⽤用できるか? ‣ΫʔϙϯΛऔಘ “get a coupon”

  15. どんなシーンでオープングラフを 活⽤用できるか? ‣ΫʔϙϯΛऔಘ ‣ϑΥτίϯςετʹ౤ථ “vote for a photo”

  16. どんなシーンでオープングラフを 活⽤用できるか? ‣ΫʔϙϯΛऔಘ ‣ϑΥτίϯςετʹ౤ථ ‣ݒ৆ͷԠืʁ “enter a present competition” ?

  17. どんなシーンでオープングラフを 活⽤用できるか? ‣ΫʔϙϯΛऔಘ ‣ϑΥτίϯςετʹ౤ථ ‣ݒ৆ͷԠืʁ Ϣʔβ͕͍΍͕Γͦ͏ͳͷͰ ΍͍ͬͯͳ͍

  18. 導⼊入に必要なこと ‣ΦϒδΣΫτͱΞΫγϣϯͷఆٛ ‣ΞΫγϣϯͷൃߦॲཧͷ࣮૷ ‣Ϣʔβ͔ΒڐՄΛಘΔ ‣ΞΫγϣϯͷਃ੥ͱঝೝ

  19. オブジェクトとアクションの定義 Φʔϓϯάϥϑ > Getting Started

  20. オブジェクトとアクションの定義 ΞΫγϣϯͷઃఆ

  21. オブジェクトとアクションの定義 ΦϒδΣΫτͷઃఆ

  22. オブジェクトとアクションの定義 ελʔτΛԡͯ͠ొ࿥

  23. アクションのカスタマイズ ‣ςΩετͷΧελϚΠζ ‣ ݱࡏ/աڈɺ୯਺/ෳ਺ ‣ લஔࢺͷࢦఆ (“vote for”) ‣ΧελϜϓϩύςΟ, etc...

  24. オブジェクトの設定 ‣ΦϒδΣΫτ͸ύʔϚϦϯΫΛ࣋ ͍ͬͯͳ͚Ε͹ͳΒͳ͍ ‣ ύʔϚϦϯΫ͕ΦϒδΣΫτͷ࣮ମΛද͢ ‣ http://coupon.crocos.jp/xyz ‣ΦϒδΣΫτͷ৘ใ͸OGPͰઃఆ

  25. アクションの発⾏行 ‣ ΞΫγϣϯͷURLʹPOSTϦΫΤετΛૹΔ ‣ /ϢʔβID/ΞϓϦͷ໊લۭؒ:ΞΫγϣϯ ‣ /me/crocos-coupon:get ‣ ΦϒδΣΫτΛύϥϝʔλʹࢦఆ ‣

    ஋͸ΦϒδΣΫτͷύʔϚϦϯΫ ‣ http://coupon.crocos.jp/xyz
  26. 実装(Using PHP-SDK) $facebook = new Facebook(...); $facebook->api( ‘/me/crocos-coupon:get’, ‘POST’, [

    ‘coupon’ => ‘http://coupon.crocos.jp/xyz’, ] );
  27. 実装(Using PHP-SDK) $facebook = new Facebook(...); $facebook->api( ‘/me/crocos-coupon:get’, ‘POST’, [

    ‘coupon’ => ‘http://coupon.crocos.jp/xyz’, ] ); ΞΫγϣϯͷൃߦ
  28. 実装(Using PHP-SDK) $facebook = new Facebook(...); $facebook->api( ‘/me/crocos-coupon:get’, ‘POST’, [

    ‘coupon’ => ‘http://coupon.crocos.jp/xyz’, ] ); POSTϝιου
  29. 実装(Using PHP-SDK) $facebook = new Facebook(...); $facebook->api( ‘/me/crocos-coupon:get’, ‘POST’, [

    ‘coupon’ => ‘http://coupon.crocos.jp/xyz’, ] ); ΦϒδΣΫτΛύϥϝʔλʹࢦఆ
  30. ユーザから許可を得る ‣“publish_actions” ‣ ΞΫγϣϯͷൃߦʹඞཁͳݖݶ publish_actionsΛ௥Ճ͢ΔͱݱΕΔ

  31. アクションの申請と承認 ‣ΞΫγϣϯ͸Facebookʹਃ੥ͯ͠ ঝೝΛಘͳ͍ͱ։ൃऀҎ֎ʹ͸ެ ։͞Εͳ͍ ͸͡ΊʹGetCode͔ΒμΠΞϩάΛ։͍ͯ ॻ͔Ε͍ͯΔίϚϯυΛ࣮ߦ͓ͯ͘͠

  32. アクションの申請と承認 ‣ΞΫγϣϯ͸Facebookʹਃ੥ͯ͠ ঝೝΛಘͳ͍ͱ։ൃऀҎ֎ʹ͸ެ ։͞Εͳ͍ ૹ৴Λԡͯ͠ਃ੥͢Δ

  33. アクションの申請と承認 ΞΫγϣϯͷൃߦखॱΛهड़ͯ͠ଓߦ

  34. 申請時のアドバイス ‣࣮ࡍʹFacebookͷਓ͕ΞΫηε͠ ͯ֬ೝͰ͖Δ؀ڥΛ༻ҙ͓ͯ͘͠ ‣ ࣗ෼ͷ։ൃ؀ڥͰOK ‣ ඞͣಈ࡞֬ೝ͞ΕΔΘ͚Ͱ΋ͳ͍ʁ

  35. 申請時のアドバイス ‣ΞΫγϣϯ͕ൃޮ͞ΕΔ·Ͱͷख ॱΛ1͔Βॱ൪ʹهड़ ‣ ԡ͢ϘλϯͷςΩετ΋ॻ͘ͱ͍͍͔΋ ‣ ೔ຊޠͰ΋௨Δ͔͸ෆ໌…

  36. 承認が下りなかったら ‣ཧ༝Λڭ͑ͯ͘ΕΔͷͰɺ௚ͯ͠ ΋͏1౓ਃ੥͢Δ ‣ ೔ຊޠ͕ΞϨ͚ͩͲؾʹ͠ͳ͍

  37. 許可が下りたら ‣ͦͷ೔ͷ͏ͪʹฦ౴͕͘Δ ‣ΦʔϓϯάϥϑΛ࢖ͬͯγΣΞ͠ ·͘Ζ͏ʂ

  38. テキストの翻訳 ‣TranslationsΞϓϦ͔Βϝοηʔ δͷ຋༁͕Մೳ ‣ ϢʔβͷݴޠʹΑͬͯࣗಈతʹ੾ΓସΘΔ ‣70ϑϨʔζ/1ΞΫγϣϯ͘Β͍… ‣ਃ੥͕௨ͬͨ͋ͱʹ΍Δͱ࣮֬

  39. アクションリンク γΣΞ͞ΕͨΞΫγϣϯΛܦ༝ͯ͠ ࣗ෼΋ΞΫγϣϯΛߦ͏࢓૊Έ

  40. アクションリンクの設定 ͜͜ʹࢦఆͨ͠URLʹ Signed Request͕ඈΜͰ͘Δ

  41. 実装(Using PHP-SDK) $sr = $facebook->getSignedRequest(); $object = $sr['objects'][0]['url']; $action =

    $sr[‘action_link’][‘type’]; if ($action === ‘crocos-coupon:get’) { // Ϋʔϙϯൃߦॲཧ } return [‘success’ => ‘true’];
  42. ‣Crocos Enginnering BlogΛݟ ͍ͯͩ͘͞ʂ ‣ http://engineering.crocos.jp/ ‣͝ਗ਼ௌ͋Γ͕ͱ͏͍͟͝·ͨ͠ まとめ