今天做跨域登錄功能遇到這個問題(后端已做跨域處理)：
當跨域請求為post時候，請求的method變為了options。
在這里插入圖片描述
其實跨域分為 簡單跨域請求和復雜跨域請求：
簡單跨域請求是不會發送options請求的
復雜跨域請求會發送一個預檢請求options
復雜跨域請求要滿足以下：
1、請求方法不是GET/HEAD/POST
2、POST請求的Content-Type并非application/x-www-form-urlencoded, multipart/form-data, 或text/plain
3、請求設置了自定義的header字段

參考鏈接

axios默認設置的[‘Content-Type’]是application/json，會引發復雜跨域請求，就是所謂的method為options的現象，此階段為預請求 階段，此階段通過后才會發送正式的post請求。
其中引入qs模塊是為了解析瀏覽器把參數當作字符串請求數據，導致請求參數無法傳遞到后臺。
觀察瀏覽器network發現兩種方法最后的效果都是將Content-Type都變成了application/x-www-form-urlencoded
解決方法：

// request攔截器
service.interceptors.request.use(
config => {
------------解決方法--------------------------------------------------
config.headers[‘Content-Type’] = ‘application/x-www-form-urlencoded’
if (config.method === ‘post’) {
config.data = qs.stringify({
…config.data
})
}
--------------------------------------------------------------
if (store.getters.token) { // 設置全局參數uid，keyid
// config.headers[‘X-Token’] = getToken() // 讓每個請求攜帶自定義token 請根據實際情況自行修改

if (config.method === 'post') { // 2019/4/10 by zzqconst data = qs.parse(config.data)config.data = qs.stringify({keyid: 'keyid',uid: 'uid',...data})}if (config.method === 'get') { // 2019/4/10 by zzzqconfig.params = {...config.params,keyid: 'keyid',uid: 'uid'}} } return config

},
error => {
// Do something with request error
console.log(error) // for debug
Promise.reject(error)
}
)
————————————————
版權聲明：本文為CSDN博主「Homer_Simpson」的原創文章，遵循 CC 4.0 BY-SA 版權協議，轉載請附上原文出處鏈接及本聲明。
原文鏈接：https://blog.csdn.net/Homer_Simpson/article/details/89188068

總結

以上是生活随笔為你收集整理的vue axios跨域 Request Method: OPTIONS问题的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。