JSON和JSONP的差别，以及用法-优快云博客

本文介绍了在使用AJAX过程中遇到的跨域问题及其解决方案——JSONP。详细解释了JSONP的工作原理、如何利用jQuery实现JSONP请求及JSONP的优势与局限。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

1. 场景

在拉京东城市选择的基础数据时候，遇到被server拒绝的情况，也就是ajax跨域问题

2. json和jsonp

说的直白一点。在我们做ajax异步的一些功能的时候，一定会或多或少的遇到两个问题，（1、数据的交换。

2、跨域问题）

JSONP的最主要的原理是：动态加入一个

<script type="text/javascript">
function jsonpCallback(result) 
{ 
  alert(result.msg); 
 }
 </script>
<script type="text/javascript" src=" http://crossdomain.com/jsonServerResponse?jsonp= jsonpCallback"></script>

从红色的地方能够看出，两个名字要一直，只是一般採用callback然后后面加一个“？”此时jquery会自己主动生成一个函数名，这样能够做到发送非常多请求的时候，并不会互相影响。
同源策略：即JavaScript仅仅能訪问与包括它的文档在同一域下的内容。jsonp能够跨越同源策略，当我们使用了jsonp。将会是第二种协议通信了。
JSONP的长处是：它不像XMLHttpRequest对象实现的Ajax请求那样受到同源策略的限制。它的兼容性更好，在更加古老的浏览器中都能够执行，不须要XMLHttpRequest或ActiveX的支持。而且在请求完成后能够通过调用callback的方式回传结果。

JSONP的缺点则是：它仅仅支持GET请求而不支持POST等其他类型的HTTP请求；它仅仅支持跨域HTTP请求这样的情况。不能解决不同域的两个页面之间怎样进行JavaScript调用的问题。

3.用法

$.getJSON(" http://跨域的dns/document!searchJSONResult.action?

name1="

+value1+"&jsoncallback=?

"

,
    function(json){
    if(json.属性名==值){
        // 执行代码
    }
});
$.ajax({
    async:false,
    url: http://跨域的dns/document!searchJSONResult.action,
    type:"GET",
    dataType:'jsonp',

通常情况通常是这两种用法，在跨域问题上，非常easy。