关于Ajax的跨域问题
用json(可选)和script标签,解决ajax的跨域问题,ajax的XMLHttpRequest因为js的安全问题是不能跨域的
但是<script></script>可以用src="http://otherSite.com/a.js"可以跨域所以动态写入一个<script></script>就OK了,scr指向一个其它站点的文件,比如:a.php?id=15
让a.php echo() 一个json的字符串 json 参考:http://www.json.org/ (可选)
<script>
var element = document.createElement("script");
function createScript(compId,dataId){
element.src = "http://othersite.com/json.php?comp_id=" + compId + "&data_id=" + dataId + "";
element.type = "text/javascript";
element.language = "javascript";
}
function writeContent(){
alert(productJSON.product[0].name);
}
window.onload = function(){
createScript(1,2);
document.getElementsByTagName("head")[0].appendChild(element);
}
if(document.all){
element.onreadystatechange = function(){//IE用
var state = element.readyState;
if (state == "loaded" || state == "interactive" || state == "complete") {
writeContent();
}
};
} else {
element.onload = function() {//FF用
writeContent();
};
}
</script>
下面是json.php echo出来的内容
var productJSON = {'product': [
{'name' : '物件名1'},
{'building' : '建物名1'},
{'address' : '5'}
]
};
如果使用了jQuery的话。 跨域问题就更容易解决了。
$.getJSON(
"a.php?callback=?",
function(data){
alert("CallBack Data: " + data );
}
);
在此必须要用 callback=? 进行跨域调用,jQuery会返回一个JSONP的返回值代替‘?’,实际上传递给后台脚本的应该是类似‘&callback=jsonp12126279’。所以需要在后台脚本中截获callback的参数,然后加在原先的JSON前。(可以理解成是一次验证过程)。
php:
$callback= $_GET['callback'];
echo $callback.'('.json_encode(array(key1=>value1,key2=>value2)).')'; //需要注意格式
这样返回的就是’jsonp12126279{key1:value1;key2:value2}’