Question

我有一个PWA应用程序，您必须登录的选项之一是Facebook，一切正常，如果您在浏览器中，则登录效果很好。当您将网站添加到手机中并在PWA中打开，然后单击从Facebook登录时，就会发生问题，它会打开一个空白页面，并且不会重定向到该应用程序，如果您关闭该页面，请返回该应用程序并再次单击该用户已登录的facebook，但是没有人知道如何摆脱白页/空白页吗？

我已经尝试过'redirect_uri'和'display：touch'，但是这些似乎都不起作用了。

Answer 1

使用Facebook作为登录方法时，登录后空白页是一个常见问题，尤其是在我们处于开发模式时。

发生这种情况是因为您已经登录并授权了该应用程序，因此当它再次尝试登录时，它会变成空白。

最简单的解决方法是首先在调用.login（）函数之前检查用户是否已经登录并授权了您的应用。

幸运的是，Facebook提供了一项功能，可以在其中为您处理（几乎）所有事情。

getLoginStatus（）函数

getLoginStatus（）函数确定1）用户是否已登录Facebook和2）用户是否已授权您的应用。

用户有三种可能的状态：

用户已登录Facebook并已授权您的应用，在这种情况下，该函数将返回：已连接。
用户已登录Facebook，但尚未验证您的应用程序，在这种情况下，该函数将返回：not_authorized。
用户未登录Facebook或明确退出了您的应用程序，在这种情况下，我们不知道它是哪一个，这就是它返回的原因：未知。

例如：

当我们调用getLoginStatus（）时，我们将得到一个类似于以下内容的对象：

    {
  authResponse: {
    userID: '12345678912345',
    accessToken: 'kgkh3h4gkh3g4k2h4gk23h4gk2h34gk234gk2h34AndSoOn',
    session_Key: true,
    expiresIn: '5183738',
    sig: '...'
  },
  status: 'connected'
}

您可以看到其中有一个authResponse对象和一个状态对象。我们将首先关注状态对象，检查三个可能的响应中的每一个。

    this.facebookProvider.getLoginStatus(response => {
  if (response.status === 'connected') {
    // User Authenticated and your App is authorized

  } else if (response.status === 'not_authorized') {
    // User authenticated but your app isn't authorized yet.
  } else {
    // the user isn't logged in to Facebook.
  }
});

尝试此操作，然后尝试先从Facebook注销，然后再从PWA拨打电话。

PWA空白页Facebook

1 个答案: