Facebook和跨域消息传递澄清？

Question

我想调查facebook登录如何将数据传输到主页面(mypage) - 尽管跨域限制.

所以我用FB js sdk代码创建了一个新页面:

FB.login(function (response)
    {
    if (response.authResponse)
        {...

它确实打开了弹出窗口:

但是当我调查我的页面上是否有任何Iframe 时(我的代码不包含任何iframe):

我看到了这个 :

>>$("iframe")

结果:

[
<iframe name=?"fb_xdm_frame_http" frameborder=?"0" allowtransparency=?"true" scrolling=?"no" id=?"fb_xdm_frame_http" aria-hidden=?"true" title=?"Facebook Cross Domain Communication Frame" tab-index=?"-1" src=?"http:?/?/?static.ak.facebook.com/?connect/?xd_arbiter.php?version=24#channe…l_path=%2FWebSite2%2FHTMLPage3.htm%3Ffb_xd_fragment%23xd_sig%3Df5252874%26" style=?"border:? none;?">?…?</iframe>?
, 
<iframe name=?"fb_xdm_frame_https" frameborder=?"0" allowtransparency=?"true" scrolling=?"no" id=?"fb_xdm_frame_https" aria-hidden=?"true" title=?"Facebook Cross Domain Communication Frame" tab-index=?"-1" src=?"https:?/?/?s-static.ak.facebook.com/?connect/?xd_arbiter.php?version=24#cha…l_path=%2FWebSite2%2FHTMLPage3.htm%3Ffb_xd_fragment%23xd_sig%3Df5252874%26" style=?"border:? none;?">?…?</iframe>?
]

我读到它们用于跨域.

但问题是为什么他们在MY PAGE上 ？

他们应该在Facebook内部页面的某个地方!

我这么说是因为我知道iframe技术的工作原理如下:

如您所见 - 内部Iframe 使用查询字符串中的值创建另一个 iframe SRC(该值实际上是首页url),然后,在两个页面上使用JS + URL => JS 触发器函数,我们可以执行以下操作:

top.sendData({...})

我错过了什么？

• 如何将数据从FB登录传递到我的页面？

Answer 1

我是在Facebook JS SDK中为跨域消息传递设计当前基础架构的工程师,所以也许我可以在这里阐述一些事情.

这种设置可能看起来有点不正统,有些令人困惑,但它真的很优雅,如果我可以这样说的话:)

根据页面是HTTP还是HTTPS,JS SDK将创建两个iframe,指向xd_arbiter.php资源,该资源由*.facebook.com域提供.自设置以来document.domain = 'facebook.com',这些可以与facebook.com上的其他资源进行通信.

这些资源(代理)通过片段传递一些信息,为它们提供动态功能,但是否则100%是静态的并且由浏览器缓存 - 因此加载速度非常快.

接下来发生的是在主机页面和每个iframe(代理)之间建立跨域消息传递链接.这意味着从现在开始,主页可以与facebook.com上的HTTPS页面进行通信,如果主页是HTTP,它还可以与facebook.com上的HTTP页面进行通信.

这个链接如何在浏览器中运行是一个更复杂的问题,但它都被抽象为一个通道,就像你可以通过easyXDM看到的那样.

现在,只要JS SDK在facebook.com上创建一个新窗口,无论是作为弹出窗口还是作为iframe,而不是必须在主机页面和每个窗口之间建立新的通信通道,新窗口可以利用现有的代理,在设置中不付费.

当需要向主机页面发送消息时,这些消息将用于(window.opener || window.parent).frames['fb_xdm_frame_' + location.protocol.replace(':', '')获取代理的句柄,同样,代理可以parent.frames[some_name]用来获取页面上任何兄弟iframe的句柄,只要正确的代理(HTTP或HTTPS) )被使用了.

对我们来说,这基本上意味着关于如何跨域通信的关注与JS SDK及其资源是分离的 - 我们在此基础上构建的任何服务都可以依赖于一个非常简单的api,send_this_message(message, origin)它将"神奇地"结束另一方面,如果我们有原产地检查允许的话.

我希望这回答了你的问题!

(xd_arbiter.php也可以作为重定向目标,它将使用它的兄弟代理来中继消息).