Question

我正在尝试将Facebook登录功能实施到我的网站。我按照说明操作，并尽可能正确地输入代码。这是我的代码：

<div id="fb-root"></div>
<div class="fb-login-button" data-scope="email" >Login with Facebook</div>
<script>
    window.fbAsyncInit = function() {
      FB.init({
        appId      : 'MY_APP_ID',
        status     : true, 
        cookie     : true,
        xfbml      : true,
        oauth      : true,
      });
    };
    (function(d){
       var js, id = 'facebook-jssdk'; if (d.getElementById(id)) {return;}
       js = d.createElement('script'); js.id = id; js.async = true;
       js.src = "//connect.facebook.net/en_US/all.js";
       d.getElementsByTagName('head')[0].appendChild(js);
     }(document));

如果你看到我不知道的事情，请告诉我。这应该尽我所知（按照facebook的说明）。

感谢您的帮助。

Answer 1

当我遇到同样的问题时，我发现了它。 ,之后您不应该oauth:true。见下文

FB.init({
    appId      : 'MY_APP_ID',
    status     : true, 
    cookie     : true,
    xfbml      : true,
    oauth      : true, //',' here is causing the problem
});

Answer 2

我假设您正在用您的实际ID替换MY_APP_ID，并关闭您的脚本部分。如果这不是问题，除了您提供的代码段之外，我还需要查看更多HTML源代码。

这是一个示例html页面源，它有一个登录/注销按钮，具体取决于您当前是否登录。它还会在登录时显示登录的用户个人资料图片。这是我根据facebook文档制作的一个示例，但我已经对其进行了测试并且可以正常运行。显然，您需要将app ID替换为实际的应用ID。

<html>
<head>
  <title>Hello World</title>
  <meta name="viewport" content="initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
</head>
<body>

<!-- Display a login if you're coming to the app from outside of facebook -->
 <div id="login">
 <p><button onClick="loginUser();">Login</button></p>
 </div>

 <div id="logout">
   <p><button  onClick="FB.logout();">Logout</button></p>
 </div>

<script>
   function loginUser() {    
     FB.login(function(response) { }, {scope:'email'});     
   }
</script>

<p>Misc page content here...</p>

<!-- Initialize the fb javascript SDK -->
<script>
  window.fbAsyncInit = function() {
    FB.init({ appId: '1234567...', 
              status: true, 
              cookie: true,
              xfbml: true,
              oauth: true});
    FB.Event.subscribe('auth.statusChange', handleStatusChange);  
  };
</script>

<!-- Callback triggered when the user authenticates -->
 <script>
  function handleStatusChange(response) {
      document.body.className = response.authResponse ? 'connected' : 'not_connected';
      if (response.authResponse) {
        console.log(response);

        updateUserInfo(response);
      }
    }
 </script>

<!-- fb javascript SDK import -->
<div id="fb-root"></div>
<script>
  (function() {
    var e = document.createElement('script'); e.async = true;
        e.src = document.location.protocol + '//connect.facebook.net/en_US/all.js';
        document.getElementById('fb-root').appendChild(e);
        }());
</script>

<!--Display the user's face when they log in -->
<div id="user-info"></div>
 <script>
   function updateUserInfo(response) {
     FB.api('/me', function(response) {
       document.getElementById('user-info').innerHTML = '<img src="https://graph.facebook.com/' + response.id + '/picture">' + response.name;
     });
   }
 </script>

<!-- This style sheet changes the name of the body to reflect logged in status, thereby
     cueing to the login logout buttons which one should be visible -->
<style>
  body.connected #login { display: none; }
  body.connected #logout { display: block; }
  body.not_connected #login { display: block; }
  body.not_connected #logout { display: none; }
</style>
</body>
</html>

Facebook在我的网站上登录：“发生错误。请稍后再试。”

2 个答案: