我们经常会在页面上使用ajax请求访问其他服务器上的数据,此时客户端就会出现跨域问题。

跨域问题是由javascript语言安全限制中的同源策略造成的。

简单来说,同源策略是指一段脚本只能读取来自同一来源的窗口和文档的属性。

同一来源是指主机名、端口号和协议的组合。

 

解决方案:

1、通过jsonp跨域

script标签是可以跨域访问服务器上的数据的,因此可以指定src属性为跨域的url,通过script标签引入一个js文件,这个js文件载入成功后会执行我们在url参数中指定的函数,从而实现跨域访问。

2、通过修改document.domain来跨子域

只适用于不用子域的框架间的交互,需要一个隐藏的iframe来做代理,把两个页面的document.domain都设置成相同的域名即可,不同的框架之间可以获取彼此的window对象。

3、适用window.name进行跨域

window对象有个name属性,在一个窗口的生命周期内,窗口载入的页面都是共享的。

我们可以把页面想要传递的数据设置在window.name里面。

4、使用html5中window.postMessage方法来跨域传送数据。

可以使用它来向其它的window对象发送消息,无论这个window对象是属于同源或不同源,目前IE8+、FireFox、Chrome、Opera等浏览器都已经支持window.postMessage方法。