跨域时，遇到的options 请求详解
背景：
在项目跨域中，发送post 请求时； 发现服务器收到了两次请求，一次options请求，一次post请求;
本文就是针对这个options请求，进行分析.
1、什么是options请求？
HTTP 的 OPTIONS 方法 用于获取目的资源所支持的通信选项。客户端可以对特定的 URL 使用 OPTIONS 方法，也可以对整站（通过将 URL 设置为“*”）使用该方法。
mdn web doc
语法：
OPTIONS /index.html HTTP/1.1OPTIONS * HTTP/1.1
2、options 应用场景
场景一：检测服务器所支持的请求方法
可以使用 OPTIONS 方法对服务器发起请求，以检测服务器支持哪些 HTTP 方法：
curl -X OPTIONS http://example.org -i
解析：curl 是一个指令，在类似liunx操作系统中，可以使用curl指令去发起请求
场景二：CORS 中的预检请求
在 CORS 中，可以使用 OPTIONS 方法发起一个预检请求，以检测实际请求是否可以被服务器所接受。
解析:
cors 是解决跨域的一种常见方式，至于为什么会有跨域，这就是浏览器的一种安全策略：浏览器同源策略；这里就不赘述了。
跨域资源共享(CORS)是一种机制，它使用额外的HTTP头来告诉浏览器让运行在一个origin (domain)上的Web应用被准许访问来自不同源服务器上的指定的资源。当从与该资源本身所在的服务器不同的域或端口请求一个资源时，资源会发起一个跨域HTTP请求。
比如，站点http://domain-a.com 的某 HTML页面通过的src请求 http:ldomain-b.com/image.jpg 。网络上的许多页面都会加载来自不同域的CSS样式表，图像和脚本等资源。
出于安全原因，浏览器限制从脚本内发起的跨源HTTP请求。例如XMLHttpRequest和Fetch API遵循同源策略。
这意味着使用这些API的Web应用程序只能从加载应用程序的同一个域请求HTTP资源，除非使用CORS头文件。
浏览器将CORS请求分为两类：简单请求（simple request）和⾮简单请求（not-simple-request）,简单请求浏览器不会预检，⽽⾮简单请求会预检。
同时满⾜下列三⼤条件，就属于简单请求，否则属于⾮简单请求
请求⽅式只能是：GET、POST、HEAD
2.HTTP请求头限制这⼏种字段：Accept、Accept-Language、Content-Language、Content-Type、Last-Event-ID
3.Content-type只能取：application/x-www-form-urlencoded、multipart/form-data、text/plain
3. 优化OPTIONS请求：Access-Control-Max-Age 或者 避免触发
可见一旦达到触发条件，跨域请求便会一直发送2次请求，这样增加的请求数是否可优化呢？答案是可以，OPTIONS预检请求的结果可以被缓存。
Access-Control-Max-Age这个响应首部表示 preflight request （预检请求）的返回结果（即 Access-Control-Allow-Methods 和Access-Control-Allow-Headers 提供的信息） 可以被缓存的最长时间，单位是秒。
如果值为 -1，则表示禁用缓存，每一次请求都需要提供预检请求，即用OPTIONS请求进行检测.
4. 总结
尽量避免不要触发OPTIONS请求, 即用OPTIONS请求进行检测。
在其他场景，比如跨域并且业务有自定义请求头的话就很难避免了。现在使用的axios或者superagent等第三方ajax插件，如果出现CORS预检请求，可以看看默认配置或者二次封装是否规范。
苟有恒 , 何必三更眠五更起关注我，一起学习吧
鼓励一下，赐个赞 和 在看吧
