跨域获取json数据

时间:2021-03-09 12:56:41
原文地址: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, 不過我的習慣是後面加上版本序號

    哈哈,谢谢你的指点啊,我会一一去学习的!