1、header field token is not allowed by Access-Control-Allow-Headers in preflight response

在 Access-Control-Allow-Headers 添加 token

HttpServletResponse res = (HttpServletResponse) response;
res.setHeader("Access-Control-Allow-Origin", "*");
res.setHeader("Access-Control-Allow-Methods", "POST, GET, OPTIONS, DELETE");
res.setHeader("Access-Control-Max-Age", "3600");
res.setHeader("Content-Type", "application/json;charset=utf-8");
res.setHeader("Access-Control-Allow-Headers"
        , "Content-Type, x-requested-with, X-Custom-Header, Authorization, token");

跨域請(qǐng)求

跨域請(qǐng)求的時(shí)候，瀏覽器有可能出發(fā) options 預(yù)檢請(qǐng)求（preflight request）

跨域請(qǐng)求分為 簡(jiǎn)單請(qǐng)求 和 復(fù)雜請(qǐng)求

簡(jiǎn)單請(qǐng)求不需要發(fā)送 options 預(yù)檢請(qǐng)求，但只能發(fā)送簡(jiǎn)單的 get/post，且不能自定義 http 的請(qǐng)求頭。

復(fù)雜請(qǐng)求在發(fā)送真正請(qǐng)求之前會(huì)提前發(fā)送一次 options 預(yù)檢請(qǐng)求，XHR 會(huì)根據(jù)返回的 Access-Control-* 等頭信息判斷是否有對(duì)指定站點(diǎn)的訪問(wèn)權(quán)限，檢查該請(qǐng)求是否安全可靠，如果 options 得到的回應(yīng)是拒絕的，就會(huì)停止發(fā)送實(shí)際的請(qǐng)求。

符合以下任一情況的就是復(fù)雜請(qǐng)求：

1. 使用方法put/delete/patch/post
2. 發(fā)送json格式的數(shù)據(jù)（content-type: application/json）
3. 請(qǐng)求中帶有自定義頭部

為什么跨域的復(fù)雜請(qǐng)求需要 preflight request？

復(fù)雜請(qǐng)求可能對(duì)服務(wù)器數(shù)據(jù)產(chǎn)生副作用。例如delete或者put,都會(huì)對(duì)服務(wù)器數(shù)據(jù)進(jìn)行修改,所以在請(qǐng)求之前都要先詢(xún)問(wèn)服務(wù)器，當(dāng)前網(wǎng)頁(yè)所在域名是否在服務(wù)器的許可名單中，服務(wù)器允許后，瀏覽器才會(huì)發(fā)出正式的請(qǐng)求，否則不發(fā)送正式請(qǐng)求

接口權(quán)限認(rèn)證可能會(huì)遇到的問(wèn)題

權(quán)限認(rèn)證的時(shí)候把認(rèn)證的信息放在接口請(qǐng)求頭上，一定會(huì)用到自定義請(qǐng)求頭，類(lèi)似 token、sign 等等。

1. 在跨域請(qǐng)求的時(shí)候需要處理掉 options 的預(yù)檢請(qǐng)求，不然你會(huì)發(fā)現(xiàn)拿不到請(qǐng)求頭信息
2. 自定義的請(qǐng)求頭需要在后端返回的 Access-Control-Allow-Headers 添加，不然會(huì)報(bào)錯(cuò) header field xxx is not allowed by Access-Control-Allow-Headers in preflight response

參考

HTTP協(xié)議-Options方法

Http option 請(qǐng)求是怎么回事