加载具有与窗口顶相同协议的内嵌iframe以防止同源策略违反



我们正在开发一个Javascript SDK,用于嵌入式应用程序(作为iframe注入我的网站),以帮助他们使用一些资源,如加载一些对话框:例如授权对话框或共享框(如Facebook)。

我们的SDK使用easyXDM或多或少像这样工作:

HTML Page
----------------------------------------------------------------------------------------------------------------------------
| http/https: www.mysite.com/embedded-app/
|(部分JS类)
|
|- - - - - | ------------------------------------------------------------------------------------------------------------------
|- - - - - | (IFRAME)
|- - - - - | https:// www.some-embedded-app-domain.com /page.html
|- - - - - |(从使用easyXDM的http/https:www.mysite.com/sdk.js加载并实例化SDK)
|- - - - - |
|- - - - - | - - - - - |---------------------------------------------------------------------------------------------------
|- - - - - | - - - - - | ( IFRAME注入easyXDM)
|- - - - - | - - - - - | http/https: www.mysite.com /embedded_provider.html
|- - - - - |- - - - - |(与窗口通讯。)上面要用那些窗口说话。)
|- - - - - |- - - - - |
|- - - - - |- - - - - |
|- - - - - |- - - - - |
|- - - - - |- - - - - |

我的网站可以使用http/https加载,但嵌入的应用程序必须使用总是 https服务。为了允许easyXDM注入的内部iframe与我的站点通信,主机和协议必须在两个url中匹配,否则会导致同源策略冲突。

问题:我如何告诉代码从SDK,这是从外部应用程序URL加载,外部窗口(我的网站)使用http或https,渲染embedded_provider.html使用相同的协议,从而允许两者之间的JS通信?

我能想到的唯一解决方案是以某种方式通知嵌入的应用程序,我们目前正在从http/https浏览,然后它可以正确地实例化它(使用标志use_https或之类),但我宁愿不强迫应用程序知道我们正在使用的协议。

你知道其他的选择吗?

谢谢!

我能想到的唯一解决方案(虽然还没有测试过)是将easyXDM放入两个测试iframe中-一个在http://www.mysite.com/url_test上,一个在https://www.mysite.com/url_test上。

然后让你的/url_test网页尝试访问window.top.location.href。如果/url_test可以看到位置,那么它必须在同一域中。然后,successfull/url_test页面将通过easyXDM与父iframe(在some-embedt-app.com上)通信,以在正确的主机上创建您真正想要的iframe。

注意:在不正确的主机上的/url_test页将开始在控制台中转储同源iframe警告。:)

注释#2:如果这种方法有效,你可以迭代地改进它,说:"因为产品领域,我知道这些嵌入的80%将在http上。我将首先在http上创建一个/url_test,然后尝试使用https作为备份。"

使用//http://或https://

浏览器会对它进行排序

相关内容

  • 没有找到相关文章

最新更新