[ASP.NET]FACEBOOK使用JavaScript SDK登入

最近也開始研究有關FACEBOOK的登入

在FB的官方文件中都有清楚的說明跟教學文件

相關文件請參考FB JavaScript SDK

雖然有文件不過在實際操作上面還是會有一些問題

所以才會發表這篇文章紀錄一下

首先要先建立申請自己的FB APP來取得APP ID

申請完後看到這些資料就算完成了

其中應用程式ID就是等下我們會用到的ID

而網站URL千萬要是實際的網址(可讓使用者連線)不可以用localhost

如果用localhost的話不管你怎麼測試都無法連線成功

而網站URL路徑指向"自己網域名稱"

在有了這些資訊以後只要在你的登入頁面加入以下程式碼

<div id="fb-root"></div>
    <script type="text/javascript" src="http://connect.facebook.net/zh_TW/all.js"></script>
    <script type="text/javascript">
        FB.init({
            appId: '你自己的應用程式ID',
            status: true,
            cookie: true,
            xfbml: true,
            channelURL: '自己的網域路徑/channel.html', //
            oauth: true
        });

        // 判斷是否已經有FB的login session 如果以登入 可以跳過登入的步驟進行下一步
        FB.getLoginStatus(function (response) {
            if (response.authResponse) {
                FB.api('/me', function (response) {
                    LoginSuccess(response);
                });
            } else {
                FB.login(function (response) {
                    if (response.authResponse) {
                        FB.api('/me', function (response) {
                            LoginSuccess(response);
                        });
                    } else {
                        alert('!authResponse');
                    }
                }, {
                    scope: 'email'
                });
            }
        })
    </script>

接著再新增一個channel.html檔~這檔案裡面只需要一行程式碼

<script src="http://connect.facebook.net/zh_TW/all.js"></script>

接下來把檔案上傳到SERVER上執行
就可以嚕~~
是不是很簡單啊