Ajax跨域请求

in Develop

这二天在做一个小项目,该小项目中分配出小段的js代码供客户调用。
该js代码最终将展现完整的html文档,而且会有Ajax交互。
由于Ajax无法跨域,Google了一下到是找到了一些解决方案,但感觉都不大好用。
比如加Iframe强制设定document.domain、有使用代理文件。
后来看到有朋友在分析zhidao.baidu.com的跨域ajax认证,发现这个方法还是可行的。

原理就是动态在页面的head中添加一段script,该script中会定义一个js变量,页面中就可以调用该js变量了。
xxx.xxx中代码可能如下:
var v=’这里就是变量啦’;

核心js代码,动态创建script脚本到head中

function request(page, pagesize, appid)
{
var url = 'xxx.xxx';
oScript = Find('RemoteScript');
var head = document.getElementsByTagName("head").item(0);
if (oScript) {
head.removeChild(oScript);
}
oScript = document.createElement("script");
oScript.setAttribute("src", url);
oScript.setAttribute("id",'RemoteScript');
oScript.setAttribute("type","text/javascript");
head.appendChild(oScript);
return oScript;
}

在调用页的任何区域就可以用变量v了。
虽然不是一个很好的解决方案,但感觉也不错了,有一个不足就是必须要等script完全载入之后才可以使用v变量,当然这个也有办法解决。
当然,也可以直接用支持跨域的jQuery中的getJson来处理json文件。

8 Comments

8 Comments

  1. 这种跨域方法叫做JSONP技术,应该属于比较常见的跨域的方式。

  2. 使用中间页面,来完成跨域呢?
    js先请求本地的一个动态页面,这个页面完成数据的请求

  3. get还是有比较多办法来解决跨域问题的
    如果要跨域post估计就没有好办法了

  4. @无影:
    这个就是文中提到的“代理”
    该“代理”在服务器端去请求远程页面,返回结果,然后js再去调用该“代理”

  5. 我以为什么高深技术那,这个方法我早就再用了,而且用回调函数

  6. @songlv:
    没说很高深啊~
    只是我是第一次用而已

  7. post的方式就比较繁琐的,甚至可以支持双向数据传输,可参考下http://www.julienlecomte.net/blogfiles/cross-frame/diagram.png。
    PS:这两天实在太忙,没好好聊聊,等9周年上海好好叙下:)

  8. @怿飞:
    en
    到时好好聚聚
    就是不想用代理

Leave a Reply

Using Gravatars in the comments - get your own and be recognized!

XHTML: These are some of the tags you can use: <a href=""> <b> <blockquote> <code> <em> <i> <strike> <strong>