跨域访问简单来说就是两个存在于不同域名下的资源互相访问。JS一般基于安全方面的考虑,是不允许跨域调用的,这里就不得不提到它的同源策略了,同源策略是为了防止从一个地址加载的文档或脚本操作从另一个地址加载的文档。只有当两个网络资源的协议、域名和端口号完全相同的时候,才可视为同源。
随着web应用的发展,JS跨域访问的需求随处可见:
1、使用脚本创建script 节点
虽然浏览器默认禁止了跨域访问,但并不禁止在页面中引用其他域的JS文件,并可以自由执行引入的JS文件中的function,根据这一点,可以方便地通过创建script节点的方法来实现完全跨域的通信。比如在本域内的A内生成一个JS标签,它的SRC指向请求的另外一个域的某个页面B,这个src里面通常会加一个A页面定义好的回调函数,B返回数据即可,可以直接返回调用这个回调函数。这种跨域的通信方式被称为JSONP,此方案存在缺陷:script的src属性完成该调用时采取的方式是get方式,如果请求时传递的字符串过大,可能会无法正常运行,必须有所约束。
2、document.domain+iframe的设置
对于主域相同而子域不同的情况,可以通过设置document.domain的办法来解决。具体的做法是可以在http://news.A.com/a.html和http: //image.A.com/b.html两个文件中分别加上document.domain = ‘A.com’;然后通过a.html文件中创建一个iframe,去控制iframe的contentDocument,这样两个js文件之间 就可以“交互”了。
3、利用iframe和location.hash
这个方法没有使用过,但据说可以解决完全跨域情况下的脚步置换问题。原理是利用location.hash来进行传值。在http://A.com#hash中的‘#hash’就是location.hash,改变hash并不会导致页面刷 新,所以可以利用hash值来进行数据传递,当然数据容量是有限的。假设域名A.com下的文件a.html要和B.com域名下的b.html传递信息,a.html首先创建自动创建一个隐藏的iframe,iframe的src指向B.com域名下的b.html页面,这时的hash值可以做参数传递用。b.html响应请求后再将通过修改a.html的hash值来传递数据。(因为ie 不允许修改parent.location.hash的值,所以要借助于A.com域名下的一个代理iframe)。同时在a.html上加 一个定时器,隔一段时间来判断location.hash的值有没有变化,一点有变化则获取获取hash值。