解决 js ajax跨域访问报“No 'Access-Control-Allow-Origin' header is present on the requested resource.”错误

    在实现不同端口号之间访问时遇到了跨域报错问题

前言

http://www.a.com/test.html 发起一个跨域请求,
请求的地址为: http://www.b.com/test.PH

在本地用ajax跨域访问请求时报错:

XMLHttpRequest cannot loadhttp://www.zjblogs.com/. No 'Access-Control-Allow-Origin' 
header is present on the requested resource. Origin 'null' is therefore not allowed access.

问题原因

W3C标准里是这么实现HTTP跨域请求的, Cross-Origin Resource Sharing

简单的来说,就是跨域的目标服务器要返回一系列的Headers,通过这些Headers来控制是否同意跨域。

  • Access-Control-Allow-Origin HTTP Response Header
  • Access-Control-Max-Age HTTP Response Header
  • Access-Control-Allow-Credentials HTTP Response Header
  • Access-Control-Allow-Methods HTTP Response Header
  • Access-Control-Allow-Headers HTTP Response Header
  • Origin HTTP Request Header
  • Access-Control-Request-Method HTTP Request Header
  • Access-Control-Request-Headers HTTP Request Header

在 Request 包和 Response 包中都有一些。
其中最敏感的就是 Access-Control-Allow-Origin 这个 Header, 他是W3C标准里用来检查该跨域请求是否可以被通过。 (Access Control Check)

解决方法

1、在java服务器端的filter或者servlet里面添加

response.setHeader("Access-Control-Allow-Origin", "*"); 

2、如果请求的url是aspx页面,则需要在aspx页面中添加代码

Response.AddHeader("Access-Control-Allow-Origin", "*");

3、如果请求的url是PHP页面

header("Access-Control-Allow-Origin: *");

4、如果请求的url是静态的html页面,则需要在页面中添加meta标签代码:

<meta http-equiv="Access-Control-Allow-Origin" content="*" />

“Access-Control-Allow-Origin”表示允许跨域访问,“*”表示允许所有来源进行跨域访问,这里也可以替换为特定的域名或ip。
很显然,这种方式对非网站拥有人员来说是不能做到的。而且此种方式很容易受到CSRF攻击。

如果还不行,就把这些都加上吧

// 指定允许其他域名访问    
header('Access-Control-Allow-Origin:*');    
// 响应类型    
header('Access-Control-Allow-Methods:POST');    
// 响应头设置    
header('Access-Control-Allow-Headers:x-requested-with,content-type');  

注意:
参考文章:
http://blog.csdn.net/cnyygj/article/details/68489200

  • 1
    点赞
  • 26
    收藏
    觉得还不错? 一键收藏
  • 4
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 4
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值