jquery 中 jsonp 的实现原理

在同源策略下,在某个服务器下的页面是无法获取到该服务器以外的数据的,即一般的 ajax 是不能进行跨域请求的。但 img、iframe 、script 等标签是个例外,这些标签可以通过 src 属性请求到其他服务器上的数据。利用 script 标签的开放策略,我们可以实现跨域请求数据,当然这需要服务器端的配合。 Jquery 中 ajax 的核心是通过 XmlHttpRequest 获取非本页内容,而 jsonp 的核心则是动态添加 标签来调用服务器提供的 js脚本。

  当我们正常地请求一个 JSON 数据的时候,服务端返回的是一串 JSON 类型的数据,而我们使用 JSONP 模式来请求数据的时候服务端返回的是一段可执行的 JavaScript 代码。因为 jsonp 跨域的原理就是用的动态加载 script src ,所以我们只能把参数通过 url 的方式传递 , 所以 jsonp type 类型只能是 get
示例:
$.ajax({
url: 'http://192.168.1.114/yii/demos/test.php', // 不同的域
type: 'GET', // jsonp 模式只有 GET 是合法的
data: {
'action': 'aaron'
},
dataType: 'jsonp', // 数据类型
jsonp: 'backfunc', // 指定回调函数名,与服务器端接收的一致,并回传回来
})
其实 jquery 内部会转化成
http://192.168.1.114/yii/demos/test.php?backfunc=jQuery2030038573939353227615_1402643146875&action=aaron
然后动态加载