Fatal编程技术网
  • javascript/
  • Javascript Google Friend Connect如何实现跨域通信而无需将文件上载到客户端域？

Javascript Google Friend Connect如何实现跨域通信而无需将文件上载到客户端域？

javascript

Javascript Google Friend Connect如何实现跨域通信而无需将文件上载到客户端域？,javascript,cross-domain,xss,Javascript,Cross Domain,Xss,以前，Google的Friend Connect要求用户上传几个文件到他们的网站，以实现跨域通信，而Facebook Connect仍然要求用户上传一个文件来实现跨域通信 现在，Friend Connect不需要任何文件上传。。。我想知道他们是如何做到这一点的 参考： 我不确定它在这个特定实例中是如何工作的，但跨域消息传递可以通过postMessage（）API或更改URL的哈希部分并监视它来完成 散列更改方法之所以有效，是因为封闭页面和封闭页面都可以访问封闭页面的URL 当然，希望postMe

以前，Google的Friend Connect要求用户上传几个文件到他们的网站，以实现跨域通信，而Facebook Connect仍然要求用户上传一个文件来实现跨域通信

现在，Friend Connect不需要任何文件上传。。。我想知道他们是如何做到这一点的

参考：

我不确定它在这个特定实例中是如何工作的，但跨域消息传递可以通过postMessage（）API或更改URL的哈希部分并监视它来完成

散列更改方法之所以有效，是因为封闭页面和封闭页面都可以访问封闭页面的URL

当然，希望postMessage（）API调用随着时间的推移变得更加标准。

现在很难记住/验证，但我相信我这里的答案可能是错误的。肖恩·金赛（Sean Kinsey）以上的回答应该是这个问题的最终答案。如果你正在读这篇文章，请对他的答案投赞成票，而忽略我的答案。

GoogleFriendConnect小部件的工作原理与大多数广告/小部件一样，它使用一个复制/粘贴的HTML片段引用主机服务器上的JavaScript包含，然后创建一个包含所需内容的iframe。通过在URL中使用您的站点ID打开iframe，Google的服务器能够生成适当的HTML文档来表示您特定站点/设置的Friend Connect小工具

除了使用适当的URL目标创建iframe的初始步骤之外，没有任何跨站点通信发生。该小工具动态生成的iframe中的所有内容更像是用户访问了Google服务器上的一个单独页面，但会显示的内容会被嵌入/隔离到页面上的一个块中。

允许跨域javascript

  • 由于浏览器安全限制， 大多数“Ajax”请求都受到 同一原产地政策；请求 无法成功检索数据 从另一个域，子域， 或协议
  • 脚本和JSONP 请求不受相同的限制 原产地政策限制。
除了使用
somewindow.postMessage（）之外，没有其他方法用于跨域iFrame之间的通信

在
somewindow.postMessage（）之前，您必须上载文件，以确保可以在iFrame之间建立通信

例如：


     <html>
<!-- this is main domain www.example.com -->
        <head>
        </head>
        <body>
      <iframe src="http://www.exampleotherdomain.com/">
      <script>
      function sendMsg(a) {

       var f = document.createElement('iframe'),
           k = document.getElementById('ifr');

           f.setAttribute('src', 'http://www.example.com/xdreciver.html#myValueisSent');
           k.appendChild(f);
           k.removeChild(f);
      }
      </script>


      <div id="ifr"></div>
      </iframe>
        </body>
        </html>




函数sendMsg（a）{
var f=document.createElement（'iframe'），
k=document.getElementById（'ifr'）；
f、 setAttribute（'src'，'http://www.example.com/xdreciver.html#myValueisSent');
k、 儿童（f）；
k、 removeChild（f）；
}


现在，html内容：


     <html>
<!-- this is http://www.example.com/xdreciver.html -->
        <head>
      <script>
      function getMsg() {

             return window.location.hash;
      }
      </script>
        </head>
        <body onload="var msg = getMsg(); alert(msg);">



        </body>
        </html>




函数getMsg（）{
返回window.location.hash；
}



至于使用.postMessage（）；只需使用
top.postMessage（'我的消息到其他域文档，这也是主文档'，'http://www.theotherdomain.com');
不同域上的文档之间有多种通信方法，其中包括HTML5 postMessage、NIX、FIM（哈希/片段）、frameElement和使用window.name属性

它们在不同的浏览器和不同的版本中可用，但它们共同允许您执行可靠的XDM（跨域消息传递）

较早完成这项工作的一个项目是ApacheShindig，它可能是其中许多项目的先驱。最近，该项目已经推出，它将所有这些方法与一个通用API统一起来，使得使用XDM和RPC创建复杂应用程序变得容易

您可以深入阅读中传输数据的各种方法

现在，为了直接回答您的问题，早些时候，人们普遍认为只有postMessage，即FIM（片段标识符消息传递）可用，为了使后者有效工作，通常必须将一个特殊文件上载到您的域。随着越来越多的方法被发现，这项技术已被许多人弃用，因此；不再需要这个文件了


记录在案；我是ScriptJunkie文章和easyXDM库的作者（顺便说一句，Twitter、Discus和其他很多人都在使用这个库）。
JSON是格式。Jquery将使用脚本标记（动态创建）指向url。脚本将调用特定的回调函数以获得响应。由于它无法读取页面请求的内容，因此仍受同源策略的约束。JSONP与postMessage或其他跨文档消息传递技术不可比，因为它实际上是以客户机-服务器为中心的，而不像其他技术那样以客户机-客户机为中心。使用JSONP，您无法促进两个javascript程序之间的“对话”，只有一个程序和一台服务器。随附文档没有访问随附文档URL的权限，它具有对其
位置
属性的写入权限。感谢您的澄清。正如我在回答中提到的，XDM比postMessage和FIM有更多的选项：）这是不正确的-Google Friend Connect基于OpenSocial框架，促进了发布/订阅模型，以及iframe的自动调整大小以适应其内容。它实际上是基于XDM:）这是一个令人遗憾的错误答案，它被授予了赏金…+1。这么多年后，有人否决了我的答案，我注意到了这一点。我肯定我至少粗略地看了看FriendConnect当时是如何工作的，但肯定错过了这一点。我会把我的答案更新给clari