axios针对后台只收form表单形式的post提交

现在普遍的前后端分离开发，用的都是这种

Content-Type 为 application/json

然而对于一些

以前的java服务器，为求代码简单，规定传输的字符串数据格式为 application/x-www-form-urlencoded，
所以 form 表单提交和 $.ajax 都是默认 application/x-www-form-urlencoded

请求长这个样子

curl 'http://192.168.11.88:8080/r_server_manager/api/open/user/vo' 
-H 'Connection: keep-alive' -H 'Pragma: no-cache' 
-H 'Cache-Control: no-cache' 
-H 'Accept: application/json, text/plain, */*' 
-H 'User-Agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_14_5) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/80.0.3987.163 Safari/537.36' 
-H 'Content-Type: application/x-www-form-urlencoded;charset=UTF-8' 
-H 'Origin: http://192.168.31.2:6256' 
-H 'Referer: http://192.168.31.2:6256/phone/user/safeCenter' -H 'Accept-Language: zh-CN,zh;q=0.9' 
--data 'appId=6N8X60DR&appKey=3a8ecd6686e951d6f5b3a227afc4fd6d4b42a693&openId=isq8Vm0zyu%2BpFTfX0%2BDdowQRKXhiW5k3NA8mgHvUdpvoFO5rd08rxddjgVptoCvduo8TfXAWtseOUtPjCWw4pA%3D%3D&accessToken=&userId=&lang=cn' --compressed --insecure

而后续 java出现各种框架，如spring，可以解决多种传参方式，如 application/json
后续的第二代/三代 ajax，如搭配vue的axios，都将默认的Content-Type修改为 application/json

请求长这个样子，自己注意其中的区别

curl 'http://192.168.11.88:8080/r_server_manager/api/open/user/vo' 
-H 'Proxy-Connection: keep-alive' 
-H 'Pragma: no-cache' 
-H 'Cache-Control: no-cache' 
-H 'Accept: application/json, text/plain, */*' 
-H 'User-Agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_14_5) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/80.0.3987.163 Safari/537.36' 
-H 'Content-Type: text/plain;charset=UTF-8' -H 'Origin: http://192.168.31.2:6256' -H 'Referer: http://192.168.31.2:6256/phone/user/safeCenter' 
-H 'Accept-Language: zh-CN,zh;q=0.9' --data-binary '{"appId":"6N8X60DR","appKey":"3a8ecd6686e951d6f5b3a227afc4fd6d4b42a693","openId":"ZdcCrk5li3ElYl8RXA+nn2LNGriAb+1L4yBHdavj/fr/0NZKO1LPxrqf62dFnSreRyjZtrJuVWlKWAXoMFX7Kg==","accessToken":"","userId":"195","lang":"cn"}' --compressed --insecure

现在我的需求就是遇见调取老项目的接口了。。还能咋办。自己改呗

service.interceptors.request.use(
  config => {
    config.headers['Content-Type'] =
      'application/x-www-form-urlencoded;charset=UTF-8';
    if (config.method === 'post') {
      let data = [];
      for (let [index, item] of Object.entries(config.data)) {
        data.push(`${index}=${item}`);
      }
      config.data = data.join('&');
    }
    return config;
  },
  err => Promise.reject(err)
);

结束

axios针对后台只收form表单形式的post提交

推荐阅读