form送出背景注解拿不到資料_axios的post請求，背景拿不到參數

一、axios的post請求方式

• 第一種

axios.post( url, {

data1: data1,

data2: data2

}

• 第二種

axios({

method: 'post’,

url: url,

data: {

data1: data1

data2: data2

}

})

具體文檔參考Axios中文說明

二、導緻原因

具體原因可以在請求是列印axios的request config，我們可以看到headers裡面的“Content-Type”，裡面顯示的是application/json，如果是以這種方式傳值，背景的springMVC的@RequestParam接收不到參數；網上有一些方法說在axios的配置中直接改為：axios.defaults.headers.post['Content-Type'] = 'application/x-www-form-urlencoded'; 然而我試過并沒有用。

三、解決辦法

1、背景的接收參數的注解@RequestParam改為@RequestBody

2、前端轉換參數，具體步驟如下：

npm install qs --save-dev

axios.post(url, qs.stringify({

data1: data1,

data2: data2

})

其實qs.stringify()的目的是将鍵值對(key/value)的方式轉為了&連接配接，既: data1=data1&data2=data2，有興趣的可以列印axios的config，就可以看到request data裡面的值了。

四、application/json 和 application/x-www-form-urlencoded的差別

具體釋義請參照這裡