js跨域的问题总结

JS跨域的问题,最近遇到了,搜集了一些资料,大概整理一下,对这个知识点进行梳理一下。

先说说客户端的解决方案,客户端一般采用设置document.domain或者通过script 标签加载的方法来解决。

设置document.domain

采用这种方法的前提是跨域请求涉及的两个页面必须属于一个基础域(例如都是xxx.com,或是xxx.com.cn),使用同一协议(例如都是 http)和同一端口(例如都是80)。例如,aaa.xxx.com里面的一个页面需要调用bbb.xxx.com里的一个对象,则将两个页面的 document.domain都设置为xxx.com,就可以实现跨域调用了。 另外,需要注意的是,这种方式只能用在父、子页面之中,即只有在用iframe进行数据访问时才有用。

通过script标签加载

对于浏览器来说,script标签的src属性所指向资源就跟img标签的src属性所指向的资源一样,都是一个静态资源,浏览器会在适当的时候自动去加载这些资源,而不会出现所谓的跨域问题。这样我们就可以通过该属性将要访问的数据对象引用进当前页面而绕过js跨域问题。例如,在space的我的空间项目中,需要在hi域下管理中心页面中随机推荐几个热门模块给用户,由于热门模块的相关信息都在act域下的php模块中维护,如果直接在hi域下通过ajax请求去获取act域下的推荐模块列表相关信息就出现js跨域问题。解决这个问题的最简单方法就是,在hi域下通过 script标签去访问act域提供的这个http接口:

<script type=”text/javascript” src=”http://act.hi.baidu.com/widget/recommend”><script>

当然,前提是act域的这个http接口必须是返回一段js脚本,如一个json对象数组定义的脚本:

modlist = [
{“modname” : “mod1”,  “usernum” : 200, “url” : ” /widget/info/1”},
{“modname” : ”mod2”,  “usernum” : 300, ”url” : ” /widget/info/2”},
…
];

但script标签也有一定的局限性,并不能解决所有js跨域问题。script标签的src属性值不能动态改变以满足在不同条件下获取不同数据的需求, 更重要的是,不能通过这种方式正确访问以xml内容方式组织的数据。

原文链接:,转发请注明来源!

发表评论