JSON和JSONP

JSON

简介

JSON是一种轻量级数据交换格式，基于ECMAScript（欧洲计算机协会制定的js规范）的一个子集，采用完全独立于编程语言的文本格式来存储和表示数据。

JSON可理解为是一种严格的js对象的格式，JSON的属性名必须用双引号括起来，如果值是字符串，也必须用双引号括起来。JSON在量上可以无限扩展。

示例代码：

var obj={shuxing1:'123',shuxing2:'qwe'}; //js对象
 
var json='{"shuxing1":"123","shuxing2":"qwe"}'; //JSON字符串
 
var jsonarr=[{"a":"1"},{"b":"2","c":"3"}];//JSON数组

注意：

        JSON标准不允许"控制字符"如制表符或换行符，因为js解析器会将字符串中的\t或\n等转义直接视作字面值，起到Tab或换行的效果。解决办法就是在\t和\n等控制字符前再加上一个反斜杠\，以避免被js解析器直接转移。

示例代码：

$.parseJSON('{"key":"string\\tstring\\nstring"}');

转换

js对象 转成 JSON字符串

1.JSON.stringify()。

JSON字符串 转成 js对象

1. JSON.parse(data)。

2. eval('('+data+')')。

3. jQuery里可用$.parseJSON()方法，注意$.parseJSON()只支持标准的JSON，不够标准的JSON数据可以考虑用前两种方法转换。

JSONP

JSONP (JSON with Padding) 是一种可避免引发跨域拒绝问题的传递json数据的方法。一种表现形式就是服务器后台在传递json数据前，先将json数据包裹在一个js函数名里，前端页面需要有这个js函数的同名函数，以便在接收到jsonp数据后能够正确处理。

json不能跨域直接获取，于是就将json包裹在一个合法的js语句中作为js文件传过去。这就是json和jsonp的区别，json是想要的数据，jsonp是实现跨域获取json数据的一种方法。jsonp一般只在跨域获取json数据时才会用到。

json返回的是一串数据；而jsonp返回的是脚本代码（包含一个函数调用）。

代码示例一：

server.php

<?php

header('Content-type: application/javascript');

$jsonCallback = htmlspecialchars($_REQUEST ['callback']);  //获取请求者自定义的回调函数名

$jsonData ='{"key1":"v1","key2":123}';    //待返回的json数据

echo $jsonCallback . "(" . $jsonData . ")"; //输出jsonp格式的数据，即一行函数调用语句

?>

demo.html

$(function () {
    var data= {
        "key1": "v1"
    };
    $.ajax({
        url: "http://www.???.com/server.php",
        type: "POST",
        contentType: "application/json; charset=utf-8",
        dataType: "jsonp",  //json不支持跨域请求,只能使用jsonp
        data: {
            user: JSON.stringify(data)
        },
        jsonp: "callback",  //回掉函数名的参数名，默认callback，服务端通过它来获取到回掉函数名。
        jsonpCallback: "userHandler",  //自定义回调函数名，默认jquery自动生成。
        success: function (data) {       
//处理data
        },
        error: function () {
            alert("请求发生错误，请重新提交。");
        }
    })
});

注意：

1.可以将上例中jsonp和jsonpCallback设为successCallback之类别的函数名。

function successCallback(data) {

    //处理data

}

2.也可以通过文件引入的方式调用jsonp数据。如下：

<script src="http://www.???.com/server.php?callback=fun1"></script>