使用Facebook C# SDK 進行帳號驗證 (使用VB.Net)

2012-03-08

23439
0
.Net
2012-03-08

Facebook C# SDK 與ASP.Net應用

最近系統要加入Facebook帳戶驗證的功能，但是上了Facebook Developers ，你會很失望，

因為FB有ios、Android、PHP、java script的SDK，就是沒有for .Net的，真的是瞧不起我們微軟幫的嗎！= =

不過不用怕，有個連微軟都推薦的Facebook C# SDK，不過在這邊得說個老實話，文件跟Sample都太少了，然後使用VB.Net的更少

隨著Facebook驗證方式的更動，網路上很多文章都已經是不能參考的了。

這也是為什麼我要寫這篇文章，因為我光Try個登入驗證，就Try了快10個小時，而且最後發現還是錯在很笨的地方= =”

所以我決定我自己一個人浪費生命就好，希望能幫到有相同需求的人。

安裝 Facebook C# SDK

首先呢，我們先來安裝 Facebook C# SDK，你可以上他們的網站，他們建議使用NuGet來安裝，以增加日後維護的便利性

至於什麼是NuGet，可以參考保哥的這篇文章介紹好用 Visual Studio 2010 擴充套件：NuGet 套件管理員

假設你已經安裝了NuGet，只要在 Package Manager Console 中輸入 PM> Install-Package Facebook，即可成功安裝 Facebook C# SDK，

並且會發生兩個動作，反之如果你下指令移除，也會自動取消掉這兩件動作：

會自動在你的專案下的bin資料夾，新增一個facebook.dll

在web.config增加facebookSettings的區段

申請一個Facebook的應用程式

因為我們要跟fb溝通，所以必須要按照他的規定來，這沒啥好討論的，所以就上去 Facebook Developers 去建立一個應用程式

並取得 App ID跟 App Secret，之後與FB的溝通要靠他們。

建立本機的測試環境

因為程式要除錯，但是剛新建的應用程式，需要設定轉址的網址，而且不接受 " http://Localhost " 這樣的設定，

所以我們必須先騙Facebook跟自己連到的是一個正常的網站，

所以我們先修改 %systemroot% \system32\drivers\etc 中的hosts檔案，新增一筆 "127.0.0.1 www.test.com"'

然後到FB剛剛建立的應用程式中，將網站的位址設定為 "http://www.test.com:47694"

記住要連port一起填寫唷，不然會沒辦法連線，網址的最後面的 "/" 可加可不加，無所謂。

然後在WEB.CONFIG檔，填入你申請的應用程式的App ID跟 App Secret

例如： <facebookSettings appId="388713456723357885830" appSecret="dbad534543b601543534666greggrr55ce47484f3608" />

了解Facebook的驗證流程

如下圖，簡單來說就是你要過個幾關，才能取得使用者的資料，我想透過程式碼直接演繹，會比較容易了解些。

程式流程說明

1. 導向驗證網址，取得Access Code (會出現FB的登入視窗)

我的作法是直接新增一個ImageButton，然後寫入導向的code，這樣可以避免些client的程式撰寫，

其中client_id是剛剛新建應用程式的App ID，redirectUrl 是登入成功後要導向回來的處理網址，

scope是向FB要求的授權，也就是你想取得使用者的那些資料，請參考http://developers.facebook.com/docs/reference/api/permissions/

然後只要丟向FB規定的網址，只要你有APP ID，他就會回傳給你一個Access Code。

Protected Sub IB_fb_Click(sender As Object, e As System.Web.UI.ImageClickEventArgs) Handles IB_fb.Click
    Dim clientId As String = "123456789123456789"
    Dim redirectUrl As String = http://www.test.com:47694/fb_login.aspx
    Response.Redirect(String.Format("https://graph.facebook.com/oauth/authorize?client_id={0}&redirect_uri={1}&scope=offline_access,user_status,email", clientId, redirectUrl))

End Sub

2. 利用Access Code，再次跟FB要求取得Access Token

承上步驟，網頁應該已經導回fb_login.aspx，所以在這頁，我們在進行取得權杖的動作

Protected Sub Page_Load(sender As Object, e As System.EventArgs) Handles Me.Load
   '取得一開始的驗證碼
    Dim fbCodeGiven As String = Request.QueryString("code")
        Dim fbset = ConfigurationManager.GetSection("facebookSettings")
        Dim clientId As String = fbset.appid
        Dim client_secret As String = fbset.appSecret
        Dim redirect_uri As String = http://www.test.com:47694/ws_search/fb_login.aspx

       '取得Access Token，再次丟向另一個驗證Access_token的網址，這次要加上client_secret參數，就是新建應用程式的App Secret
       Dim getAccessToken As String = ""
       If Not fbCodeGiven Is Nothing Then

                Dim AccessTokenWebRequest As WebRequest = WebRequest.Create(String.Format("https://graph.facebook.com/oauth/access_token?client_id={0}&redirect_uri={1}&client_secret={2}&code={3}", clientId, redirect_uri, client_secret, fbCodeGiven))
                Dim AccessTokenWebRequestStream As New StreamReader(AccessTokenWebRequest.GetResponse().GetResponseStream())
                Dim WebRequestResponse = AccessTokenWebRequestStream.ReadToEnd()
                getAccessToken = WebRequestResponse.Split("=")(1).Split("&")(0)

    '換Facebook C# SDK 接手
           Dim FBApp As New FacebookClient(getAccessToken)
           Dim user = FBApp.Get("me")
           Dim FBUID = CType(user.id, Int64)
           Dim username As String = ""
             Dim email As String = ""

             Dim firstName As String = ""
             Dim lastName As String = ""
             firstName = user.first_name
             lastName = user.last_name
             email = user.email
             username = user.username

            '儲存驗證帳號資料並將網頁導入你想要的會員功能頁面。

       End If
   End Sub

補充：

1. 當你取得AccesToken的時候，只要驗證成功，FB回傳給你的是類似這樣的字串 "

access_token=AAAFhiFZCSxYYBAHezfB2g7giyzfewfldDhxsdToiXpFu7nhfwef2k6YY0aAlshvNw18SA1gtt44wu32s4i5pyBFhhjD&expires=5140763"，

但是你只需要紅色字的部分，之前版本的FB並不會回傳expires=5140763，我只因為沒注意到這個問題，居然卡關幾個小時…，

因為FB只會回傳錯誤訊息error validating application，只能說真的是很無言XD

希望對有需要的人有幫助。2012/3/8 iPad3發表前10分鐘

回首頁