javascript FB.Login(..) 时 Facebook iFrame 应用程序中的 Chrome-only 跨域脚本错误

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/5093790/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-10-25 15:55:49  来源:igfitidea点击:

Chrome-only cross-domain scripting errs in Facebook iFrame App upon FB.Login(..)

javascriptgoogle-chromefacebook-iframefacebook-javascript-sdk

提问by John K

In Google Chrome (I'm on 9.0.597.98) my Facebook iFrame appusing Graph API/Javascript SDK tends to always throw the following two JavaScript errors (see below) based on cross-domain scripting, but only on one page of the app.

在谷歌浏览器(我在 9.0.597.98)中,我使用 Graph API/Javascript SDK 的Facebook iFrame 应用程序往往总是基于跨域脚本抛出以下两个 JavaScript 错误(见下文),但仅在应用程序的一页上.

It goes into an endless retry loop on the second message. After leaving it overnight, it reported a half million retries by this morning!

它在第二条消息上进入无限重试循环。放置了一夜之后,今天早上它报告了五十万次重试!

The FB call being used is for login:

正在使用的 FB 调用用于登录:

FB.login(function(response) {
  if (response.session) {
    // user successfully logged in
  } else {
    // user cancelled login
  }
});

In Firefox and IE9 I do not get these errors. It's specific to Chrome (maybe WebKit). What's odd is I have a second page in the app that uses FB.Loginand it works in Chromein addition to the other browsers. I read somewhere that Safari has more stringent requirements on cross domain scripting - it and Chrome share the same code base.

在 Firefox 和 IE9 中,我没有收到这些错误。它特定于 Chrome(可能是 WebKit)。 奇怪的是,我在应用程序中有第二个页面FB.Login,除了其他浏览器之外,它还可以在 Chrome使用。我在某处读到 Safari 对跨域脚本有更严格的要求 - 它和 Chrome 共享相同的代码库。

Domains, protocols and ports must match(error message) I believe is actually satisfied because I have another page that works with the FB.Logincall The only other difference I see between these two messages is the postmessagequery argument has a different value for each (bolded in the messages).However there is only one iFrame that constitutes a Facebook app so I wonder why two different values might be used one after the other. I don't mean to lead answers to focus on this item, but I did want to point it out.

Domains, protocols and ports must match(错误消息)我相信实际上很满意,因为我有另一个页面可以与FB.Login调用一起使用 我看到这两条消息之间的唯一其他区别是postmessage查询参数对每个都有不同的值(在消息中加粗)。然而,只有一个 iFrame 构成了 Facebook 应用程序,所以我想知道为什么可能会一个接一个地使用两个不同的值。我并不是要引导答案集中在这个项目上,但我确实想指出它。

Suggestions are welcome as to what I might try to resolve this errors.

欢迎提出有关我可能会尝试解决此错误的建议。

Chrome JavaScript Console Messages:

Chrome JavaScript 控制台消息:

Message 1: Unsafe JavaScript attempt to access frame with URL

消息 1:不安全的 JavaScript 尝试使用 URL 访问框架

https://www.facebook.com/dialog/permissions.request?api_key=168297653202478&app_id=168297653202478&display=popup&fbconnect=0&locale=en_US&method=permissions.request&next=http%3A%2F%2Fstatic.ak.fbcdn.net%2Fconnect%2Fxd_proxy.php%23cb%3Df3d15633dc%26origin%3Dhttp%253A%252F%252Fsubdomain.example.com%252Ff22a8befa%26relation%3Dopener%26transport%3Dpostmessage%26frame%3D f111baf6f4%26result%3D%2522xxRESULTTOKENxx%2522&perms=publish_stream%2Coffline_access&return_session=1&sdk=joey&session_version=3 from frame with URL http://subdomain.example.com/colonversationmap/Admin.TestPage.aspx?signed_request=871miFgH_-o05POnx20387XHd2YlArKLU6qUv8VkxY4.eyJhbGdvcml0aG0iOiJITUFDLVNIQTI1NiIsImlzc3VlZF9hdCI6MTI5ODQyMDEwMSwidXNlciI6eyJjb3VudHJ5IjoiY2EiLCJsb2NhbGUiOiJlbl9VUyIsImFnZSI6eyJtaW4iOjIxfX19. Domains, protocols and ports must match.

https://www.facebook.com/dialog/permissions.request?api_key=168297653202478&app_id=168297653202478&display=popup&fbconnect=0&locale=en_US&method=permissions.request&next=http%3A%2F.net%2Fstatic PHP%23CB%3Df3d15633dc%26origin%3Dhttp%253A%252F%252Fsubdomain.example.com%252Ff22a8befa%26relation%3Dopener%26transport%3D PostMessage的%26frame%3D f111baf6f4%26result%3D%2522xxRESULTTOKENxx%2522&烫发= publish_stream%2Coffline_access&return_session = 1&SDK = joey&session_version=3 来自带有 URL 的框架http://subdomain.example.com/colonversationmap/Admin.TestPage.aspx?signed_request=871miFgH_-o05POnx20387XHd2YlArKLU6qUv8VkxY4.eyJhbGdvcml0aG0iOiJITUFDLVNIQTI1NiIsImlzc3VlZF9hdCI6MTI5ODQyMDEwMSwidXNlciI6eyJjb3VudHJ5IjoiY2EiLCJsb2NhbGUiOiJlbl9VUyIsImFnZSI6eyJtaW4iOjIxfX19。域、协议和端口必须匹配。

Message 2: Unsafe JavaScript attempt to access frame with URL

消息 2:不安全的 JavaScript 尝试使用 URL 访问框架

https://www.facebook.com/dialog/permissions.request?api_key=168297653202478&app_id=168297653202478&display=popup&fbconnect=0&locale=en_US&method=permissions.request&next=http%3A%2F%2Fstatic.ak.fbcdn.net%2Fconnect%2Fxd_proxy.php%23cb%3Df304d46e08%26origin%3Dhttp%253A%252F%252Fsubdomain.example.com%252Ff23ce8203%26relation%3Dopener%26transport%3Dpostmessage%26frame%3D fcd3637bc%26result%3D%2522xxRESULTTOKENxx%2522&perms=publish_stream%2Coffline_access&return_session=1&sdk=joey&session_version=3 from frame with URL http://subdomain.example.com/colonversationmap/Admin.TestPage.aspx?signed_request=871miFgH_-o05POnx20387XHd2YlArKLU6qUv8VkxY4.eyJhbGdvcml0aG0iOiJITUFDLVNIQTI1NiIsImlzc3VlZF9hdCI6MTI5ODQyMDEwMSwidXNlciI6eyJjb3VudHJ5IjoiY2EiLCJsb2NhbGUiOiJlbl9VUyIsImFnZSI6eyJtaW4iOjIxfX19. Domains, protocols and ports must match.

https://www.facebook.com/dialog/permissions.request?api_key=168297653202478&app_id=168297653202478&display=popup&fbconnect=0&locale=en_US&method=permissions.request&next=http%3A%2F.net%2bFstatic PHP%23CB%3Df304d46e08%26origin%3Dhttp%253A%252F%252Fsubdomain.example.com%252Ff23ce8203%26relation%3Dopener%26transport%3D PostMessage的%26frame%3D fcd3637bc%26result%3D%2522xxRESULTTOKENxx%2522&烫发= publish_stream%2Coffline_access&return_session = 1&SDK = joey&session_version=3 来自带有 URL 的框架http://subdomain.example.com/colonversationmap/Admin.TestPage.aspx?signed_request=871miFgH_-o05POnx20387XHd2YlArKLU6qUv8VkxY4.eyJhbGdvcml0aG0iOiJITUFDLVNIQTI1NiIsImlzc3VlZF9hdCI6MTI5ODQyMDEwMSwidXNlciI6eyJjb3VudHJ5IjoiY2EiLCJsb2NhbGUiOiJlbl9VUyIsImFnZSI6eyJtaW4iOjIxfX19。域、协议和端口必须匹配。

回答by bluehazetech

I also ran into an issue where the getLoginStatus()was not being called in Chrome. I tried calling it on page load and after a user-initiated action with no success.

我还遇到了在 Chrome 中没有调用getLoginStatus()的问题。我尝试在页面加载和用户启动的操作后调用它,但没有成功。

It turned out that it was not a cross-domain issue. The call was being blocked by the Un-Passwordiseextension in Chrome. As soon as I disabled the extension, it worked perfectly, even on page load.

结果证明这不是跨域问题。通话被Chrome 中的Un-Passwordise扩展程序阻止。一旦我禁用了扩展程序,它就可以完美运行,即使在页面加载时也是如此。

More info about this issue here: FB.getLoginStatus never fires the callback function in Facebook's JavaScript SDK

有关此问题的更多信息:FB.getLoginStatus 从不触发 Facebook 的 JavaScript SDK 中的回调函数

回答by Jhony Fung

I had this problem on my site, but turned out I was using old version of FB.login.

我在我的网站上遇到了这个问题,但结果我使用的是旧版本的 FB.login。

From Facebook FB.loginpage:

从 Facebook FB.login页面:

As of December 13th, 2011, the JavaScript SDK now only supports OAuth 2.0 for authentication. The ability to enable OAuth 2.0 in the JS SDK was first introduced in July. All apps were given until October 1, 2011 to test and migrate. With this change, please ensure that you replaced response.sessionwith response.authResponse. To ask for permissions, you must use scopeinstead of perms. Read more about the specific changes here.

截至 2011 年 12 月 13 日,JavaScript SDK 现在仅支持 OAuth 2.0 进行身份验证。在 JS SDK 中启用 OAuth 2.0 的功能于 7 月首次推出。所有应用程序都在 2011 年 10 月 1 日之前进行测试和迁移。进行此更改后,请确保您替换response.sessionresponse.authResponse. 要请求权限,您必须使用scope代替perms。在此处阅读有关具体更改的更多信息。

回答by John K

For my case, it turned out that Chrome complained whenever I called the Facebook JavaScript API's FB.login(..)method immediately upon Page or DOM load.

就我而言,事实证明,每当我FB.login(..)在页面或 DOM 加载时立即调用 Facebook JavaScript API 的方法时,Chrome 就会抱怨。

To circumvent this problem in Chrome I put a button on the page that the user must click to initiate the login script. That works in Chrome. It's a workaround but good enough for me for now.

为了在 Chrome 中规避这个问题,我在页面上放置了一个按钮,用户必须点击该按钮才能启动登录脚本。这在 Chrome 中有效。这是一种解决方法,但目前对我来说已经足够了。

note:For the secondary page that I mentioned in my question that works, it already was set up for user-initiated login prompt.

注意:对于我在问题中提到的辅助页面,它已经设置为用户启动的登录提示。

回答by Abe

Adding a channel file may help this problem. See the Facebook Javascript API documentation: https://developers.facebook.com/docs/reference/javascript/

添加频道文件可能有助于解决此问题。请参阅 Facebook Javascript API 文档:https: //developers.facebook.com/docs/reference/javascript/