ajax 跨域請求，每次會發送兩個請求？

跨域已是個老話題了，可是最近搞百度的語音接口的時候，在服務端配置了 CORS ，跨域卻是沒問題，可是每次都會發送兩個請求：

第一條的請求信息是這樣的：

method 是 OPTIONS，而且沒有返回數據

而後第二條纔是正常的請求；

查了資料發現這個 OPTIONS 是瀏覽器的預檢請求，

而致使瀏覽器預檢的緣由是瀏覽器認爲此次跨域請求爲複雜請求( not-so-simple request 非簡單請求)；

瀏覽器對簡單請求的斷定規則是：

（1) 請求方法是如下三種方法之一：

• HEAD
• GET
• POST

（2）HTTP的頭信息不超出如下幾種字段：

• 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 則是沒法緩存的，