实现

JSONP 的理念就是，与服务端约定好一个回调函数名，服务端接收到请求后，将返回一段 Javascript，在这段 Javascript 代码中调用了约定好的回调函数，并且将数据作为参数进行传递。当网页接收到这段 Javascript 代码后，就会执行这个回调函数，这时数据已经成功传输到客户端了。

前端代码

<script>
function test(data) {
    console.log(data.name);
}
</script>
<script src="http://127.0.0.1:8088/jsonp?callback=test"></script>

后端代码

res.end('test({"name": "Monkey"})');

请求 JSONP 之前就定义好回调函数 test，后端返回的是调用 test 函数的 js 代码，浏览器加载这段代码后立即执行

优缺点

缺点：

  1. 它只支持 GET 请求而不支持 POST 等其它类型的 HTTP 请求

  2. 它只支持跨域 HTTP 请求这种情况，不能解决不同域的两个页面之间如何进行 JavaScript 调用的问题。

  3. JSONP 在调用失败的时候不会返回各种 HTTP 状态码。

  4. 安全性。假如提供 JSONP 的服务存在页面注入漏洞，即它返回的 JavaScript 的内容被人控制的。那么结果是什么？所有调用这个 JSONP 的网站都会存在漏洞。于是无法把危险控制在一个域名下…所以在使用 JSONP 的时候必须要保证使用的 JSONP 服务必须是安全可信的。

优点：

  1. 它不像 XMLHttpRequest 对象实现的 Ajax 请求那样受到同源策略的限制，JSONP 可以跨越同源策略；

  2. 它的兼容性更好，在更加古老的浏览器中都可以运行，不需要 XMLHttpRequest 或 ActiveX 的支持

  3. 在请求完毕后可以通过调用 callback 的方式回传结果。