axios發送POST時請求兩次，第一次為OPTIONS

出現問題：

發送POST請求時瀏覽器產生兩次請求，第一次為OPTIONS，第二次是真正的POST請求，后台接收不到參數。

 

 

 

 

 

 

 

 

 

 

 

查找原因：

非GET請求，會先發送OPTIONS進行預檢（預檢請求每次運行只發生一次）致使后台接收不到參數值，不停返回參數錯誤。

於是找到了原因：

 

查找解決方案：

CORS文檔：https://developer.mozilla.org/zh-CN/docs/Web/HTTP/Access_control_CORS

解決方案：（可行）

改為簡單請求（使用form格式提交數據）

//用戶注冊
var url ="/api/OfferReward/User/ValidateCode";
var instance = axios.create({ headers: 
  {'content-type': 'application/x-www-form-urlencoded;charset=UTF-8'}  
});
instance.post(url,qs.stringify(tel)).then(res => {
   if(res.status === 200){
      if (res.data.status === 0) {
          console.log(res.data.msg);
    　　} else {
          console.log(res.data.msg);
        　　return false;
         }
     }
 })

 

 不可行的一種測試：

前端接收后台對OPTIONS請求的響應，忽略過濾它。也不能修改OPTIONS的status值，如果不為200則預檢請求不通過，后續所有POST接口都無法請求成功。

從返回值攔截不成功，那就只能從根源上解決，使用簡單請求避免出現OPTIONS，用表單格式提交。據查，簡單請求還有一定的限制，暫時沒有遇到。