前端post请求Content-Type和后端对应的接收参数方式

今天遇到一个奇葩问题，废了大半天，原来是没有理解前端发送http请求传参方式，不同的content-type会进行不同传参，后台也要用不同的方式接受，在此记录一下；
我们的程序使用的是前后端分离，前端使用vue，所有的请求都做的拦截的设置：

// request拦截器设置
service.interceptors.request.use(
  config => {
    switch (config.urlType) {
      case 'autoService':
        config.url = autoBaseURL + config.url
        break
      default:
        config.url = appBaseURL + config.url
    }
    // console.log("改头",config.url);
    const token = getToken()
    if (token) {
      config.headers['Authorization'] = token // 请求头设置自带 token
    }
    config.headers['Content-Type'] = 'application/json' // 请求的数据格式为 json
    return config
  },
  error => {
    console.log(error)
    Promise.reject(error)
  }
)

可以看到请求头的Content-Type被设置了application/json格式，但是后台有一个接口是使用@RequestParam注解接受，这样就提示请求错误：400 bad request；查了一下，原来application/json格式是把参数放入请求body中的，后台如果想接受，要使用@RequestBody才行，但是我又不能修改别人的接口，所以在前端中，我可以使用formdata方式进行传参：

	searchData() {
        let params = new FormData();
        params.append('inputMac', this.inputMac);
        getcode(params).then(res => {
          this.result=res
        })
    }

这样就OK了；

总结Content-Type和后端对应的接收参数方式

Content-Type常用到的值：

• application/x-www-form-urlencoded 默认值；
• application/json ： JSON数据格式；
• multipart/form-data；
• application/octet-stream ： 二进制流数据（如常见的文件下载）

当然还有很多可选的值，这里就不一一列出了；

post请求

1、当使用form-data、x-www-form-urlencoded时：后台不可以用@RequestBody；可以用@RequestParam。可以理解成参数都在请求param中，而不在请求体；
2、当使用application/json时：后台json字符串部分可以用@RequestBody；url中拼接的参数可以用@RequestParam

从注解的维度考虑：

• (@RequestBody Map map)，(@RequestBody Object object)；
  application/json时候可用，form-data、x-www-form-urlencoded时候不可用

• (@RequestParam Map map)；
  application/json时候，json字符串部分不可用，url中的?后面添加参数即可用，form-data、x-www-form-urlencoded时候可用，但是要将Headers里的Content-Type删掉

• (@RequestParam String waterEleId,@RequestParam String enterpriseName)；
  application/json时候，json字符串部分不可用，url中的?后面添加参数即可用
  form-data、x-www-form-urlencoded时候可用，且参数可以没有顺序（即前端传过来的参数或者url中的参数顺序不必和后台接口中的参数顺序一致，只要字段名相同就可以），但是要将Headers里的Content-Type删掉

• (@RequestParam Object object)；
  不管application/json、form-data、x-www-form-urlencoded都不可用

• 既不是@RequestBody也不是@RequestParam，没有指定参数哪种接收方式： (Map map)，(Object object)；
  application/json时候：json字符串部分不可用，url中的?后面添加参数不可用。
  因为没有指定，它也不知道到底是用json字符串部分还是?后面添加参数部分，所以干脆都不可以用
  form-data、x-www-form-urlencoded时都不可用

• (HttpServletRequest request)
  application/json不可用
  form-data、x-www-form-urlencoded时可用

get请求

只能使用@RequestParam注解接受参数
从注解维度考虑：

• RequestBody – Map / Object
  GET请求中不可以使用@RequestBody
• (@RequestParam Map map)
  在url中的?后面添加参数即可使用
• (@RequestParam String waterEleId,@RequestParam String enterpriseName)
  在url中的?后面添加参数即可使用
  (@RequestParam Object object)
  GET请求中不可以使用

参考来源 https://blog.csdn.net/weixin_38004638/article/details/99655322