{橙是蛋}設計工坊

1.首先要先有一組Facebook帳號,並且登入Facebook

2.連結到 Facebook開發人員 頁面 https://developers.facebook.com/

3. 接下來我們要建立新的應用程式 選擇上面的 [應用程式]

4. 選擇 [+建立新的應用程式]  

5.輸入應用程式名稱
 

6.填寫安全驗證碼


7.APP ID 為之後使用應用程式的授權ID
 

8.取的APP ID後就可以開始使用FB API

9.首先我們可以使用連結的方式取得使用者授權應用程式可以取得使用者FB資訊

client_id=xxxxxxxxxx 紅色部份換成上一步取得的APP ID

redirect_uri 就是授權成功後將導回來的網址

<a href="https://www.facebook.com/dialog/oauth?client_id=xxxxxxxxxx&redirect_uri=http://abpop23.ofsun.com/html/getFB.php">取得FB</a>

10.只要點選 "取得FB" 就會連結到Facebook做授權確認,但也只有在未登入Facebook和第一次授權才會出現這個畫面

 

11.最後只要在導回來之後的畫面使用 FB.getLoginStatus 就可以取得使用者的 UID
必須引用Facebook JavaScript SDK 檔 ,並且宣告Facebook運作附加的元素<div id="fb-root"></div>

使用FB.init 初始化 appId:'xxxxxxxxxx' 紅色部份換成您的APP ID
最後在使用 FB.getLoginStatus 就可以取得使用者的 Facebook 的 UID

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
<script type="text/javascript" src="http://connect.facebook.net/zh_TW/all.js"></script>
<div id="fb-root"></div>
<span id="uid"></span>
    <script type="text/javascript">
        FB.init({ appId: 'xxxxxxxxxx',
            status: true,
            cookie: true,
            xfbml: true,
            oauth: true
        });
        $(document).ready(function() {
            FB.getLoginStatus(function(response) {
              if (response.status === 'connected') {
                //使用者登入Facebook並授權使用應用程式
                var uid = response.authResponse.userID;
                $("#uid").html(uid);
              } else if (response.status === 'not_authorized') {
                //使用者登入Facebook取消授權使用應用程式
                window.location.href='toFB.php'
              } else {
                //使用者尚未登入Facebook
                window.location.href='toFB.php'
              }
             });
        });
    </script>