js实现了各种跨领域的方法

从域开始。

域：域是WIN2K网络系统的安全边界。我们知道计算机网络最基本的单元是“域”，它不是WIN2K独有的，但active directory可以贯穿一个或多个域。在独立的计算机上，域指的是计算机本身。一个域可以分布在多个物理位置，而一个物理位置可以将不同的网段划分为不同的域。每个域都有自己的安全策略及其与其他域的信任关系。当多个域通过信任关系连接时，active directory可以被多个信任域共享：域树由多个域组成，它们共享相同的表结构和配置，形成一个连续的命名空间。树中的域通过信任关系连接，并且active directory包含一个或多个域树。树中的域通过双向传递信任关系连接。因为这些信任关系是双向和可传递的，所以在域树或林中新创建的域可以立即与域树或林中的所有其他域建立信任关系。这些信任关系允许单一登录过程对域树或林中所有域的用户进行身份验证，但这并不一定意味着经过身份验证的用户在域树的所有域中拥有相同的权限。因为域是安全边界，所以必须在每个域的基础上为用户分配相应的权限。树中的域级别越深，级别越低，并且出现“.”代表一个级别。例如，zhidao.baidu.com(百度知道)的域名比Baidu.com(百度)低，因为它有两个级别，而Baidu.com只有一个级别。

什么是跨域？

默认情况下，XHR对象只能访问包含它的页面所在域中的资源。此安全策略可以防止一些恶意行为。然而，实现合理的跨域请求对于开发一些浏览器应用程序也非常重要。只要协议、域名、端口有任何不同，就会被视为不同的域。

例如，将一个ajax请求发送到http://www.a.com/a.js页面上的以下页面，下面是请求结果和描述。

端口和协议的区别只能在后台解决。我们要解决的是不同域名的问题。

如何跨域？

(a) CORS(跨来源资源共享，跨来源资源共享)。

1.CORS(跨来源资源共享)是W3C的工作草案，它定义了当必须访问跨来源资源时浏览器和服务器应该如何通信。CORS背后的基本思想是使用定制的HTTP头让浏览器与服务器通信，从而决定请求或响应应该成功还是失败。2.这个函数的实现非常简单，服务器只需要发送一个响应头。

浏览器支持：

IE火狐3.5 Opera 12 Safari 4 Chrome 3假设我们的页面或应用程序已经在http://www.a.com/,我们打算请求从http://www.b.com提取数据。一般来说，如果我们直接使用AJAX请求，就会失败，浏览器会返回错误。对于CORS，http://www.b.com只需要添加一个报头，就可以接受来自http://www.a.com的请求。以下设置是用php实现的。“*”表示允许任何域向我们的服务器提交请求：

CORS的头{ '访问控制-允许-来源： *'}兼容性编写。

函数createCORSRequest(方法，URL){ var xhr=new XMLHttpRequest()；//非IE浏览器if('带有xhr中的凭据'){xhr.open(方法，URL，true)；//IE浏览器} else if(类型为XDomainRequest！=' undefined '){ vxhr=new XDomainRequest()；xhr.open(方法，URL)；} else { xhr=null}返回xhr} var request=createCORSRequest(' get '，' http://www . where-else.com/page/')；if(request){ request . onload=function(){//process request . responsetext }；request . send()；} (2) JSONP(填充JSON或参数JSON的JSON)

在js中，虽然我们不能直接使用XMLHttpRequest来请求来自不同域的数据，但是可以将来自不同域的js脚本文件引入页面。jsonp就是通过这个特性实现的。

JSONP由回调函数和数据两部分组成。回调函数是响应到来时应该在页面中调用的函数，数据是传入回调函数的JSON数据。

例如：

脚本类型=' text/JavaScript '函数做某事(json数据){//处理获得的JSON数据}/script script src=' http:3358example.com/data.php?回调=do somesing '/脚本首先，第一个脚本注释定义了一个处理数据的函数；然后第二个脚本标签被加载到一个js文件中。http://example.com/data.php是数据的地址，但是由于它是作为js引入的，http://example.com/data.php必须返回一个可执行的js文件。最后，js文件成功加载后，url参数中指定的函数将被执行，我们需要的json数据将作为参数传入。所以php应该是这样的。

？PHP $ callback=$ _ GET[' callback ']；//获取回调函数名$data=array('a '，' b '，' c ')；//要返回的数据echo $回调。' ('.JSON _ encode ($ data)。')';//输出？最后输出的结果是：dosomething(['a '，' b '，' c '])；从上面可以看出，jsonp需要服务器端页面的相应配合。

JSONP :的优缺点。

它的兼容性更好，可以在旧的浏览器中运行，不需要XMLHttpRequest或ActiveX的支持。能够直接访问响应文本并支持浏览器和服务器之间的双向通信缺点：

JSONP是执行从其他域加载的代码。如果其他域不安全，响应中很可能会携带一些恶意代码，但是除了完全放弃JSONP调用，没有办法调查。因此，在使用非自己运维的Web服务时，一定要确保安全可靠。它只支持GET请求，不支持POST等其他类型的HTTP请求。它只支持跨域HTTP请求，无法解决不同域的两个页面之间如何调用JavaScript的问题。(3)窗口.名称

window对象有一个name属性，这个属性有一个特点：在一个窗口的生命周期中，该窗口加载的所有页面共享一个window.name，并且每个页面对window.name. window.name都有读写权限，在一个窗口加载的所有页面中都存在，不会因为加载新页面而重置。

这里有三页：

A.com/app.html:申请页面。A.com/proxy.html:代理文件通常是一个没有任何内容的html文件，它需要与应用程序页面在同一个域中。B.com/data.html:应用程序页面需要获取数据，这可以称为数据页面。

app.html

iframe src=' http : b.com/data . html ' id=' iframe '/iframe script var iframe=document . getelementbyid(' iframe ')；iframe . src=' a.com/proxy . html '；//这是一个与a.com/app.html iframe . onload=function(){ var data=iframe . content window . name；//获取数据}/scriptdata.html。

Script //这里是要传输的数据，大小一般是2M，在IE和firefox下可以大到32M左右。//数据格式可以自定义，比如json和string window . name=' data '/script iframe。第一个地址是b.com/data.html,因此可以获得窗口名称数据。但是iframe和app.html不是同一个来源，app.html得不到数据，所以iframe的链接转移到了a.com/proxy.html,的代理页面，现在app.html和iframe是同一个来源。

注意：iframe从b.com/data.html跳转到a.com/proxy.html页面，window.name的值不变。

获取数据后销毁iframe并释放内存；这也确保了安全性(不会被其他域框架js访问)。

脚本类型=' text/JavaScript ' iframe . content window . document . write(')；iframe . ContentWiNDOW . close()；document . body . remove child(iframe)；/script(iv)document . domain frame。

相同主域但不同子域的例子可以通过设置document.domain来解决.具体来说，可以分别在http://www.a.com/a.com和http://script.a.com/b.html文件中设置document.domain='a.com '，然后在a.html文件中创建一个iframe来控制iframe的contentDocument，这样两个js文件就可以“交互”了。http://www.a.com/a.html佩奇

iframe src=' http :http://script . a.com/b . html ' frame border=' 0 '/iframe script document . domain=' a.com '；/script http://script.a.com/b.html页。

脚本document . domain=' a.com '；/script，这样两个页面就可以通过js访问各种属性和对象。

document.domain的设置受到限制。我们只能将document.domain设置为自己的或更高的父域，并且主域必须相同。例如，a.b.example.com文档的document.domain可以设置为a.b.example.com、b.example.com和example.com中的任何一个，但不能设置为c.a.b.example.com，因为它是当前域的子域，也不能设置为Baidu.com，因为主域不同。

HTML5窗口

window.postMessage (message，target origin)方法是html5新引入的功能，它可以用来向其他窗口对象发送消息，而不管这些窗口对象属于同一个源还是不同的源。目前IE8、FireFox、Chrome、Opera等浏览器已经支持window.postmessage方法。Window.postMessage允许在两个窗口/框架之间跨域发送数据消息。本质上，window.postMessage是一个没有服务器填补的跨域Ajax。

用法：otherwindow.postmessage(消息，目标来源)；

OtherWindow:指接收信息页面的窗口。可能是页面中iframe的contentWindow属性；窗口的返回值。打开；通过名称或下标从window.frames获得的值。Message:要发送的数据，字符串类型。TargetOrigin:用于限制otherWindow，“*”表示数据发送方的a.com/index.html代码，没有限制：

iframe id=' IFR ' src=' http : b.com/index . html '/iframe script type=' text/JavaScript ' window . onload=function(){ var IFR=document . getelementbyid(' IFR ')；var TargetOrigin=' http://b.com '；//设置接收方的域，*表示无限IFR.contentwindow.postmessage('我在那里！TargetOrigin)；};/数据接收端b.com/index.html的脚本代码：

脚本类型=' text/JavaScript ' window . addevent listener(' message ')，函数(event){//确定消息源地址if (event。origin==' 3358 a.com '){ alert(event . data)通过origin属性；//弹出‘我在那里！’。alert(event . source)；//由于同源策略，引用a.com和index.html//However,的窗口对象，event.source不能在此访问窗口对象} }，false)；/script以上是js实现跨域的多种方式，希望对大家的学习有所帮助。