跨域已是个老话题了,可是最近搞百度的语音接口的时候,在服务端配置了 CORS ,跨域却是没问题,可是每次都会发送两个请求:html
第一条的请求信息是这样的:nginx
method 是 OPTIONS,而且没有返回数据跨域
而后第二条才是正常的请求;浏览器
查了资料发现这个 OPTIONS 是浏览器的预检请求,缓存
而致使浏览器预检的缘由是浏览器认为此次跨域请求为复杂请求( not-so-simple request 非简单请求);app
浏览器对简单请求的断定规则是:cors
(1) 请求方法是如下三种方法之一:url
- HEAD
- GET
- POST
(2)HTTP的头信息不超出如下几种字段:spa
- Accept
- Accept-Language
- Content-Language
- Last-Event-ID
- Content-Type:只限于三个值
application/x-www-form-urlencoded
、multipart/form-data
、text/plain
来自:http://www.ruanyifeng.com/blog/2016/04/cors.html调试
若是不能同时知足上面两个条件则为复杂请求;
而百度 API 要求了
Content-Type:audio/wav; rate=8000 header 项,因此不知足简单请求;
但同时浏览器也支持对预检结果的缓存,能够经过在服务端添加header 设置缓存时间:
add_header Access-Control-Max-Age 3600;
这是在 nginx 的配置方式,3600 是秒数
可是各浏览器支持的最长缓存时间也是不同的:
返回结果能够用于缓存的最长时间,单位是秒。在Firefox中,上限是24小时 (即86400秒),而在Chromium 中则是10分钟(即600秒)。Chromium 同时规定了一个默认值 5 秒。
若是值为 -1,则表示禁用缓存,每一次请求都须要提供预检请求,即用OPTIONS请求进行检测。
来自:https://developer.mozilla.org/zh-CN/docs/Web/HTTP/Headers/Access-Control-Max-Age
有个须要注意的地方,调试的时候若是开启了 disable cache 则是没法缓存的,