前面介紹了Open Graph的一些主要的概念,這裏就要跟着嘗試構建,測試和發佈Open Graph app。跟着這個教程,我們來構建一個食譜的應用,用戶可以使用這個應用來發布關於做菜的一些新鮮事。再開始之間,先總覽一遍到底有些什麼步驟。
step1: 創建一個FB應用
step2: 使用Login Button插件來驗證用戶
step3: 通過App Dashboard來定義Objects,Actions和Aggregations
step4: 爲你的用戶發佈Actions
step5: 添加一些Social Plugins到應用中去
step6: 提交你的Actions用於審查
如果中間遇到任何發佈actions的問題,可以去Debug and Troubleshoot頁面。
1. Step1: 創建一個FB應用
直接去App Dashboard,點擊Create New App按鈕,輸入你的app name和一個namespace。一旦你填寫了上述基本初始信息以後,就會跳轉到讓你填寫基本設置的地方。
1). Basic Info
你的app namespace。這個應該是獨一無二的,會被用來管理你的objects和actions。
2). Select how your app integrates with FB
a.選擇"Website" choice(在教程中,我們使用Open Graph演示website integration)
b.輸入一個Site URL,即你的網站的地址
2. Step2: Authentication Users
爲了發佈Open Graph Actions,app需要授予用戶們"publish_actions"的權限。這個可以使用Login Button並將其"scope"參數設置爲"publish_actions"
3. Step3: Define Objects, Actions and Aggregations
在App Dashboard裏面的Open Graph標籤下的"Get Started"子標籤。
1). Define Object Types and Actions Types
其實這個很簡單,填寫一個動詞cook,填寫一個名詞recipe,然後點擊Get Started按鈕,系統就會自動跳轉,並且幫你創建一系列的Action相關的,比如過去時,現在時,單數複數之類的。教程裏面就使用默認值,但是實際開發的時候你可能需要更改很多值。
點擊Save Changes and Next按鈕,就跳轉到了Object的編輯頁面。這裏其實FB也默認地創建好了一些樣例取值,實際開發的過程中根據需要進行更改。在教程中直接Save Changes and Next。
2). Define an Aggregation
在定義好了Action類型和Object類型以後,就可以開始定義Aggregation了。當用戶和你的app進行交互的時候,FB也會將這些actions以aggregation的形式展示在用戶的Timeline上面。在教程中,我們來創建一個aggregation用於展示被cooked的recipes的列表。
a. Data to Display,既然是cook action相關的,那麼這裏就應該填寫爲Cook。
b. Layout Style,選擇List
c. Sort By,選擇Most Recent
d. Aggregation Title,填寫一個切合主題的Title,比如Recently Cooked Recipes
e. Caption Lines,這裏先空着,但是實際開發中需要的話可以去修改
f. Timeline Preview,這裏可以預覽aggregation會怎樣顯示在你的Timeline上
然後點擊Save and Finish。
3). Publish Actions