今天在調(diào)接口的時(shí)候，發(fā)現(xiàn)在axios Post的方式提交formData格式的數(shù)據(jù)的時(shí)候出現(xiàn)了請(qǐng)求變成opition的情況，導(dǎo)致無(wú)法請(qǐng)求成功。這把我給郁悶的啊，因?yàn)槲矣胘Query的$.ajax可以請(qǐng)求成功，沒(méi)有任何問(wèn)題，數(shù)據(jù)成功返回。于是我就去網(wǎng)上搜了一番，最后終于解決了！下面我來(lái)分析一下：

錯(cuò)誤情況

控制臺(tái)請(qǐng)求方式變成了OPITIONS

可是我明明寫(xiě)的是POST啊

這是為啥呢？具體原因可以參考淺談 AJAX 跨域請(qǐng)求時(shí)的 OPTIONS 方法?，我覺(jué)得說(shuō)的很詳細(xì)，下面，我來(lái)說(shuō)下我的解決方法吧?

解決方法

1. 使用 URLSearchParams （會(huì)有兼容問(wèn)題，寫(xiě)起來(lái)比較麻煩）

var data = new URLSearchParams(); data.append('id', '1'); data.append('name', 'minmin'); data.append('age', '23') ...postData(data).then( res => {...} )復(fù)制代碼

這里的postData是我直接寫(xiě)好的方法，如果是沒(méi)有封裝過(guò)的axios 就直接按原始的寫(xiě)法傳參就好啦

axios.post('url, data).then(res => {...} ) 復(fù)制代碼

2.使用qs.stringify

1.安裝

npm install --save axios vue-axios qs安裝不上的用淘寶鏡像，然后cnpm install --save axios vue-axios qs復(fù)制代碼2.axios配置?

我把a(bǔ)xios配置寫(xiě)在src/utils/request.js里面，在我當(dāng)前這個(gè)request.js里引入qs并配置

在上面這兩個(gè)地方按我的寫(xiě)法引入qs，并且在axios.interceptors.request.use請(qǐng)求前判斷如果是post請(qǐng)求就將data qs.stringify

import qs from 'qs' 復(fù)制代碼

axios.interceptors.request.use((config) => {if(config.method === 'post'){config.data = qs.stringify(config.data);}return config; },(error) =>{return Promise.reject(error); }); 復(fù)制代碼

這樣就ok拉，就不用擔(dān)心請(qǐng)求方式那里是opitions了,打開(kāi)控制臺(tái)看一下，太棒了，獎(jiǎng)勵(lì)一朵小發(fā)發(fā)

如果沒(méi)有封裝axios配置，可以引入后，直接

axios.post('url, qs.stringify(data)).then(res => {...} )復(fù)制代碼

遇見(jiàn)的問(wèn)題

是不是覺(jué)得這樣就大功告成了，不不不，因?yàn)槲业恼?qǐng)求是需要發(fā)送一大堆中文給后臺(tái)，發(fā)送成功后，發(fā)現(xiàn)后臺(tái)返回給我的值是一堆亂碼，不對(duì)啊！這不對(duì)啊！看看自己接口穿的參數(shù)明明是中文怎么特么的返回回來(lái)就變成亂碼了，這。。。我又去找了找問(wèn)題，發(fā)現(xiàn)只只要在axios配置那里加一行代碼

axios.defaults.headers.post['Content-Type'] = 'application/x-www-form-urlencoded;charset=UTF-8';復(fù)制代碼

最后再請(qǐng)求接口試試，亂碼不見(jiàn)啦，搞定！

我個(gè)人建議使用qs的這個(gè)方法哈，因?yàn)槭褂闷饋?lái)比較方便， 每次append太麻煩啦～

下次說(shuō)axios配置！哈哈?

總結(jié)

以上是生活随笔為你收集整理的axios中POST请求变成OPTIONS处理的全部?jī)?nèi)容，希望文章能夠幫你解決所遇到的問(wèn)題。

如果覺(jué)得生活随笔網(wǎng)站內(nèi)容還不錯(cuò)，歡迎將生活随笔推薦給好友。