码迷,mamicode.com
首页 > Web开发 > 详细

初步了解JSONP

时间:2016-04-14 22:16:07      阅读:228      评论:0      收藏:0      [点我收藏+]

标签:

一、JSON 与 JSONP 

JSON是一种基于文本的数据交换方式(数据描述格式),JSONP是一种非官方跨域数据交互协议。

ajax的核心是通过XmlHttpRequest获取非本页内容,而jsonp的核心则是动态添加<script>标签来调用服务器提供的js脚本。

二、为什么要用JSONP

Ajax直接请求普通文件是跨域无权限访问的,但是Web页面上调用js文件时则不受是否跨域影响,于是服务端可以将数据装进JS文件传输回来。jQuery支持JSONP。

方式:用户传递一个callback参数给服务端,然后服务端返回数据时会将这个callback参数作为函数名来包裹住JSON数据,这样客户端就可以随意定制自己的函数来自动处理返回数据了。

 

三、DEMO

JQUERY

 

$.ajax({
             type: "get",
             async: false,//true为异步请求(默认)。false为同步请求,同步请求将锁住浏览器,用户其它操作必须等待请求完成才可以执行。
             url: "",
             data:{},//发送到服务器的数据。将自动转换为请求字符串格式。GET 请求中将附加在 URL 后。
             dataType: "jsonp",//预期服务器返回的数据类型。如果不指定,jQuery 将自动根据 HTTP 包 MIME 信息来智能判断.使用 JSONP 形式调用函数时,如 "myurl?callback=?" jQuery 将自动替换 ? 为正确的函数名,以执行回调函数。
             jsonp: "callback",//传递给请求处理程序或页面的,用以获得jsonp回调函数名的参数名(默认为:callback)
             jsonpCallback:"",//自定义的jsonp回调函数名称,默认为jQuery自动生成的随机函数名,也可以写"?",jQuery会自动为你处理数据,(如果没设置,服务器可以用$_GET[‘callback‘]取到jquery默认生成的随机函数名)
             success: function(data){//请求成功后的回调函数。
                console.log(data);
             },
             error: function(msg){//请求失败时调用此函数。
                 console.log(msg);
             }
         });

  

PHP

 
		 function jsonp($json)
		{
			$callback = isset($_GET[‘callback‘]) ? $_GET[‘callback‘] : $_POST[‘callback‘];
			if (!preg_match(‘|^[0-9a-zA-Z_]+$|‘,$callback))exit(‘callback invalid‘);

			if (is_array($json))
			{
				$json = json_encode($json);
			}

			echo $callback.‘(‘.$json.‘);‘;
			exit;
		}
		jsonp(array(‘ret‘=>0));

  

初步了解JSONP

标签:

原文地址:http://www.cnblogs.com/lzs-888/p/5392881.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!