关于CORS 跨源资源共享

因为最近的开发中用到 react，前后端分的比较开，遇到了 cors的问题，读这篇文章把这个概念简单梳理一下

Cross-Origin Resource Sharing (CORS) - HTTP | MDN

a域名的页面中，有向b域名发出请求的操作。

GET /resources/public-data/ HTTP/1.1

Host: bar.other

User-Agent: Mozilla/5.0 (Macintosh; U; Intel Mac OS X 10.5; en-US; rv:1.9.1b3pre) Gecko/20081130 Minefield/3.1b3pre

Accept: text/html,application/xhtml+xml,application/xml;q=0.9,*/*;q=0.8

Accept-Language: en-us,en;q=0.5

Accept-Encoding: gzip,deflate

Accept-Charset: ISO-8859-1,utf-8;q=0.7,*;q=0.7

Connection: keep-alive

Referer: http://foo.example/examples/access-control/simpleXSInvocation.html

Origin: http://foo.example

HTTP/1.1 200 OK

Date: Mon, 01 Dec 2008 00:23:53 GMT

Server: Apache/2.0.61

Access-Control-Allow-Origin: *

Keep-Alive: timeout=2, max=100

Connection: Keep-Alive

Transfer-Encoding: chunked

Content-Type: application/xml

[XML Data]

以上是一个简单的跨站访问Origin 和 Access-Control-Allow-Origin 分别表示请求的源头与是否允许跨源访问。

如果满足某些条件，是需要先发送 OPTIONS 方法来进行 preflight 检查的，具体参考原文。

值得注意的是，如果需要加 Cookie，那么Access-Control-Allow-Origin 不能用通配符 *，需要指定源地址。