使用 Web SDK 的 Facebook 登录问题

问题描述 投票:0回答:1

我已将 Facebook OAuth 登录集成到我的网站中。我使用了 Facebook 文档中指定的相同脚本,但弹出窗口出现空白屏幕。在检查浏览器控制台时,我可以看到以下错误消息。我使用了文档中指定的相同脚本并替换了 APPID 和 Graph API 版本。我使用 v19.0 作为 Graph API 版本。

ErrorUtils 捕获错误:

缩小不变式#21945;

后续的非致命错误将不会被记录;看 https://fburl.com/debugjs

我使用了以下代码,

<!DOCTYPE html>
<html>
<head>
<title>Facebook Login JavaScript Example</title>
<meta charset="UTF-8">
</head>
<body>
<script>

  function statusChangeCallback(response) {  // Called with the results from FB.getLoginStatus().
    console.log('statusChangeCallback');
    console.log(response);                   // The current login status of the person.
    if (response.status === 'connected') {   // Logged into your webpage and Facebook.
      testAPI();  
    } else {                                 // Not logged into your webpage or we are unable to tell.
      document.getElementById('status').innerHTML = 'Please log ' +
        'into this webpage.';
    }
  }


  function checkLoginState() {               // Called when a person is finished with the Login Button.
    FB.getLoginStatus(function(response) {   // See the onlogin handler
      statusChangeCallback(response);
    });
  }


  window.fbAsyncInit = function() {
    FB.init({
      appId      : 'APPID',
      cookie     : true,                     // Enable cookies to allow the server to access the session.
      xfbml      : true,                     // Parse social plugins on this webpage.
      version    : 'v19.0'           // Use this Graph API version for this call.
    });


    FB.getLoginStatus(function(response) {   // Called after the JS SDK has been initialized.
      statusChangeCallback(response);        // Returns the login status.
    });
  };
 
  function testAPI() {                      // Testing Graph API after login.  See statusChangeCallback() for when this call is made.
    console.log('Welcome!  Fetching your information.... ');
    FB.api('/me', function(response) {
      console.log('Successful login for: ' + response.name);
      document.getElementById('status').innerHTML =
        'Thanks for logging in, ' + response.name + '!';
    });
  }

</script>


<!-- The JS SDK Login Button -->

<fb:login-button scope="public_profile,email" onlogin="checkLoginState();">
</fb:login-button>

<div id="status">
</div>

<!-- Load the JS SDK asynchronously -->
<script async defer crossorigin="anonymous" src="https://connect.facebook.net/en_US/sdk.js"></script>
</body>
</html>
facebook facebook-graph-api oauth-2.0 oauth facebook-javascript-sdk
1个回答
0
投票

由于它在 Firefox 上运行良好,我相信这是他们这边的一个错误。如果您在调试模式下运行,您会看到以下错误:

facebook.js:35 Uncaught TypeError: Failed to construct 'URL': Invalid URL
    at cleanLink (facebook.js:35:11)
    at onMutation (utils.js:38:7)
    at Array.forEach (<anonymous>)
    at MutationObserver.observe.childList (utils.js:62:15)
© www.soinside.com 2019 - 2024. All rights reserved.