首页 > OPTIONS请求 & 已阻止跨源请求:CORS 头缺少 'Access-Control-Allow-Origin'

OPTIONS请求 & 已阻止跨源请求:CORS 头缺少 'Access-Control-Allow-Origin'

原问题已解决,我先切个腹。。
先说一下怎么解决的。。。我在服务器端返回的响应头里:
'Access-Control-Allow-origin': 'http://192.168.8.12:8000'
但是我浏览器地址栏里:
http://andy:8000/src/p/index.html
呵呵哒。。。
然后我就把服务器端改成:
'Access-Control-Allow-origin': 'http://andy:8000'
(andy是我在hosts里配置的,指向127.0.0.1)

新问题:
以GET、POST方式请求,响应都很正常,响应头里都带有服务器端添加的头信息;
以OPTIONS方式请求(或PUT和DELETE方式时,都会先发送一个OPTIONS请求):

然后jQuery在控制台自然会输出:

辣么问题来了:
为什么GET,POST都可以正常请求到响应头,
而OPTIONS取不到服务器端人工添加的头信息?

========================= 分割线 =========================
我model实例.fetch()之后:

另:我在实例view前运行了这段代码:

再另:其实这段应该不用强调。。不过再说一边吧,看第一个图就可知,服务器端在响应头里加了Access-Control-Allow-Origin这个键,值为*。理论上应该没问题了,但是居然说
Access-Control-Allow-Origin不匹配'*'

请问这个肿么解决。。。

================ 补充 ================
在服务器端给响应头里添加了以下参数:
'Access-Control-Allow-origin': 'http://192.168.8.12'
'Access-Control-Allow-Credentials': 'true'
'Access-Control-Allow-Methods': 'GET, POST, PUT, DELETE, OPTIONS'
'Access-Control-Allow-Headers': ‘Origin, No-Cache, X-Requested-With, If-Modified-Since, Pragma, Last-Modified, Cache-Control, Expires, Content-Type, X-E4M-With'
'Content-Type': 'text/html; charset=utf-8'

我通过POST请求,然后:

报这个错是什么节奏呢。。。求教育。。。。

我当前ip:192.168.8.12
服务器端ip:192.168.0.118


标准写法是Access-Control-Allow-Origin
~~但是你截图里返回的是小写的,服务器配置里改成大写看看。~~

另外Access-Control-Allow-Methods这个字段也是必须的。

建议后台添加如下配置:

add_header 'Access-Control-Allow-origin' 'http://www.example.com';
add_header 'Access-Control-Allow-Methods' 'GET, POST';

你用了withCredentials,需要在服务器返回Header中加入Access-Control-Allow-Credentials: true,参考MDN。


@SyuTingSong 只说了一半,最主要的原因是你的请求中withCredentials设为了true

解决方案如下:

Access-Control-Allow-Origin必须设置为具体的域名,而不能设置为*。

例如:

Access-Control-Allow-Origin: http://foo.example

简单原因:

Important note: when responding to a credentialed request, server must specify a domain, and cannot use wild carding.

引用自HTTP access control (CORS) - HTTP | MDN

【热门文章】
【热门文章】