JSONP与ajax相关内容整理

维基百科JSONP定义

JSONP（JSON with Padding）是数据格式JSON的一种"使用模式"，可以让网页从别的网域要数据。另一个解决这个问题的新方法是跨来源资源共享。

由于同源策略，一般来说位于server1.example.com的网页无法与 server2.example.com的服务器沟通，而HTML的 <script>元素是一个例外。利用 <script>元素的这个开放策略，网页可以得到从其他来源动态产生的JSON数据，而这种使用模式就是所谓的 JSONP。用JSONP抓到的数据并不是JSON，而是任意的JavaScript，用 JavaScript解释器运行而不是用JSON解析器解析。

JSONP原理及简单实现思路

全称 JSON with Padding，用于解决AJAX跨域问题的一种方案。

由于同源策略的限制，浏览器只允许XmlHttpRequest请求当前源（域名、协议、端口）的资源，而对请求script资源没有限制。通过请求script标签实现跨域请求，然后在服务端输出JSON数据并执行回调函数，这种跨域的数据的方式被称为JSONP。
实现原理

1.首先在客户端注册一个callback方法，放到window对象上，如：

callbackFunction (json) {
console.log(JSON)
}

然后把callback的名字（callbackFunction）传给服务器。

2.服务器先生成 JOSN 数据。

3.将 JOSN 数据直接以入参的方式，放置到 function 中，这样就生成了一段 js 语法的文档（如callbackFunction(JOSN)），返回给客户端。

4.客户端浏览器，将返回的JS标签插入DOM，解析script标签后，会执行callbackFunction(JOSN)。

通过这种方式，即可实现跨域获取数据。

注意

在 jquery 中，JSOP 被封装在 $.ajax() 方法中，但是他的实现原理与 ajax 完全不同。
JSONP的兼容性较好，在更加古老的浏览器中都可以运行，不需要XMLHttpRequest或ActiveX的支持。
JSONP只支持GET请求而不支持POST等其它类型的HTTP请求。
JSONP在调用失败的时候不会返回各种HTTP状态码（解决方法：添加timeout参数，虽然JSONP请求本身的错误没有被捕获，但是最终会因为超时而执行error回调）。
在使用JSONP的时候必须要保证使用的JSONP服务必须是安全可信的。万一提供JSONP的服务存在页面注入漏洞，它返回的javascript都将被执行，若被注入这是非常危险的。

ajax与jsonp的异同再做一些补充说明

1、ajax和jsonp这两种技术在调用方式上"看起来"很像，目的也一样，都是请求一个url，然后把服务器返回的数据进行处理，因此jquery和ext等框架都把jsonp作为ajax的一种形式进行了封装；

2、但ajax和jsonp其实本质上是不同的东西。ajax的核心是通过XmlHttpRequest获取非本页内容，而jsonp的核心则是动态添加

3、所以说，其实ajax与jsonp的区别不在于是否跨域，ajax通过服务端代理一样可以实现跨域，jsonp本身也不排斥同域的数据的获取。

4、还有就是，jsonp是一种方式或者说非强制性协议，如同ajax一样，它也不一定非要用json格式来传递数据，如果你愿意，字符串都行，只不过这样不利于用jsonp提供公开服务。

总而言之，jsonp不是ajax的一个特例，哪怕jquery等巨头把jsonp封装进了ajax，也不能改变这一点！

-- The End --