前端必备HTTP技能之JSONP技术详解

JSONP(JSON with Padding)是一种JSON扩展，用来解决由浏览器同源策略引起跨域限制。跨域限制就是限制访问其它域上面的资源而不限制当前域上的资源访问，通俗来说就是一个站点不能简单从其它站点访问数据。

它被开发出来的原因是处理浏览器同源策略很困难，使用JSONP可以抽象这种困难，让其处理起来更容易。

JOSN代表JavaScript Object Notation，是一种通过键值对表示对象字段的展示数据的格式。

如何工作

为了搞明白这种技术如何工作，首先考虑一个可以返回JSON数据的URL。js可以通过XMLHttpRequest请求这个URL，例如用户ID是1234，浏览器请求URL：http://server.example.com/Users/1234，传过去ID是1234，得到的结果类似下面：

{
    "Name": "Foo",
    "Id": 1234,
    "Rank": 7
}

这里，把这个URL赋值给

浏览器会按顺序下载script文件，评估文件内容，把原始JSON数据解析成语句块，然后抛出语法语法异常。尽管数据可以解析成对象字面量，但是在浏览器中不会被js访问到，因为没有变量赋值，对象字面量是无法访问的。

在JSONP的使用模式中，

在上例中，接收到的负载如下：

parseResponse({"Name": "Foo", "Id": 1234, "Rank": 7});

其中parseResponse是前端页面js域中已经定义过的一个js函数，参数就是一个json对象

脚本注入

只有在script标签中使用JSONP才有意义。对于每个新的JSONP请求，浏览器必须增加一个新的