JSON和JSONP有什么区别？

本文翻译自：What are the differences between JSON and JSONP?

格式明智，文件类型明智和实用明智吗？

#1楼

参考：https://stackoom.com/question/C75t/JSON和JSONP有什么区别

#2楼

“JSONP is JSON with extra code” would be too easy for the real world. “JSONP是带有额外代码的JSON”对于现实世界来说太容易了。 No, you gotta have little discrepancies. 不，你的差异很小。 What's the fun in programming if everything just works ? 如果一切正常，编程的乐趣是什么？

Turns out JSON is not a subset of JavaScript . 原来JSON不是JavaScript的子集。 If all you do is take a JSON object and wrap it in a function call, one day you will be bitten by strange syntax errors, like I was today. 如果您所做的只是获取一个JSON对象并将其包装在一个函数调用中，那么有一天您会被奇怪的语法错误所困扰，就像我今天一样。

#3楼

JSONP stands for “JSON with Padding” and it is a workaround for loading data from different domains. JSONP代表“带填充的JSON”，它是一种从不同域加载数据的解决方法。 It loads the script into the head of the DOM and thus you can access the information as if it were loaded on your own domain, thus by-passing the cross domain issue. 它将脚本加载到DOM的头部，因此您可以像访问自己的域一样访问信息，从而绕过跨域问题。

jsonCallback(
{"sites":[{"siteName": "JQUERY4U","domainName": "http://www.jquery4u.com","description": "#1 jQuery Blog for your Daily News, Plugins, Tuts/Tips &amp; Code Snippets."},{"siteName": "BLOGOOLA","domainName": "http://www.blogoola.com","description": "Expose your blog to millions and increase your audience."},{"siteName": "PHPSCRIPTS4U","domainName": "http://www.phpscripts4u.com","description": "The Blog of Enthusiastic PHP Scripters"}]
});(function($) {
var url = 'http://www.jquery4u.com/scripts/jquery4u-sites.json?callback=?';$.ajax({type: 'GET',url: url,async: false,jsonpCallback: 'jsonCallback',contentType: "application/json",dataType: 'jsonp',success: function(json) {console.dir(json.sites);},error: function(e) {console.log(e.message);}
});})(jQuery);

Now we can request the JSON via AJAX using JSONP and the callback function we created around the JSON content. 现在我们可以使用JSONP和我们围绕JSON内容创建的回调函数通过AJAX请求JSON。 The output should be the JSON as an object which we can then use the data for whatever we want without restrictions. 输出应该是JSON作为对象，然后我们可以无限制地将数据用于我们想要的任何内容。

#4楼

JSON JSON

JSON (JavaScript Object Notation) is a convenient way to transport data between applications, especially when the destination is a JavaScript application. JSON（JavaScript Object Notation）是在应用程序之间传输数据的便捷方式，尤其是当目标是JavaScript应用程序时。

Example: 例：

Here is a minimal example that uses JSON as the transport for the server response. 这是一个使用JSON作为服务器响应传输的最小示例。 The client makes an Ajax request with the jQuery shorthand function $.getJSON. 客户端使用jQuery简写函数$ .getJSON发出Ajax请求。 The server generates a hash, formats it as JSON and returns this to the client. 服务器生成哈希，将其格式化为JSON并将其返回给客户端。 The client formats this and puts it in a page element. 客户端对此进行格式化并将其放在页面元素中。

Server: 服务器：

get '/json' docontent_type :jsoncontent = { :response  => 'Sent via JSON',:timestamp => Time.now,:random    => rand(10000) }content.to_json
end

Client: 客户：

var url = host_prefix + '/json';
$.getJSON(url, function(json){$("#json-response").html(JSON.stringify(json, null, 2));
});

Output: 输出：

  {"response": "Sent via JSON","timestamp": "2014-06-18 09:49:01 +0000","random": 6074}

JSONP (JSON with Padding) JSONP（带填充的JSON）

JSONP is a simple way to overcome browser restrictions when sending JSON responses from different domains from the client. 从客户端发送来自不同域的JSON响应时， JSONP是一种克服浏览器限制的简单方法。

The only change on the client side with JSONP is to add a callback parameter to the URL 客户端对JSONP的唯一更改是向URL添加回调参数

Server: 服务器：

get '/jsonp' docallback = params['callback']content_type :jscontent = { :response  => 'Sent via JSONP',:timestamp => Time.now,:random    => rand(10000) }"#{callback}(#{content.to_json})"
end

Client: 客户：

var url = host_prefix + '/jsonp?callback=?';
$.getJSON(url, function(jsonp){$("#jsonp-response").html(JSON.stringify(jsonp, null, 2));
});

Output: 输出：

 {"response": "Sent via JSONP","timestamp": "2014-06-18 09:50:15 +0000","random": 364
}

Link: http://www.codingslover.blogspot.in/2014/11/what-are-differences-between-json-and-jsonp.html 链接： http ： //www.codingslover.blogspot.in/2014/11/what-are-differences-between-json-and-jsonp.html

#5楼

Basically, you're not allowed to request JSON data from another domain via AJAX due to same-origin policy. 基本上，由于同源策略，您不允许通过AJAX从另一个域请求JSON数据。 AJAX allows you to fetch data after a page has already loaded, and then execute some code/call a function once it returns. AJAX允许您在页面加载后获取数据，然后在返回后执行一些代码/调用函数。 We can't use AJAX but we are allowed to inject <script> tags into our own page and those are allowed to reference scripts hosted at other domains. 我们不能使用AJAX，但我们可以将<script>标签注入我们自己的页面，并允许它们引用托管在其他域的脚本。

Usually you would use this to include libraries from a CDN such as jQuery . 通常你会使用它来包含来自CDN的库，例如jQuery 。 However, we can abuse this and use it to fetch data instead! 但是，我们可以滥用它并使用它来获取数据！ JSON is already valid JavaScript (for the most part), but we can't just return JSON in our script file, because we have no way of knowing when the script/data has finished loading and we have no way of accessing it unless it's assigned to a variable or passed to a function. JSON已经是有效的JavaScript（大多数情况下），但是我们不能只在我们的脚本文件中返回JSON，因为我们无法知道脚本/数据何时完成加载，我们无法访问它，除非它是分配给变量或传递给函数。 So what we do instead is tell the web service to call a function on our behalf when it's ready. 所以我们所做的就是告诉Web服务在它准备就绪时代表我们调用一个函数。

For example, we might request some data from a stock exchange API, and along with our usual API parameters, we give it a callback, like callThisWhenReady . 例如，我们可能会从证券交易所API请求一些数据，并且与我们通常的API参数一起，我们给它一个回调，比如callThisWhenReady 。 The web service then wraps the data with our function and returns it like this: callThisWhenReady({...data...}) . 然后，Web服务使用我们的函数包装数据并返回如下： callThisWhenReady({...data...}) 。 Now as soon as the script loads, your browser will try to execute it (as normal), which in turns calls our arbitrary function and feeds us the data we wanted. 现在，只要脚本加载，您的浏览器就会尝试执行它（正常情况下），它会调用我们的任意函数并向我们提供我们想要的数据。

It works much like a normal AJAX request except instead of calling an anonymous function, we have to use named functions. 它的工作方式与普通的AJAX请求非常相似，除了不是调用匿名函数，我们必须使用命名函数。

jQuery actually supports this seamlessly for you by creating a uniquely named function for you and passing that off, which will then in turn run the code you wanted. jQuery实际上为您提供了无缝支持，方法是为您创建一个唯一命名的函数并将其传递出去，然后依次运行您想要的代码。

#6楼

JSONP is essentially, JSON with extra code, like a function call wrapped around the data. JSONP本质上是带有额外代码的JSON，就像围绕数据的函数调用一样。 It allows the data to be acted on during parsing. 它允许在解析期间对数据执行操作。

JSON和JSONP有什么区别？相关推荐

json和jsonp区别与讲解
前言: 说到AJAX就会不可避免的面临两个问题,第一个是AJAX以何种格式来交换数据?第二个是跨域的需求如何解决?这两个问题目前都有不同的解决方案,比如数据可以用自定义字符串或者用XML来描述,跨域 ...
JSON和JSONP的区别
首先回顾一下JSON和JSONP. 什么是 JSON? JSON 指的是 JavaScript 对象标记法(JavaScript Object Notation) JSON 是一种轻量级的数据交换格式 ...
说说JSON和JSONP，也许你会豁然开朗，含jQuery用例
前言: 说到AJAX就会不可避免的面临两个问题,第一个是AJAX以何种格式来交换数据?第二个是跨域的需求如何解决?这两个问题目前都有不同的解决方案,比如数据可以用自定义字符串或者用XML来描述,跨域可 ...
json和jsonp（json是目的，jsonp是手段）
自己理解:JSON是一种数据交换格式,而JSONP是一种依靠开发人员的聪明才智创造出的一种非官方跨域数据交互协议.我们拿最近比较火的谍战片来打个比方,JSON是地下党们用来书写和交换情报的" ...
JSON和JSONP
说说JSON和JSONP,也许你会豁然开朗作者: 随它去吧来源: 博客园发布时间: 2012-07-16 14:33 阅读: 8069 次推荐: 75 原文链接 [收藏] ...
说说JSON和JSONP，也许你会豁然开朗，含jQuery使用jsonp用例
[原创]说说JSON和JSONP,也许你会豁然开朗,含jQuery用例前言: 由于Sencha Touch 2这种开发模式的特性,基本决定了它原生的数据交互行为几乎只能通过AJAX来实现. 当然了 ...
Ajax跨域提交JSON和JSONP
可以直接使用$.getJSON()方法实现跨域请求,参数中必须加上callback,如: var jsonpUrl = 'http://www.test.com/index.php?c=Api_Ord ...
JSON和JSONP （含jQuery实例）（share）
说到AJAX就会不可避免的面临两个问题,第一个是AJAX以何种格式来交换数据?第二个是跨域的需求如何解决?这两个问题目前都有不同的解决方案,比如数据可以用自定义字符串或者用XML来描述,跨域可以通过服 ...
json和jsonp的问题
本文转载自:http://www.cnblogs.com/dowinning/archive/2012/04/19/json-jsonp-jquery.html 前言: 说到AJAX就会不可避免的面临 ...

JSON和JSONP有什么区别？

#1楼

#2楼

#3楼

#4楼

#5楼

#6楼

JSON和JSONP有什么区别？相关推荐

最新文章

热门文章