最近用vue做項目使用axios發送post請求時遇到了前端傳數據后端接收不到的情況:
image.png
后來仔細對比ajax發現axios傳值是這樣的:
image.png
而ajax傳值是這樣的:
image.png
一個Request Payload,一個Form Data。
將Request Payload 轉為Form Data格式就可以了,有三種方式:
一、使用qs(推薦)
首先在你的項目里安裝qs模塊:
npm install qs --save-dev
然后在需要使用的頁面引入一下:
import qs from 'qs'
引入好了之后,把上面的postData用qs轉一下再發送給后臺就可以了:
let postData = qs.stringify({
certificationAccount: that.certificationAccount,
balance: that.balance
})
這樣發送給后臺時就是Format Data格式了。
二、使用URLSearchParams
let postData= new URLSearchParams()
postData.append('certificationAccount', that.certificationAccount)
postData.append('balance', that.balance)
這樣也可以,個人覺得寫起來麻煩。
三、直接使用字符串
let postData ='certificationAccount =' + that.certificationAccount + '&balance=' + that.balance
es6寫法:
let postData = `
certificationAccount = ${that.certificationAccount}&balance=${that.balance}
`
三種方法的原理是一樣一樣的,都是轉化為字符串,但第三種方法當所傳的值為null時會被轉化為空字符串,個人推薦的是第一種方法。