gpt4 book ai didi

ios - 为什么 iframe 中的 FB.Login javascript 调用未在 FB iOS 应用程序中显示 native 登录

转载 作者:可可西里 更新时间:2023-11-01 06:15:28 26 4
gpt4 key购买 nike

我正在尝试使用以下代码(取自 javascript FB.Login 示例)调用 FB iOS 应用程序中的 native 弹出窗口,以允许用户登录并验证我们的应用程序。移动 iOS 应用程序是我们 Web 应用程序页面的主要用例。我们使用框架来允许客户将我们的代码嵌入他们的网站。

下面的示例在直接访问 (fblogin.hml) 时工作​​正常(并显示正确的原生 Facebook iOS 弹出窗口),但在通过 iframe 访问时不显示任何弹出窗口工作。通过 iframe 调用时,对 FB.ui 的任何调用都可以正常工作。这是 Facebook iOS 应用程序和/或 Javascript SDK 中的预期行为还是问题?我们可以通过其他方式从 iFrame 中调用 FB.Login 吗?

登录页面:

... fblogin.html ..

<html>
<head>
<title>FB.Login example</title>
</head>
<body>
<!-- Load the Facebook JavaScript SDK -->
<script src = "//connect.facebook.net/en_US/all/debug.js"></script>

<div id="fb-root"></div>

<script type="text/javascript">

FB.init({
appId: 'YOUR_FACEBOOK_APP_ID',
xfbml: true,
status: true,
cookie: true,
});

// Check if the current user is logged in and has authorized the app
FB.getLoginStatus(checkLoginStatus);

// Login in the current user via Facebook and ask for email permission
function authUser() {
FB.login(function(response) {
console.info('FB.login callback', response);
if (response.status === 'connected') {
console.info('User is logged in');
} else {
console.info('User is logged out');
}
}, {scope:'email'});
}


// Check the result of the user status and display login button if necessary
function checkLoginStatus(response) {
conole.log(response);
if(response && response.status == 'connected') {
alert('User is authorized');

// Hide the login button
document.getElementById('loginButton').style.display = 'none';

// Now Personalize the User Experience
console.log('Access Token: ' + response.authResponse.accessToken);
} else {
alert('User is not authorized');

// Display the login button
document.getElementById('loginButton').style.display = 'block';
}
}
</script>

<a href="https://www.facebook.com/dialog/oauth?client_id=YOUR_FACEBOOK_APP_ID&redirect_uri=http://THIS_URL">Login Using oauth URL</a>
<input id="loginButton" type="button" value="Login Using Javascript SDK" onclick="authUser();" />

</body>
</html>

嵌入页面

... fblogin_embed.html

<html> 
<head><title>Facebook embed test</title>
</head>
<body>
<iframe src="fblogin.html"
frameborder="0"
scrolling="no"
width="100%"
height="100%">
</iframe>
</body>

重现:

  1. 确保您的 Facebook 个人资料尚未授权您的 APP_ID。
  2. 创建 fblogin.html 并将其托管在某个地方。 (记得用您自己的值替换 APP_ID 和 THIS_URL)
  3. 创建 fblogin_embed.html 并将其托管在某处(并确保 iframe url 指向 fblogin.html 的路径。
  4. 在您的 FB 时间线上发布指向 fblogin.html 和 fblogin_embed.html 的链接。
  5. 在您的 Facebook 移动 iOS 应用程序中打开 fblogin.html,然后按登录链接或按钮以显示 native 对话框。这应该可以正常工作。暂时不要授权您的应用,然后按“取消”。
  6. 在您的 Facebook 移动 iOS 应用程序中打开 fblogin_embed.html,然后按相同的登录链接或按钮。这不会显示 native 对话框,也不会返回 FB.Login 响应的任何答案。

最佳答案

这就是我们所做的。如果是不支持的浏览器,我们使用手动网络流程,如果不是 Javascript SDK

  1. 检测 Chrome 和 Facebook 应用内浏览器 IOS。

  2. FB.init 设置“status”= true

    在 FB.getLoginStatus 中检查它是否是不受支持的浏览器使用手动流程其他 sdk FB.login。

redirect_uri - 传递带有父位置的 GET 参数。

例如:

Parent: parent.com
Iframe: iframe.com

redirect_uri = encodeURI('http://iframe.com/YOUR_SERVER_SCRIPT?redirect_uri=http://parent.com');

登录手册:

var fb_s = "https://www.facebook.com/dialog/oauth?client_id=YOUR_APP_ID&scope=PERMISSIONS&response_type=token&redirect_uri=LOCATION_HREF_ENCODED;

服务器脚本:

if (empty($_GET['redirect_uri'])) {
header("HTTP/1.1 301 Moved Permanently");
header("Location: " . $_GET['redirect_uri']);
}

关于ios - 为什么 iframe 中的 FB.Login javascript 调用未在 FB iOS 应用程序中显示 native 登录,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/20336122/

26 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com