JSONP的工作原理,如何解决跨域问题，以及JSON 和XML数据格式的区别

先说说什么是JSONP，这首先还要引出一个概念：跨域。咱们先通过一些例子来先了解什么是跨域。

一.由于javascript的同源策略限制，出于安全方面的考虑，不允许跨域调用其他页面的对象，不管是静态页面、动态页面、web服务等，只要是跨域请求一律不允许!

二.同源、跨域

所谓同源是指，域名，协议，端口均相同，不明白没关系，举个栗子：

http://www.123.com/index.html 调用 http://www.123.com/server.PHP （非跨域）

http://www.123.com/index.html 调用 http://www.456.com/server.php （主域名不同:123/456，跨域）

http://abc.123.com/index.html 调用 http://def.123.com/server.php （子域名不同:abc/def，跨域）

http://www.123.com:8080/index.html 调用 http://www.123.com:8081/server.php （端口不同:8080/8081，跨域）

http://www.123.com/index.html 调用 https://www.123.com/server.php （协议不同:http/https，跨域）

请注意：localhost和127.0.0.1虽然都指向本机，但也属于跨域。

浏览器执行javascript脚本时，会检查这个脚本属于哪个页面，如果不是同源页面，就不会被执行。

注意：可以请求资源的html标签拥有跨域的能力，比如<script>、<img>、<iframe>、<a>）等。

三.以下三种方法都可以解决跨域问题

1、JSONP：

使用方式等下再说，但是要注意JSONP只支持GET请求，不支持POST请求。

2.代理

依靠服务器解决。

3.html5提供了XMLHttpRequest Level2实现了跨域访问（IE10以下不支持）

JSONP原理 : 把数据在服务器中包裹在函数里,在前端通过script标签发送请求(script标签不会出现跨域问题)

简单的写一个json对象，大家都知道json是数组加对象的形式展现出来的，外边并没有加weather()这种形式！这就是jsonp的意思。后端把数据用函数的形式包裹起来，包裹的函数名由前端传递过去。

下面看代码：通过script标签引入的方式

通过jQuery.ajax()封装的方法

补充说明：

1.jsonp和ajax没有任何关系！只是这两种技术在调用方式上很像，目的也都一样都是请求URL，然后把服务器返回的数据进行处理，只是jQuery把jsonp作为ajax的一种形式做了封装

2.jsonp是一种方式或者说非强制性协议，如同ajax一样，它也不一定非要用json格式来传递数据，如果你愿意，字符串都行，只不过这样不利于用jsonp提供公开服务。

二.XML和JSON的区别

XML和JSON一样都是保存数据的一种结构。先看两者的官方定义

1.XML定义

扩展标记语言 (Extensible Markup Language, XML) ，用于标记电子文件使其具有结构性的标记语言，可以用来标记数据、定义数据类型，是一种允许用户对自己的标记语言进行定义的源语言。 XML使用DTD(document type definition)文档类型定义来组织数据;格式统一，跨平台和语言，早已成为业界公认的标准。

XML是标准通用标记语言 (SGML) 的子集，非常适合 Web 传输。XML 提供统一的方法来描述和交换独立于应用程序或供应商的结构化数据。

2.JSON定义

JSON(JavaScript Object Notation)一种轻量级的数据交换格式，具有良好的可读和便于快速编写的特性。可在不同平台之间进行数据交换。JSON采用兼容性很高的、完全独立于语言文本格式，同时也具备类似于C语言的习惯(包括C, C++, C#, Java, JavaScript, Perl, Python等)体系的行为。这些特性使JSON成为理想的数据交换语言。

JSON基于JavaScript Programming Language , Standard ECMA-262 3rd Edition - December 1999 的一个子集。

通过代码来了解两者的语言形式

XML--->

JSON--->

3.XML和JSON的优缺点

XML优点：

A.格式统一， XML是一种标记语言，很类似HTML。人看这方便理解。

B.容易与其他系统进行远程交互，数据共享比较方便。XML的设计宗旨是传输数据，而非显示数据

C.XML标签没有被预定义。您需要自行定义标签。XML是W3C的推荐标准

缺点：

A.XML文件庞大，传输占带宽，格式复杂

B.服务端和客户端都需要大量的代码去解析XML，花费太多的时间和资源，还导致服务端和客户端代码变得异常复杂和难以维护。

C.客户端不同，浏览器直接解析XML的方式也不一样，需要重复编写很多代码。

JSON的优点：

A.数据格式简单，格式都是压缩的，占用带宽小

B.易于解析，客户端javascript可以通过eval()进行JSON数据的读取

C.支持多种语言，包括ActionScript, C, C#, ColdFusion, Java, JavaScript, Perl, PHP, Python, Ruby等服务器端语言，便于服务器端的解析

D.在PHP世界，已经有PHP-JSON和JSON-PHP出现了，偏于PHP序列化后的程序直接调用，PHP服务器端的对象、数组等能直接生成JSON格式，便于客户端的访问提取；

E.因为JSON格式能直接为服务器端代码使用，大大简化了服务器端和客户端的代码开发量，且完成任务不变，并且易于维护。

缺点：目前并没有什么太大的缺点，当然也不代表可以完全替代XML，xml更多的用于校验和规范,json做数据传输

关于XML和JSON的语法规则可以自行查阅相关文档