跨域获取json数据

原文地址：http://my.oschina.net/LinBandit/blog/34570

 

前阵子做了一个前端动态加载json数据的应用，其中使用xmlhttprequest动态加载js，但是前提是我的前端必须和js数据之间不能跨域，这个局限就很大了，果然过不多久，就接到要求，这个前端需要整合到另一个服务器上面去，我顿时就傻眼了，因为我最不愿意看到的情况出现了，跨域问题，唉，新手总是怕遇见问题，遇见多了估计就成了高手了。

没办法就只能重写前端获取数据的js逻辑，这次不能使用xmlhttprequest，而是使用动态加载script的方式加载js脚本，之前也曾经试过这种方法，但是碰到了异步加载的问题就搁置了，这次我也想了一些办法解决了这些问题，现在说一说我的思路。

1、如何加载script？

我使用的还是原始的js创建元素的方法加载的：document.createElement("script");然后设置路径等属性；

2、什么时候才能使用动态加载的js文件中的变量？

由于script是异步加载的，所以在执行append方法后，并不能马上使用里面的脚本，必须要等到脚本完全加载完毕之后才能使用，script元素有onload（ff、chrom）、onreadystatechange（ie）、onerror（ie、chrome、ff）属性可以设置回调函数，在ff和chrom中，script加载成功后会执行onload设置的回调函数，而在ie中如果script的加载状态发生变化后就会执行onreadystatechange回调函数，在函数中根据状态码判断加载状态，如果脚本加载失败的时候就会执行onerror的回调函数。

特别的，在ie中，如果你的脚本是已经加载过的，那么ie不会重新再次加载，这个特性在开始的时候可是让我大吃苦头，如果你的脚本是在之前加载过的话，那么在onreadystatechange回调函数中会有相应的状态码加以判断就是readystate=='complete',如果你要加载的脚本中的内容是动态变化的，同一个脚本文件每个一段时间其中的内容就会不一样，这个特性就会带来麻烦了，不过可以在你的脚本地址后面加上"?354354546",就是加上一个问号和一个随机数，这样就能保证在ie中不会应为你的脚本地址加载过就不会再次加载了。

评论2

• 1楼：YehAlice 发表于 2011-11-07 10:01 回复此评论 1. 跨域获取json数据, 網路上有很多解決方法. 2. 為何加載script不用jQuery的getScript, 自己用xmlhttprequest要解決跨平台的問題. 3. jQuery的ajax可以設定cache=true, 不過我的習慣是後面加上版本序號

• 2楼：土匪强 发表于 2011-11-08 23:07 回复此评论 引用来自“YehAlice”的评论 1. 跨域获取json数据, 網路上有很多解決方法. 2. 為何加載script不用jQuery的getScript, 自己用xmlhttprequest要解決跨平台的問題. 3. jQuery的ajax可以設定cache=true, 不過我的習慣是後面加上版本序號 哈哈，谢谢你的指点啊，我会一一去学习的！