0

我们正在开发一个 React 应用程序（voot.com），它适用于移动设备。

直播网址：https ://m-origin.voot.com

我们在使用 Opera mini 时面临许多问题，其中之一是：

我们无法使用 loginradius.com 进行社交登录。当我们点击“继续使用 facebook”时，应用程序会重定向到第三方 loginradius.com。但是我们没有从 loginradius 得到任何对我们服务器的响应，这就是用户没有通过社交登录登录的原因。

我们正在使用来自http://cdn.loginradius.com/hub/prod/js/CustomInterface.2.js的登录半径的 js 文件。

我们编写了一个回调函数，期望从 loginradius 返回到该回调。但是该回调函数没有在 Opera mini 浏览器中调用，其余浏览器工作正常。

4

1 回答 1

0

看起来像歌剧迷你打开弹出窗口（因为移动浏览器作为新标签）。我的建议是不要在移动设备的情况下打开新窗口。按照步骤解决此问题

1.将此模板添加到您的页面

<script id="loginradiuscustom_tmpl_mobile" type="text/html"><div class="<%=Name%>">
<a class="anchor_<%=Name%>" href="javascript:void()" onclick="window.location.href = '<%=Endpoint%>&same_window=1&callback=<%=createCurrentRoute(window.location.href)%>'">
<span class="icon-image-<%=Name%>" ></span>
<span class="<%=Name%>-text">Continue with <%=Name%></span>
</a>
</div></script>

2.添加此方法检测移动设备

function detectmob() { 
 if( navigator.userAgent.match(/Android/i)
 || navigator.userAgent.match(/webOS/i)
 || navigator.userAgent.match(/iPhone/i)
 || navigator.userAgent.match(/iPad/i)
 || navigator.userAgent.match(/iPod/i)
 || navigator.userAgent.match(/BlackBerry/i)
 || navigator.userAgent.match(/Windows Phone/i)
 ){
    return true;
  }
 else {
    return false;
  }
}

3.替换以下行

options.templatename = "loginradiuscustom_tmpl";

和

if(detectmob()){
    options.templatename = "loginradiuscustom_tmpl_mobile";
}else{
    options.templatename = "loginradiuscustom_tmpl";
}
于 2017-03-29T05:26:13.660 回答