什么是 JSONP

JSONP 是 JSON 的一种使用模式，可用于解决主流浏览器的跨域数据访问的问题。

实现原理

由于浏览器同源策略的限制，网页中无法通过 Ajax 请求非同源的接口数据。但是 <script> 标签不受浏览器同源策略的影响，可以通过 src 属性，请求非同源的 js 脚本。因此，JSONP 的实现原理就是通过 script 标签的 src 属性，请求跨域的数据接口。并通过函数调用的形式接收响应回来的数据。

JSONP 的缺点

由于 JSONP 是通过 <script> 标签的 src 属性，来实现跨域数据获取的，所以 JSONP 只支持 GET 数据请求，不支持 POST 请求。

注意：JSONP 和 Ajax 之间没有任何关系，不能把 JSONP 请求数据的方式叫做 Ajax，因为 JSONP 没有用到 XMLHttpRequest 这个对象。

jQuery 实现 JSONP

<script>
  $.ajax({
    url: 'http://www.liulongbin.top:3006/api/jsonp?name=zs&age=12',
    // 代表要发送jsonp的请求
    dataType: 'jsonp',
    // 参数的名字
    jsonp: 'csmz',
    // 回调函数的名字
    jsonpCallback: 'hsmz',
    success(res) {
      console.log(res);
    }
  })
</script>

如果要用 jQuery 发起 JSONP，那么一定要用 dataType:'jsonp'，来指定要发起 JSONP 请求。参数 JSONP 指的是回调函数所在的参数的名字，参数 jsonpCallback 指的是回调函数的名字。

jQuery 发起 JSONP 的本质还是利用 script 的 src 属性，只不过发起发起 JSONP 的时候动态的 append 一个 script 标签，请求结束后又把 append 的 script 标签给删除了。

 

标签：src,请求,script,标签,JSONP,jsonp
来源： https://www.cnblogs.com/0529qhy/p/16218165.html