简述jsonp跨域实例

关于ajax跨域请求问题

首先我们需要两个域名，也就是两台机器，这里我使用本机和本地虚拟机进行测试。
1.我本地的地址是localhost，作为客户端。
2.我的虚拟机地址是192.168.254.128，作为服务端。
3.进行测试。

客户端代码

jsonp.php

<script> $(function() { $.ajax({ url:'http://192.168.254.128/index.php', type:'post', dataType:'json', success:function(data) { alert(data[0]); } }); }); </script>

服务端代码

index.php

//这里只是构建一个json串
$json_data = '["customername","customername2"]';
echo $json_data;

这样当我在本地访问localhost/jsonp.php的时候就会报错了

因为ajax是不允许我们进行跨域操作的。跨域就是跨越了域名，除了localhost以外的域名都会报错。
那么我们如何解决这个问题呢，这时候就出现了jsonp。下面就使用jsonp对代码进行改造：

客户端代码

jsonp.php

<script> $(function() { $.ajax({ url:'http://192.168.254.128/index.php?jsoncallback=?', type:'post', dataType:'json', success:function(data) { alert(data[0]); } }); }); </script>

服务端代码

index.php

<?php $jsoncallback = htmlspecialchars($_REQUEST['jsoncallback']); $json_data = '["customername","customername2"]'; eccho $jsoncallback."(".$json_data.")"; ?>

这时候在访问localhost/jsonp.php就能够成功的获取数据了。