如何正确使用 facebook OAuth2？

Question

在拼命尝试将 facebook 登录系统集成到我的网站 3 天之后，我得出的结论是我惨败。我只是用 JavaScript SDK API 调用创建了一堆乱七八糟的 PHP SDK，结果和预期的一样，没有工作。

我在 Google 和 stackoverflow 上搜索了其他人的问题、教程、解释的答案，但我现在承认自己失败了。

你能给我这个工作的好教程吗？或者你能给我深入了解一下他们的图书馆吗？

希望这不会被关闭。

编辑：这是使用 Facebook 登录系统的推荐方法吗？

编辑 2：

FB.init({ appId : '<?php echo $core->appId; ?>', // App ID from the App Dashboard channelUrl : '//romeo.no-ip.org/94seconds/channel.html', // Channel File for x-domain communication status : true, // check the login status upon init? cookie : true, // set sessions cookies to allow your server to access the session? xfbml : true // parse XFBML tags on this page? });

此代码生成FB.getLoginStatus() called before calling FB.init().

我的页面如下所示：

<!DOCTYPE html>
<html>
    <head>
        <script src="../node_modules/socket.io/node_modules/socket.io-client/dist/socket.io.js"></script>
    </head>
    <body>
        <div id="fb-root"></div>
        <script>
          window.fbAsyncInit = function() {
                FB.init({
                  appId      : '<?php echo $core->appId; ?>', // App ID from the App Dashboard
                  channelUrl : '//romeo.no-ip.org/94seconds/channel.html', // Channel File for x-domain communication
                  status     : true, // check the login status upon init?
                  cookie     : true, // set sessions cookies to allow your server to access the session?
                  xfbml      : true  // parse XFBML tags on this page?
                });
          };

          // Load the SDK's source Asynchronously
          // Note that the debug version is being actively developed and might 
          // contain some type checks that are overly strict. 
          // Please report such bugs using the bugs tool.
          (function(d, debug){
             var js, id = 'facebook-jssdk', ref = d.getElementsByTagName('script')[0];
             if (d.getElementById(id)) {return;}
             js = d.createElement('script'); js.id = id; js.async = true;
             js.src = "//connect.facebook.net/en_US/all" + (debug ? "/debug" : "") + ".js";
             ref.parentNode.insertBefore(js, ref);
           }(document, /*debug*/ false));
        </script>
    </body>
</html>

编辑 3：没关系，我刚刚意识到我已经花了 3 - 4 个小时打墙，因为我放错了一些代码。我已经失去了错误。 :D 谢谢你们。

Answer 1

兄弟，给你！

1. 这会将 fb js sdk 添加到您的页面

   (function(d, s, id) {
       var js, fjs = d.getElementsByTagName(s)[0];
       if (d.getElementById(id)) return;
       js = d.createElement(s);
       js.id = id;
       js.src = "//connect.facebook.net/en_US/all.js#xfbml=1&appId=" + APP_ID;
       fjs.parentNode.insertBefore(js, fjs);
   }(document, 'script', 'facebook-jssdk'));
   

2. 这将通知您用户是否已登录或他当前的状态

   window.fbAsyncInit = function() {
   
       // Additional init code here
       FB.getLoginStatus(function(response) {
           if (response.status === 'connected') {
               // logged in and connected
   
           } else if (response.status === 'not_authorized') {
           // not_authorized - the user has not authorized ur app
   
           } else {
           // User is not_logged_in
   
           }
       });
   
       FB.Event.subscribe('edge.create',
           function(response) {
               //Not relevant here
               //User has just liked your page
               //likeHandler(response);
           });
   };
   

3. 这是为了让用户登录

   function Login() {
       FB.login(function (e) {
           //        console.log(e.authResponse);
           if (e.authResponse) {
               M_access_token = e.authResponse.accessToken;
   
               //custom function to get user details
               get_details();
           } else {
           //            console.log("Error : Failed to Authorize")
           }
       }, {
           scope: "email,user_likes,publish_stream"
       })
   }
   
   //Notice the scope param above
   

4. 这是为了注销用户

   function Logout() {
       FB.logout(function(response) {
           // user is now logged out
           });
   }
   

5. 自定义函数Get_details

   function get_details(typeCalled) {
       FB.api("/me?fields=name,id,email,gender,username,picture", function (e) {
           fbUserObject = e;
           //        M_user_id = e.id;
           //        M_user_full_name = e.name;
           //        M_user_email = e.email;
           //        M_user_gender = e.gender;
           //        M_username = e.username;
           //picture = e.picture.data.url;
       });
   }
   

6. 获得用户数据后，您可以将其传递给服务器并设置会话。一旦用户单击注销按钮，您应该清除服务器上的会话。

一切顺利！ :)