Facebook Open Graph試玩心得

Facebook前一陣子宣佈了Open Graph這東西，說實在反應很兩極化，多半都是跟隱私權有關係，另一個部份就是跟使用者行為的精準度分析有關，一但讓Facebook的手滲透入大部份使用者的網站或Blog之後，Facebook所能得到的資料可是非常值錢的東西啊…。


不過這種邪惡的趨勢及商業行為的東西不是今天這篇要聊的。



今天試玩了一下Open Graph，所以就來寫寫心得。




所以Open Graph是…？
其實Open Graph跟Facebook Connect感覺起來「差不多」，畢竟是要來取代Facebook Connect的，基本上大概分兩部份：

1. Graph API：資料查詢的api，使用的是Open Graph Protocol ，目前為止查詢的資料還是以Facebook裡的資料為主，但既然已經有了semantic的雛型…以後等資料量夠多時，應該就可以跟Google一拼了吧…。

2. Social Plugin：大部份的人最喜歡的應該就是這個了，可以很簡單的把一些Facebook的東西放到自己網站上。不過說穿了這個就是Facebook Connect裡的XFBML。所以為了要讓更多人可以很方便的在自己的網站上放入Social Plugin，Open Graph已經不需要放置一個xd_receiver.htm檔，所以現在連Blog也可以置入Social Plugin，我試了一下，在這個blog的每篇文張都放了個「讚」跟「分享鈕」，而且沒花很多時間，很容易就可以上手…。



登入認證方式的改變
這應該是最讓人「驚恐」的部份，從Open Graph開始，登入權限的認證方式改用OAuth 2.0，舊式取得Session的方法將會在Facebook正式廢掉Connect之後失效。(好想哭啊… 光是要改寫舊有的一些案子就要改死了…)

更讓人冷汗直冒的，就是一想到如果將來連一些舊有的api都要改成Graph API來查詢資料時，那... 就很哭哭了。希望Facebook可以「慢慢的」廢掉Connect。


實作時間
1.申請Application：嗯，Open Graph一樣要申請Application，申請頁面變成這裡：http://developers.facebook.com/setup/。申請完後的管理介面一樣會跟你現有的一些App一樣，所以我不曉得為啥申請的位置不同，我想應該只是進入點不同而已吧？

2.初始化OpenGraph：嗯，跟Facebook Connect一樣，還是要初始化(當然啊)，因為OAuth2.0的認證方式我還沒仔細去看，所以這邊就直接很簡單的照Facebook官方建議的寫法去寫就好了：

在html的body裡放置以下這一段code。
要修改的只有把application id取代成你自己的就好。

<br /> <div id="fb-root"></div><br /> <script><br /> window.fbAsyncInit = function() {<br /> FB.init({appId: '你申請的application id', status: true, cookie: true, xfbml: true});<br /> };<br /> (function() {<br /> var e = document.createElement('script');<br /> e.type = 'text/javascript';<br /> e.src = document.location.protocol +<br /> '//connect.facebook.net/zh_TW/all.js';<br /> e.async = true;<br /> document.getElementById('fb-root').appendChild(e);<br /> }());<br /> </script><br />


就好了!!

3.放一個「讚」的鈕試試：在html的body裡放上這個
<fb:like></fb:like>
然後重讀一下頁面，沒意外的話就會看到一個讚的鈕了。有沒有很快？這種快速把facebook的功能plugin到其它網頁的方法讓我感到很害怕。

4.還有其它一些Social Plugin，可以去這邊看http://developers.facebook.com/plugins

目前有八個，其實應該更多，以前Connect的XFBML其實都可以拿來用，而且如果Facebook要快速擴大這個版圖，一定會再出一些方便的Plugin給非開發人員來用。


題外話，

我個人是很喜歡comments這個Plugin，因為它沒限制你一個網站能放幾個，所以跟本就可以直接拿來當免費的留言版來用…XD。

還有… 「讚」這功能有點小麻煩，Facebook說我們可以盡量把「讚」放到使用者想點「讚」的東西旁邊，可是這個讚是直接針對網址在讚的啊…，所以如果是要讚文章裡的某一段話或是網頁上的某一個東西還不行咧… (其實可以，要生出相對映的「實際網頁」去讓讚去讀就是了)。