2014-02-16 35 views
0

UPDATE时:错误/空白页为iPhone使用JavaScript FB登录代码

这个问题影响到Chrome和Safari浏览器的应用程序。

我想在我的网站上使用Facebook登录(使用Javascript /解析)用下面的代码。它在PC浏览器中工作正常。

问题与Chrome应用

错误,不支持的浏览器:谷歌iOS版Chrome不支持 此功能。请使用Safari并再试一次

它停在以下网址(我已将敏感数据更改为XXXX)。 Safari浏览器的应用程序

https://m.facebook.com/dialog/oauth?app_id=XXXX&client_id=XXXX&display=touch&domain=kudosoo.com&e2e=%7B%7D&locale=en_US&origin=2&redirect_uri=http%3A%2F%2Fstatic.ak.facebook.com%2Fconnect%2Fxd_arbiter.php%3Fversion%3D40%23cb%3Df2562075ac%26domain%3DXXXX.com%26origin%3Dhttp%253A%252F%252Fkudosoo.com%252Ff3714a6424%26relation%3Dopener%26frame%3Df2a549beb4&response_type=token%2Csigned_request&sdk=joey

问题

它停止有我的脚本来执行登录脚本的网页上,甚至用浏览器刷新它不会搬过去这一页,不记录用户英寸


我看过一些帖子这里FB.login broken flow for iOS WebApp,但不确定他们是否会解决,或者在何处放置代码?

我的代码如下:

<!doctype html> 

<!-- Runs Parse and FB code that uses Facebook authentication to login user to the site and redirects them to the main content area. This page is fired from the Facebook button being clicked on the site landing page--> 


<html lang="en"> 
<head> 
    <meta charset="utf-8"> 
    <meta name="apple-mobile-web-app-capable" content="yes"> 
    <meta name="apple-mobile-web-app-status-bar-style" content="black"> 
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, user-scalable=no"> 

    <title>Fb Login</title> 

    <script type="text/javascript" src="http://www.parsecdn.com/js/parse-1.2.16.min.js"></script> 


</head> 
<body> 

    <!-- Important, must be on the page --> 
    <div id="fb-root"></div>  


    <!-- Initialize the Parse object--> 
    <script type="text/javascript">  
    Parse.initialize("XXX", "XXX"); 


//Fb app information// 

window.fbAsyncInit = function() { 
    Parse.FacebookUtils.init({ 
     appId  : 'XXX', 
     channelUrl : 'http://XXXX/channel.html', 
     status  : true, 
     cookie  : true, 
     xfbml  : true 
    }); 

//FB user authentication script, after this completes it fires todos_two.js to redirect user to main content page// 

Parse.FacebookUtils.logIn(null, { 
    success: function(user) { 
     if (!user.existed()) { 
      alert("User signed up and logged in through Facebook!"); 
      window.location.href="user_home.html"; 
     } else { 
      alert("User logged in through Facebook!"); 
      window.location.href="user_home.html"; 
     } 
    }, 
    error: function(user, error) { 
     alert("User cancelled the Facebook login or did not fully authorize."); 
    } 
}); 


}; 

(function(d, s, id){ 
    var js, fjs = d.getElementsByTagName(s)[0]; 
    if (d.getElementById(id)) {return;} 
    js = d.createElement(s); js.id = id; 
    js.src = "//connect.facebook.net/en_US/all.js"; 
    fjs.parentNode.insertBefore(js, fjs); 
}(document, 'script', 'facebook-jssdk')); 


</script> 

</body> 
</html> 
+0

您是使用iOS上的Chrome浏览器还是使用Safari? – jackslash

+0

@jackslash是的,这是一个已知的问题? – Dano007

回答

1

所以你说你使用的是Chrome的意见。错误消息很明显:

错误,不支持浏览器:Google Chrome for iOS不支持此功能。请使用Safari浏览器,然后再试一次

浏览器不支持。你必须使用Safari浏览器才能使用Facebook登录。

我会假设你足够聪明,想通了这一点,那你真正问的是,为什么是这种情况。 Googling找到了这个问题的答案。

Facebook OAuth "Unsupported" in Chrome on iOS

引领我们here它告诉我们存在阻止其正常工作的iOS在浏览器的错误。

可以解决此问题通过使用本文档基于重定向登录流程:

https://developers.facebook.com/docs/facebook-login/manually-build-a-login-flow

+0

感谢您花时间写出详细的回复。正如你可能已经猜到了,我正在学习,因此我的技能不如其他人那么优秀。基于这个链接,这只是在上面使用这个代码的一个例子吗? https://www.facebook.com/dialog/oauth? client_id = {app-id} &redirect_uri = {redirect-uri} – Dano007

0

这个问题的答案是两个部分。

首先,Chrome的问题是根据他的回答中的@jackslash评论。

其次,代码在登录成功完成后使用警报通知用户。在iPhone上的Safari浏览器中,即使调整了浏览器设置,这也是一个问题。我通过从代码中完全删除警报来解决它。之后,登录过程按要求运行。