Facebook Javascript SDK - Fb.login 无法在内置浏览器的 Facebook 上运行

Question

我注意到 Facebook FB.Login 功能或 Facebook 登录按钮不再适用于 Android 上使用 Facebook 的应用内浏览器打开的页面。（当用户单击 Facebook 应用程序内的 URL 时，它会在内置浏览器的应用程序中打开）。在 Messenger 上它运行正常。

我不知道这个bug是什么时候开始的。我已经使用 FB.login 函数以及 Facebook 登录按钮进行了测试（https://developers.facebook.com/docs/facebook-login/web/login-button）进行了测试。他们两个得到了相同的结果。它只是刷新页面。

示例代码：

<script>

function LoggedFb(){
       //This is just a sample code. This code when executed from a URL opened from Facebook's Browser ( When user clicks on a url on the Facebook App ), won't run. From Chrome or other browser works fine.
    alert("got in here");
}

</script>

<div class="fb-login-button" data-width="" data-size="large" data-button-type="continue_with" data-auto-logout-link="false" data-onlogin="LoggedFb" data-use-continue-as="false" data-scope=""></div>

</html>

例如，上面的示例在 Chrome 上运行时将正常工作并调用 LoggedFb 函数。当包含此代码的页面从 Facebook 内置浏览器运行时，它只会刷新。

我也尝试过实现 FB.Login 函数，但它也不起作用。

我什至填写了错误报告（https://developers.facebook.com/support/bugs/456215991739392/），但他们说这不是错误。

自从这件事开始以来，我看到很多网站的登录按钮都损坏了。还有其他人遇到过这种情况，或者有解决方案吗？

谢谢。

Answer 1

每当访问来自 Facebook 移动浏览器时。单击 FB.login 不会执行任何操作，因为它已经假定您已登录。您需要做的是使用登录帐户的当前 accessToken 和 userID 来获取使用 FB 的 API 所需的详细信息。

这是 Javascript 的代码示例：

signInWithFB(): void {
FB.getLoginStatus((response: any) => {
  if (response.status !== 'connected') {
    return FB.login((response: any) => {
      this.handleResponse(response)
    }, {
      scope: 'public_profile,email',
      enable_profile_selector: true,
      auth_type: 'rerequest',
      return_scopes: true
    });
  } else {
    this.handleResponse(response)
  }
});
}

handleResponse(response) {
FB.api(`/me?fields=email,picture,first_name,last_name`,
  (response: any) => {
    this._loginService.socialLogin({
      email: response.email ? response.email : '',
      profilePicture: {
        'url': response.picture.data.url,
        'key': ''
      },
      fullName: `${response.firstName} ${response.lastName}`,
      socialId: response.id,
      ...FACEBOOK_LOGIN
    }).
      subscribe(res => {
      })
  })
}