在实际的开发中你也许会遇到js的跨域问题
下面列出了一个可以通信和不能通信的情况
情况 | url | 结果 |
同一域名下 |
http://www.phpsong.com/a.js http://www.phpsong.com/b.js |
可以 |
同一域名下不同文件夹 |
http://www.phpsong.com/a.js http://www.phpsong.com/js/b.js |
可以 |
同一域名,不同端口 |
http://www.phpsong.com:8080/a.js http://www.phpsong.com/b.js |
不可以 |
同一域名,不同协议 |
http://www.phpsong.com/a.js https://www.phpsong.com/b.js |
不可以 |
域名和域名对应ip |
http://www.phpsong.com/a.js http://192.168.0.2/b.js |
不可以 |
主域相同,子域不同 |
http://www.phpsong.com/a.js http://js.phpsong.com/b.js |
不可以 |
同一域名,不同二级域名(同上) |
http://www.phpsong.com/a.js http://phpsong.com/b.js |
不可以 |
不同域名 |
http://www.baidu.com/a.js http://www.phpsong.com/b.js |
不可以 |
上面表格中不能通信的情况,实现项目中还是要通行怎么处理,那么就需要跨域
下面总结了4种ajax跨域的解决方法,实例都是使用jquery来操作的,当前域名www.phpsong.com,调用域名js.phpsong.com,根据上面的表格,必须跨域才能访问
①传统的ajax方法
js
$("#ajax").click(function(){ $.ajax({ type: "POST", url: "http://js.phpsong.com/a.php", data: 'name=ajax', dataType:"json", success: function(data){ alert(data.name); } }); });
a.php代码
header("Access-Control-Allow-Origin:http://www.phpsong.com"); //允许www.phpsong.com提交访问 //header("Access-Control-Allow-Origin:*"); //允许任何访问 echo json_encode($_POST);
②$.getJSON
$.getJSON('http://js.phpsong.com/a.php?name=getjson&callback=?', function(data){ //没有回调函数,直接处理 alert(data.name); });
③$.getScript
$.getScript('http://js.phpsong.com/a.php?name=getscript&callback=getdata'); //回调函数根jsonp一样
④ajax jsonp
$("#jsonp").click(function(){ $.ajax({ url: 'http://js.phpsong.com/a.php', data: {name: 'jsonp'}, dataType: 'jsonp', jsonp: 'callback', //为服务端准备的参数 jsonpCallback: 'getdata', //回调函数 success: function(){ alert("success"); } }); }); function getdata(data){ $('#Result').text(data.name); }
a.php
<?php if(isset($_GET['name']) && isset($_GET['callback'])) //callback根js端要对应,不然会报错的 { echo $_GET['callback']. '(' . json_encode($_GET) . ');'; //格式固定的,为什么这样,不清楚 } ?>
QQ交流群:136351212
查看原文:
http://www.phpsong.com/2186.html
版权声明:本文为a454213722原创文章,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接和本声明。