通过网络应用程序登录FB后的空白屏幕？

Posted 2023-03-31

【中文标题】通过网络应用程序登录FB后的空白屏幕？

【英文标题】：blank white screen after FB login via web app?

【发布时间】：2011-11-05 11:13:36

【问题描述】：

我已尝试按照以下位置的 FB 移动网站“入门指南”进行操作： https://developers.facebook.com/docs/guides/mobile/web/ 对于我在 iPhone 上全屏打开的网络应用程序。

但是当我尝试使用打开的 fb 登录页面登录时，单击“登录”按钮后出现空白屏幕。虽然用户已登录.. 我知道这一点，因为如果我关闭并重新打开我的网络应用程序，我会检查登录状态并尝试获取一些用户信息，它工作正常......

当我在桌面的 chrome 或 iphone 的 safari 中尝试相同的网络应用程序时，登录过程正常...它仅在全屏网络应用程序中中断。

有什么想法吗？我只是遵循 FB 的示例代码:-(

谢谢。

【问题讨论】：

我遇到了同样的问题。如果我发现任何东西，我会告诉你，请做同样的事情:)

【参考方案1】：

您需要做的就是将“display:'touch'”和redirect_uri参数添加到登录中：

FB.login(function(response) 
   if (response.authResponse) 
     console.log('Welcome!  Fetching your information.... ');
     FB.api('/me', function(response) 
      console.log('Good to see you, ' + response.name + '.');
       FB.logout(function(response) 
         console.log('Logged out.');
       );
     );
   else 
    console.log('User cancelled login or did not fully authorize.');
  
, scope: 'email,publish_stream' , redirect_uri: 'YOUR_REDIRECT_URL' , display : 'touch');

【参考方案2】：

我在这篇文章中找到了更好的答案：FB.login broken flow for ios WebApp

var permissions = 'email,publish_stream,manage_pages,read_stream';
var permissionUrl = "https://m.facebook.com/dialog/oauth?client_id=" + m_appId + "&response_type=code&redirect_uri=" + encodeURIComponent(m_appUrl) + "&scope=" + permissions;
window.location = permissionUrl;

Mark 的上述回答不再适用了……Facebook 往往会像这样破坏事情。使用 window.location 显示登录页面就可以了。

我的应用在我登录后需要刷新，所以效果很好。因此，如果您不想刷新，可能需要重新考虑您的流程。

【参考方案3】：

我找到了解决此问题的方法...似乎有一个未记录的“redirect_uri”属性我可以在 login() 方法中使用，例如

login(scope:'email', redirect_uri:'where_to_go_when_login_ends')

它是为 fb 桌面 SDK 记录的，所以我试了一下，它有点工作。当我说“有点”时，我的意思是在网络移动设备上看起来还可以，但是如果您尝试在桌面浏览器中运行它，登录弹出窗口将重定向到登录弹出窗口中的给定 URL - 而不是在其父窗口中.

我希望这足够好并且不会造成任何副作用，我真的说不出来。但由于缺乏其他选项，我将在此期间使用它:^)

【讨论】：

sagimann 我非常爱你！它很hacky，并且可以解决，但现在可以使用！！！！非常感谢您发现/发布这个错误，这让我很生气！

所以这意味着我不应该使用登录回调来处理响应。由于页面重新加载，它总是会转到 FB.getLoginStatus？我现在正在尝试这样做，但没有成功，FB.getLoginStatus 永远不会触发它的回调。

这个库让我想哭

终于弄明白了，FB.getLoginStatus 出于某种原因真的很脆弱。再次感谢！

还需要一种方法来确定 Web 应用程序是在桌面还是移动设备上运行，以便您知道何时使用 redirect_uri。向谷歌询问.. detectmobilebrowsers.com

【参考方案4】：

这可能是 facebooks API 中的错误。我认为他们没有在 iPhone 网络应用程序模式下测试过他们的 API。可以在此处关注问题： https://developers.facebook.com/bugs/317323871621290