ajax跨域问题总结

来源:互联网 发布:mac怎么更改字体大小 编辑:程序博客网 时间:2024/05/18 20:07

在实际项目开发中经常会遇到ajax跨域问题,实习第一次碰到的时候着实懵逼了一把,自己的ajax写的没问题啊,问了同事才知道是跨域了。

跨域跨域顾名思义就是跨域名,比如我的开发环境是测试环境(a.####.com),后台给我的接口url地址是预发布环境(b.####.com),这个时候我在a域名下写的ajax去请求b域名下的地址就会产生跨域问题,造成无法返回结果。

为什么会造成无法跨域请求呢,就是JavaScript的同源策略在作怪。即JavaScript只能访问在同一域名下的内容,不同域名下的脚本不能互相访问,即便是子域也不行。

简诉两种经常采用的ajax跨域的解决办法:

  • jsonp
    jsonp 是一种json数据调用的方式,利用script标签可以跨域(Web页面上调用js文件时不受跨域的影响),用户传递一个callback参数给服务端,然后服务端返回数据时会将这个callback参数作为函数名来包裹住json数据。
    这里就举例jquery ajax方法(公司使用的jquery):
$.ajax({    type: "get",    url: "跨域地址",    dataType: "jsonp",    jsonp: "jsoncallback",    success: function(data){        alert(data.XXX);    },});

推荐一篇对jsonp写的比较透彻的文章:
http://www.cnblogs.com/dowinning/archive/2012/04/19/json-jsonp-jquery.html
但是jsonp只支持get请求,因此在文件的大小上有所限制。

  • CORS
    如果jsop不满足需求的话(承载信息量比较大只能用post),可以配置目标服务器的CORS:加header头

举例php的用法(公司使用的php):

header('Access-Control-Allow-Origin:*');“*”号表示允许任何域向我们的服务端提交请求或者header('Access-Control-Allow-Origin:http://a.###.com');限定只允许a.###.com 域名的请求。

以后还学习到其他跨域的解决办法,再来后续更新

0 0
原创粉丝点击