Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
オープングラフを導入しよう
Search
Katsuhiro Ogawa
August 29, 2012
Programming
3
7.5k
オープングラフを導入しよう
at Facebook Night Vol.9
Katsuhiro Ogawa
August 29, 2012
Tweet
Share
More Decks by Katsuhiro Ogawa
See All by Katsuhiro Ogawa
新規プロダクト開発に伴う既存マイクロサービスのリアーキテクティングとその後
fivestar
1
150
Goで学ぶSOLID原則
fivestar
0
390
メルカリ CSE チームの 歩みと取り組み / Steps and Tries in the CSE team for Mercari
fivestar
2
940
Go in Corporate Solutions Engineering
fivestar
0
2.5k
いつまでPHP 5.x使ってるの
fivestar
1
2k
PHP のドキュメントを読んで PHP のことをもっと知ろう
fivestar
1
3.3k
CrocosSecurityBundleを Symfony3.0に対応した話
fivestar
0
280
PHP BLT だけど HTML5 の コンテンツモデルのお話
fivestar
0
2.4k
THE NEW "PERFECT PHP" WILL BE COMING SOON
fivestar
0
8.1k
Other Decks in Programming
See All in Programming
ファインディ株式会社におけるMCP活用とサービス開発
starfish719
0
330
HTMLの品質ってなんだっけ? “HTMLクライテリア”の設計と実践
unachang113
4
2.8k
2025 年のコーディングエージェントの現在地とエンジニアの仕事の変化について
azukiazusa1
24
12k
今から始めるClaude Code入門〜AIコーディングエージェントの歴史と導入〜
nokomoro3
0
130
奥深くて厄介な「改行」と仲良くなる20分
oguemon
1
520
Namespace and Its Future
tagomoris
6
700
Ruby×iOSアプリ開発 ~共に歩んだエコシステムの物語~
temoki
0
270
時間軸から考えるTerraformを使う理由と留意点
fufuhu
16
4.8k
Cache Me If You Can
ryunen344
2
700
Compose Multiplatform × AI で作る、次世代アプリ開発支援ツールの設計と実装
thagikura
0
150
概念モデル→論理モデルで気をつけていること
sunnyone
1
100
ソフトウェアテスト徹底指南書の紹介
goyoki
1
150
Featured
See All Featured
Principles of Awesome APIs and How to Build Them.
keavy
126
17k
Done Done
chrislema
185
16k
GraphQLとの向き合い方2022年版
quramy
49
14k
Evolution of real-time – Irina Nazarova, EuRuKo, 2024
irinanazarova
8
920
Navigating Team Friction
lara
189
15k
The Psychology of Web Performance [Beyond Tellerrand 2023]
tammyeverts
49
3k
Cheating the UX When There Is Nothing More to Optimize - PixelPioneers
stephaniewalter
285
13k
Raft: Consensus for Rubyists
vanstee
140
7.1k
Creating an realtime collaboration tool: Agile Flush - .NET Oxford
marcduiker
31
2.2k
Helping Users Find Their Own Way: Creating Modern Search Experiences
danielanewman
29
2.9k
Stop Working from a Prison Cell
hatefulcrawdad
271
21k
Building Flexible Design Systems
yeseniaperezcruz
328
39k
Transcript
オープングラフを 導⼊入しよう 株式会社クロコス ⼩小川雄⼤大 https://www.facebook.com/katsuhiro.ogawa Facebook Night Vol.9
⾃自⼰己紹介 ‣খ༤େ / OGAWA Katsuhiro ‣ http://fvstr.jp/ ‣גࣜձࣾΫϩίε
None
Ϡϑʔͷ100ˋࢠձࣾʹͳΓ·ͨ͠ʂ
None
None
‣גࣜձࣾΫϩίε / Crocos Inc. ‣ http://crocos.co.jp/ ‣ https://www.facebook.com/Crocos.Inc ‣ೝఆϚʔέςΟϯάσϕϩούʔ
Crocosマーケティング ‣ ݒΞϓϦ ‣ ྦྷܭԠื 185ສ݅ ‣ ྦྷܭ։࠵ 6,000݅ ‣
ಉ࣌։࠵ 500݅ ‣ MAU 90,000~120,000 ‣ ίϯςετΞϓϦ ‣ ϓϨϛΞϜϓϥϯݶఆ NEW!!
本⽇日の内容 ‣Φʔϓϯάϥϑͱ ‣ΞΫγϣϯͱΦϒδΣΫτ ‣ΦʔϓϯάϥϑΛಋೖ͢Δ ‣ΦʔϓϯάϥϑΛެ։͢Δ ‣ΞΫγϣϯϦϯΫ
オープングラフとは ‣Ϣʔβ͕ΞϓϦ্Ͱߦ༷ͬͨʑͳ ߦಈΛγΣΞ͢ΔΈ ‣ http://developers.facebook.com/docs/ opengraph/
ΫϦοΫͯ͠ ΫʔϙϯΛऔಘ
ςΟοΧʔͳͲͰ γΣΞ
オブジェクトとアクション ‣ʮΫʔϙϯΛऔಘʯ ‣ ΦϒδΣΫτ Ϋʔϙϯ ‣ ΞΫγϣϯ औಘ ‣ ΞϓϦ͝ͱʹҙͰઃఆՄೳ
࣮ࡍӳޠ “get a coupon”
どんなシーンでオープングラフを 活⽤用できるか? ‣ΫʔϙϯΛऔಘ “get a coupon”
どんなシーンでオープングラフを 活⽤用できるか? ‣ΫʔϙϯΛऔಘ ‣ϑΥτίϯςετʹථ “vote for a photo”
どんなシーンでオープングラフを 活⽤用できるか? ‣ΫʔϙϯΛऔಘ ‣ϑΥτίϯςετʹථ ‣ݒͷԠืʁ “enter a present competition” ?
どんなシーンでオープングラフを 活⽤用できるか? ‣ΫʔϙϯΛऔಘ ‣ϑΥτίϯςετʹථ ‣ݒͷԠืʁ Ϣʔβ͕͍͕Γͦ͏ͳͷͰ ͍ͬͯͳ͍
導⼊入に必要なこと ‣ΦϒδΣΫτͱΞΫγϣϯͷఆٛ ‣ΞΫγϣϯͷൃߦॲཧͷ࣮ ‣Ϣʔβ͔ΒڐՄΛಘΔ ‣ΞΫγϣϯͷਃͱঝೝ
オブジェクトとアクションの定義 Φʔϓϯάϥϑ > Getting Started
オブジェクトとアクションの定義 ΞΫγϣϯͷઃఆ
オブジェクトとアクションの定義 ΦϒδΣΫτͷઃఆ
オブジェクトとアクションの定義 ελʔτΛԡͯ͠ొ
アクションのカスタマイズ ‣ςΩετͷΧελϚΠζ ‣ ݱࡏ/աڈɺ୯/ෳ ‣ લஔࢺͷࢦఆ (“vote for”) ‣ΧελϜϓϩύςΟ, etc...
オブジェクトの設定 ‣ΦϒδΣΫτύʔϚϦϯΫΛ࣋ ͍ͬͯͳ͚ΕͳΒͳ͍ ‣ ύʔϚϦϯΫ͕ΦϒδΣΫτͷ࣮ମΛද͢ ‣ http://coupon.crocos.jp/xyz ‣ΦϒδΣΫτͷใOGPͰઃఆ
アクションの発⾏行 ‣ ΞΫγϣϯͷURLʹPOSTϦΫΤετΛૹΔ ‣ /ϢʔβID/ΞϓϦͷ໊લۭؒ:ΞΫγϣϯ ‣ /me/crocos-coupon:get ‣ ΦϒδΣΫτΛύϥϝʔλʹࢦఆ ‣
ΦϒδΣΫτͷύʔϚϦϯΫ ‣ http://coupon.crocos.jp/xyz
実装(Using PHP-SDK) $facebook = new Facebook(...); $facebook->api( ‘/me/crocos-coupon:get’, ‘POST’, [
‘coupon’ => ‘http://coupon.crocos.jp/xyz’, ] );
実装(Using PHP-SDK) $facebook = new Facebook(...); $facebook->api( ‘/me/crocos-coupon:get’, ‘POST’, [
‘coupon’ => ‘http://coupon.crocos.jp/xyz’, ] ); ΞΫγϣϯͷൃߦ
実装(Using PHP-SDK) $facebook = new Facebook(...); $facebook->api( ‘/me/crocos-coupon:get’, ‘POST’, [
‘coupon’ => ‘http://coupon.crocos.jp/xyz’, ] ); POSTϝιου
実装(Using PHP-SDK) $facebook = new Facebook(...); $facebook->api( ‘/me/crocos-coupon:get’, ‘POST’, [
‘coupon’ => ‘http://coupon.crocos.jp/xyz’, ] ); ΦϒδΣΫτΛύϥϝʔλʹࢦఆ
ユーザから許可を得る ‣“publish_actions” ‣ ΞΫγϣϯͷൃߦʹඞཁͳݖݶ publish_actionsΛՃ͢ΔͱݱΕΔ
アクションの申請と承認 ‣ΞΫγϣϯFacebookʹਃͯ͠ ঝೝΛಘͳ͍ͱ։ൃऀҎ֎ʹެ ։͞Εͳ͍ ͡ΊʹGetCode͔ΒμΠΞϩάΛ։͍ͯ ॻ͔Ε͍ͯΔίϚϯυΛ࣮ߦ͓ͯ͘͠
アクションの申請と承認 ‣ΞΫγϣϯFacebookʹਃͯ͠ ঝೝΛಘͳ͍ͱ։ൃऀҎ֎ʹެ ։͞Εͳ͍ ૹ৴Λԡͯ͠ਃ͢Δ
アクションの申請と承認 ΞΫγϣϯͷൃߦखॱΛهड़ͯ͠ଓߦ
申請時のアドバイス ‣࣮ࡍʹFacebookͷਓ͕ΞΫηε͠ ͯ֬ೝͰ͖ΔڥΛ༻ҙ͓ͯ͘͠ ‣ ࣗͷ։ൃڥͰOK ‣ ඞͣಈ࡞֬ೝ͞ΕΔΘ͚Ͱͳ͍ʁ
申請時のアドバイス ‣ΞΫγϣϯ͕ൃޮ͞ΕΔ·Ͱͷख ॱΛ1͔Βॱ൪ʹهड़ ‣ ԡ͢ϘλϯͷςΩετॻ͘ͱ͍͍͔ ‣ ຊޠͰ௨Δ͔ෆ໌…
承認が下りなかったら ‣ཧ༝Λڭ͑ͯ͘ΕΔͷͰɺͯ͠ ͏1ਃ͢Δ ‣ ຊޠ͕ΞϨ͚ͩͲؾʹ͠ͳ͍
許可が下りたら ‣ͦͷͷ͏ͪʹฦ͕͘Δ ‣ΦʔϓϯάϥϑΛͬͯγΣΞ͠ ·͘Ζ͏ʂ
テキストの翻訳 ‣TranslationsΞϓϦ͔Βϝοηʔ δͷ༁͕Մೳ ‣ ϢʔβͷݴޠʹΑͬͯࣗಈతʹΓସΘΔ ‣70ϑϨʔζ/1ΞΫγϣϯ͘Β͍… ‣ਃ͕௨ͬͨ͋ͱʹΔͱ࣮֬
アクションリンク γΣΞ͞ΕͨΞΫγϣϯΛܦ༝ͯ͠ ࣗΞΫγϣϯΛߦ͏Έ
アクションリンクの設定 ͜͜ʹࢦఆͨ͠URLʹ Signed Request͕ඈΜͰ͘Δ
実装(Using PHP-SDK) $sr = $facebook->getSignedRequest(); $object = $sr['objects'][0]['url']; $action =
$sr[‘action_link’][‘type’]; if ($action === ‘crocos-coupon:get’) { // Ϋʔϙϯൃߦॲཧ } return [‘success’ => ‘true’];
‣Crocos Enginnering BlogΛݟ ͍ͯͩ͘͞ʂ ‣ http://engineering.crocos.jp/ ‣͝ਗ਼ௌ͋Γ͕ͱ͏͍͟͝·ͨ͠ まとめ