由于安全限制(同源策略, 即JavaScript或Cookie只能访问同域下的内容),ajax跨域请求的两种方案
方案一:jsonp (JSON with Padding)
但是jsonp有一个缺点就是不支持get传参
方案二:CORS(跨域资源共享,Cross-Origin Resource Sharing)
此方案支持post提交
假设我们在http://www.a域名.com域名ajax请求http://www.111cn.net域名下的数据;若使用cors来实现,ajax跨域请求。
只要在http://www.111cn.net域要在被请求的php脚本头部添加
header("Access-Control-Allow-Origin:http://www.a域名.com");便可。
这句的意思是允许http://www.a域名.com跨域访问到http://www.111cn.net域
代码实例:
[http://www.a域名.com域名下的 index.html 文件]
代码如下 | 复制代码 |
<!--此域名在http://www.a域名.com域名下--> <html> <head> <title>CORE-AJAX跨域</title> <meta charset="utf-8" /> <script src="http://gongwen.sinaapp.com/Public/Js/jquery-1.7.2.min.js"></script> </head> <body> <script type="text/javascript"> $(function(){ var url='http://www.111cn.net/server.php'; $.post(url,{name:'巩文',blog:'www.bestphper.cn'},function(data){ var info=eval('('+data+')'); $('body').html('name:'+info.name+'<br>blog:'+info.blog+'<br>from:'+info.from); }); }); </script> </body> </html> |
[http://www.111cn.net域名下的 server.php 文件]
代码如下 | 复制代码 |
<?php //注此文件在http://www.111cn.net域名下 //header("Access-Control-Allow-Origin:http://www.a域名.com"); $arr=array( 'name'=>$_POST['name'], 'blog'=>$_POST['blog'], 'from'=>'http://www.111cn.net' ); echo json_encode($arr);
|
[火狐浏览器访问 http://www.a域名.com ]
那么问题来了,如何用CORS来解决这个ajax跨域问题呢?
只要将http://www.111cn.net域名下的server.php文件中的
//header("Access-Control-Allow-Origin:http://www.a域名.com");
的注释去掉便可。去掉之后再用浏览器进行访问http://www.a域名.com
[其它]
若把php文件的
header("Access-Control-Allow-Origin:*");写成这样,则说明任务一个域都可以去ajax请求此文件