post请求中的Content-Type

在POST请求中的 Content-Type 常见的有以下3种形式：
application/json 请求体中的数据会以json字符串的形式发送到后端(axios默认)
application/x-www-form-urlencoded 请求体中的数据会以普通表单形式（键值对）发送到后端
multipart/form-data 它会将请求体的数据处理为一条消息，以标签为单元，用分隔符分开。既可以上传键值对，也可以上传文件。

---

后端接受application/x-www-form-urlencoded
方法一：用 URLSearchParams传递参数，代码简单，省事（需要注意的是： URLSearchParams 不支持所有的浏览器，但是总体的支持情况还是 OK 的，所以优先推荐这种简单直接的解决方案）

let param = new URLSearchParams()
param.append('username', 'admin')
param.append('pwd', 'admin')
axios({
    method: 'post',
    url: '/api/lockServer/search',
    data: param
})

---

方法二
配置axios请求头中的content-type为指定类型，将参数转换为query参数, 利用qs（引入 qs ，这个库是 axios 里面包含的，不需要再下载了。）

axios.defaults.headers.post['Content-Type'] = 'application/x-www-form-urlencoded'; 
或者 {headers:{'Content-Type':'application/x-www-form-urlencoded'}}

import Qs from 'qs'
let data = {
    "username": "cc",
    "psd": "123456"
}
axios({
    headers: {
        'Content-Type': 'application/x-www-form-urlencoded'
    },
    method: 'post',
    url: '/api/lockServer/search',
    data: Qs.stringify(data)
})

---

后端接受Content-Type: multipart/form-data
对于这种类型的数据，我们常见前端页面上传个人图像，然后点击保存发送后端修改原始数据。解决办法下：

 let params = new FormData()
        params.append('file', this.file)
        params.append('id', localStorage.getItem('userID'))
        params.append('userName', this.name)
        params.append('sex', this.sex)
        params.append('mobile', this.phone)
        params.append('email', this.email)
        params.append('qq', this.qq)
        params.append('weChat', this.WeChat)

        axios.post(URL, params, {headers: {'Content-Type': 'multipart/form-data'}}).then(res => {
          if (res.data.code === 0) {
            this.$router.go(-1)
          }
        }).catch(error => {
          alert('更新用户数据失败' + error)
        })

---

后端接受Content-Type: application/json
这种是axios默认的请求数据类型，我们只需将参数序列化json字符串进行传递即可，无需多余的配置。