时间戳

首页 > 解决方案 > react-facebook-login 在桌面浏览器上工作，但在移动设备上抛出“URL Blocked: This redirect failed because the redirect URI is not whitelisted”

reactjs - react-facebook-login 在桌面浏览器上工作，但在移动设备上抛出“URL Blocked: This redirect failed because the redirect URI is not whitelisted”

问题描述

我的网络应用stockbets.io使用 Facebook 登录来进行 oauth。在桌面网络浏览器上，这工作正常，我的试点用户在登录时都没有遇到任何问题。但是，当他们在移动设备上尝试完全相同的流程时，我们会收到以下错误：

URL Blocked: This redirect failed because the redirect URI is not whitelisted in the app’s Client OAuth Settings. Make sure Client and Web OAuth Login are on and add all your app domains as Valid OAuth Redirect URIs.

这是我的 Facebook 登录服务设置面板的快照：

在此处输入图像描述

这似乎应该很简单，但我不知道为什么它适用于桌面而不是移动设备。如果您想测试，预期的行为是您应该收到一条消息，说明该产品处于早期测试阶段，但如果您想提前访问，请给我们发送电子邮件。当前发生的是上述错误消息。

有小费吗？

标签： reactjsfacebookfacebook-graph-apioauth

解决方案

根据 GitHub，这似乎与react-facebook-login库有关。根据GitHub 上的一个类似线程......看起来你只需要确保将以下道具添加到你的 React 组件中。

<FacebookLogin
  appId="13xxxxxxxxxxx09"//TODO: Replace yours...
  autoLoad={false}
  fields="first_name, last_name ,email, picture"
  callback={(resp)=>this.responseFacebook(resp)}//TODO: Replace your callback
  cssClass="fbtn"
  disableMobileRedirect={true}
/>

推荐阅读