原创

添加Access-Control-Allow-Origin主机头, 授权资源跨站访问

今天发现访问了html5页面,报了如下错误:

XMLHttpRequest cannot load http://api.yueny.com/. 
No Access-Control-Allow-Origin header is present on the requested resource. 
Origin http://api.yueny.com is therefore not allowed access

Access-Control-Allow-Origin是HTML5中定义的一种服务器端返回Response header,用来解决资源(比如字体)的跨域权限问题。它定义了该资源允许被哪个域引用,或者被所有域引用(google字体使用*表示字体资源允许被所有域引用)。

基本上, 这是一个http的header, 用在返回资源的时候, 指定这个资源可以被哪些网域跨站访问.

比方说, 你的图片都放在 res.byneil.com 这个域下, 如果在返回的头中没有设置 Access-Control-Allow-Origin , 那么别的域是不能外链你的图片的.

解决方法就是 在资源的头中 加入Access-Control-Allow-Origin 指定你授权的域. 我这里无所谓,就指定星号 * , 任何域都可以访问我的资源.

Access-Control-Allow-Origin: *

具体操作方法, 就是在nginx的conf文件中加入以下内容:

location / {
     add_header Access-Control-Allow-Origin       http://blog.codealy.com;
}

参考:
https://www.w3.org/TR/cors/#access-control-allow-methods-response-header
http://www.html5rocks.com/en/tutorials/cors/

正文到此结束
该篇文章的评论功能已被站长关闭
广告是为了更好的提供数据服务
本文目录