您的位置:首页 > 其它

解决ajax跨域问题的多种方法

2015-05-07 19:03 417 查看
//第一种方法使用jsonp的方式

<script type="text/javascript" src="http://www.youxiaju.com/js/jquery-1.4.2.min.js"></script>
<script type="text/javascript">
$(function(){
$.ajax(
{
type:'get',
url : 'http://www.youxiaju.com/validate.php?loginuser=lee&loginpass=123456',
dataType : 'jsonp',
jsonp:"jsoncallback",
success  : function(data) {
alert("用户名:"+ data.user +" 密码:"+ data.pass);
},
error : function() {
alert('fail');
}
}
);
})
</script>


  

<?php
header('Content-Type:text/html;Charset=utf-8');
$arr = array(
"user" => $_GET['loginuser'],
"pass" => $_GET['loginpass'],
"name" => 'response'

);
echo $_GET['jsoncallback'] . "(".json_encode($arr).")";


  第二种方式增加headr头

 假设我们页面或者应用已在 http://www.test1.com 上了,而我们打算从 http://www.test2.com 请求提取数据。一般情况下,如果我们直接使用 AJAX 来请求将会失败,浏览器也会返回“源不匹配”的错误,"跨域"也就以此由来。
  利用 CORS,http://www.test2.com 只需添加一个标头,就可以允许来自 http://www.test1.com 的请求,下图是我在PHP中的 hander() 设置,“*”号表示允许任何域向我们的服务端提交请求



  也可以设置指定的域名,如域名 http://www.test2.com ,那么就允许来自这个域名的请求



  当前我设置的header为“*”,任意一个请求过来之后服务端我们都可以进行处理&响应,那么在调试工具中可以看到其头信息设置,其中见红框中有一项信息是“Access-Control-Allow-Origin:* ”,表示我们已经启用CORS,如下图。
  PS:由于demo都在我厂的两台测试机间完成,外网也不能访问,所以在这就不提供demo了,见谅




  简单的一个header设置,一个支持跨域&POST请求的server就完成了:)

  当然,如果没有开启CORS必定失败的啦,如下图:
  
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: