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

  • 23440
  • 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的溝通要靠他們。

    image

     

    建立本機的測試環境

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

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

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

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

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

     

    image

     

    然後在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分鐘