js跨域

 

跨域的安全限制都是指浏览器端来说的 ， 服务器端是不存在跨域安全限制的 。

 

 

下面是JQuery1.7 关于 jsonp 的说明：

如果指定了script 或者 jsonp 类型，那么当从服务器接收到数据时，实际上是用了 < script > 标签而不是XMLHttpRequest 对象。这种情况下， $.ajax() 不再返回一个 XMLHttpRequest 对象，并且也不会传递事件处理函数，比如 beforeSend 。

 

 

 

Jsonp的原理其实就是动态创建一个 script 标签，其 src 为请求的地址，服务器返回的响应体是一段合法的 JS 代码，比如 json 对象。浏览器得到响应体后用 js 引擎执行代码。

 

 

 

在浏览器端：

预先定义一个jsonp 的回调函数：

function cb(json) {

    alert(json.name);

}

 

然后创建script 标签加载 js ：

function loadJS(url, success) {
	var domScript = document.createElement('script');
	domScript.src = url;
	success = success || function(){};
	domScript.onload = domScript.onreadystatechange = function() {
		if (!this.readyState || 'loaded' === this.readyState || 'complete' === this.readyState) {
			this.onload = this.onreadystatechange = null;
			success();
			this.parentNode.removeChild(this);
		}
	}
	document.getElementsByTagName('head')[0].appendChild(domScript);
}

 

 

 

 

在服务器端：

String jsonpcb = request.getParameter("jsonpcallback"); // 获取回调的 js 函数名

String param = ""; // 服务器根据参数生成的响应内容，是 json 对象的序列化

String res = ""; // 根据请求参数生成响应，并序列化为 json 对象

String resBody = jsonpcb + "(" + res + ");" // 把函数调用序列化

 

 

 

在服务器端生成的响应可能就是这样的：

cb({

"version":123,

"name": "abc"

});

 

 

 

浏览器得到响应后，调用 js引擎解释执行。