【Do家】彻底搞懂CORS和OPTIONS

【关于OPTIONS】
1> 首先了解CORS定义，官方：
Cross-Origin Resource Sharing (CORS) is a mechanism that uses additional HTTP headers to tell a browser to
let a web application running at one origin (domain) have permission to access selected resources from a server at a different origin.
A web application makes a cross-origin HTTP request when it requests a resource that has a different origin (domain, protocol, and port) than its own origin.

2> 发生CORS的条件：
A> 基于浏览器发请求
B> source-origin与destinaion-origin不匹配
  不匹配指的是：protocol,domian,port，任何一处不一致都定义为不匹配

3> 产生预请求preflight（OPTIONS）的条件：
A> CORS已发生
B> header传入额外或者自定义参数，如：X-Filter,Authorization,Content-type等
C> 请求method，非以下类型：
=>GET
=>HEAD
=>POST
D> 请求content-type，非以下类型：
=>application/x-www-form-urlencoded
=>multipart/form-data
=>text/plain
【小结】不发生CORS，肯定不发生OPTIONS，但发生CORS，并不一定发生OPTIONS，还需要满足一定的条件，header,method,content-type等

4> OPTIONS是由谁发起的？
=>由浏览器，满足规范规定的条件自动发起的，不可控制传入header参数。
=>产生预请求后，相当会发两次请求，OPTIONS+<YourSpecifiedMethod>，preflight和mainflight

5> 解决OPTIONS的Authorization问题
A> 避免走到OPTIONS
B> 传入的授权参数Authorization走URI，而不是从header传入，因为options，browser不会传入额外header参数的

6> 解决CORS方法如下：（选其一即可）
A> 通过Nginx或者其他反向代理服务器，统一source-origin和destination-origin的访问地址。
B> 提供destination-origin的server，重写header参数，如下：
Access-Control-Allow-Credentials:true
Access-Control-Allow-Origin:*
=>对于指定的source-origin，配置具体地址也行，<protocol>://<domain>:<port>
Allow: GET, HEAD, POST, PUT, OPTIONS
Access-Control-Allow-Methods:GET,POST,OPTIONS
Access-Control-Allow-Headers:Origin,GOFUNAUTHORIZATION,AUTHORIZATION,Content-Type

Reference=>https://developer.mozilla.org/en-US/docs/Web/HTTP/CORS#Preflighted_requests

【温馨提示】
如果您觉得满意，可以选择支持下，您的支持是我最大的动力：