Jsonp 跨域

发布时间：2020-12-16 19:55:37 所属栏目：百科来源：网络整理

导读：客户端请求： !DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"html head title New Document /title meta http-equiv="Content-Type" content="text/html;charset=utf-8" script src="./jquery-1.7.

客户端请求：

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
 <head>
  <title> New Document </title>
  <meta http-equiv="Content-Type" content="text/html;charset=utf-8">
  <script src="./jquery-1.7.2.js"></script>
 </head>

 <body>

	<div id="vvgBox">
        <ul id="gameCanvas">aa</ul>
    </div>

	<script type="text/javascript">
		var qsData = "123454";
		$.ajax({
			url: "http://www.jaap.com/jsonp.php",type: "POST",dataType: 'jsonp',jsonp: 'callback',data: qsData,timeout: 2000,success: function (json) {//客户端jquery预先定义好的callback函数,成功获取跨域服务器上的json数据后,会动态执行这个callback函数
				alert(json);
			}
		});

	</script>

 </body>
</html>

服务器端响应：

<?php
//服务端返回JSON数据  
$arr=array('a'=>1,'b'=>2,'c'=>3,'d'=>4,'e'=>5);  
$result=json_encode($arr);  

//动态执行回调函数  
$callback=$_GET['callback'];  
echo $callback."($result)";

响应结果：

Jsonp优点：它不像XMLHttpRequest对象实现的Ajax请求那样受到同源策略的限制；它的兼容性更好，在更加古老的浏览器中都可以运行，不需要XMLHttpRequest或ActiveX的支持；并且在请求完毕后可以通过调用callback的方式回传结果。

Jsonp缺点：JSONP不提供错误处理。如果动态插入的代码正常运行，你可以得到返回，但是如果失败了，那么什么都不会发生。你无法获得一个404的错误，也不能取消这个请求。另外一个重要的缺点是如果使用了不信任的服务会造成很大的安全隐患。它只支持GET请求而不支持POST等其它类型的HTTP请求；它只支持跨域HTTP请求这种情况，不能解决不同域的两个页面之间如何进行JavaScript调用的问题。

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!