JSON 与 JSONP 入门理解

jsonp我根本不知道什么,每次我都记成了jquery的一个ajax方法,但其实不是。其实这是一个解决跨域问题的一个方法。我个人是比较喜欢在php上加上header(“Access-Control-Allow-Origin:*”)的,所已这个跨域问题我其实真的不是很明白。

JSONP

js的jsonp其实就是利用script标签的src属性不会受到跨域的影响,所以把php当作script标签加载进来了。但是只是加载php是不行的,所以需要事件处理函数,于是就是必须在加载php的同时传入参数了:

<script type="text/javascript" src="http://localhost/ajax/jsonp.php?jsoncallback=func"></script>

我一开始不理解什么是jsoncallback参数,现在理解了。这是一个函数名,实在网页中定义的事件处理函数,用来处理php返回的数据:

<script>
function func(result) {
    var html = '<ul>';
    for(i in result) {
        html+= '<li>'+result[i]+'</li>';
    }
    html += '</ul>';
    document.getElementById("result").innerHTML = html;
}
</script>

php的内容很简单,是这样:

<?php
header('Content-type: application/json');
$jsoncallback = htmlspecialchars($_GET["jsoncallback"]);

$json_data = '["data1","data2"]';

echo $jsoncallback."(".$json_data.")";

?>

返回到html中的是这样的内容:

func(["data1","data2"])

这不就是javascript嘛?之前都定义好了func函数,所以执行之后
就是这样了:

<ul>
<li>data1</li>
<li>data2</li>
</ul>

这就是jsonp,实现跨域的方法之一。
也可以用jquery的方法来实现,更加简单一点:

$.getJSON("//127.0.0.1/AJAX/data/jsonp.php?jsoncallback=?", function(data) {
            var html = '<ul>';
            for (i in data) {
                html += '<li>' + data[i] + '</li>';
            }
            html += '</ul>';
            document.getElementById("result").innerHTML = html;
        })

JSON

json我觉得是js与php交流的核心内容,php只能返回字符串给js,但是根据字符串的不同,到了js里就变成了不同的数据类型。

$arr = '["a","b","c"]';
$obj = '{"a":1,"b":2,"c":3}';

在php里这就是字符串,没什么区别,到了js里这就是数组和对象。
但其实我们还是需要对象字符串比较好用,在php里没有js里的对象,但是有特殊的索引数组,和js中的对象是一样的:

$data = array(
'id' => "1",
'title' => "First image",
'url' => "http://www.example.org/1",
'width' => "200",
'height' => "283",
'image' => "../sample-images/image_1_big.jpg",
'preview' => "../sample-images/image_1.jpg"
  )
echo $data; //会报错
echo json_encode($data);需要转化为json字符串

这就需要用到php的json_encode方法把数组转化为json字符串了。
还有一种php的对象:

class Emp {
     public $name = "";
     public $hobbies  = "";
     public $birthdate = "";
 }
 $e = new Emp();
 $e->name = "sachin";
 $e->hobbies  = "sports";
 $e->birthdate = date('m/d/Y h:i:s a', "8/5/1974 12:20:03 p");

 echo json_encode($e);

也是一样的道理。