axios POST提交数据的三种请求方式

Axios，基于 Promise 的 HTTP 客户端，可以工作于浏览器中，也可以在 node.js 中使用。

功能：

• 从浏览器中创建 XMLHttpRequest

• 从 node.js 中创建 http 请求

• 支持 Promise API

• 拦截请求和响应

• 转换请求和响应数据

• 取消请求

• 自动转换 JSON 数据

• 客户端支持防止 XSRF 攻击

1、 'Content-Type':'application/json; charset=UTF-8'  , 后端要用@requestbody注解来接收 

        axios.post(url,params,{
            headers:{
                 'Content-Type':'application/json; charset=UTF-8'
            }
        })
   

2、'Content-Type':'application/x-www-form-urlencoded' ，不适合用于传输大型二进制数据或者包含非ASCII字符的数据

会将表单内的数据转换为键值对，比如,name=java&age = 23

axios.post(url,params,{
            transformRequest:[(params)=>{
                let result = ''
                Object.keys(params).forEach((key)=>{
                    if(!Object.is(params[key],undefined)&& !Object.is(params[key],null)){
                        result += encodeURIComponent(key)+'='+encodeURIComponent(params[key])+'&'
                    }
                })
                return result
            }],
            headers:{
                'Content-Type':'application/x-www-form-urlencoded'
            }
        })

 

3、'Content-Type':'multipart/form-data'  ，专门用于有效的传输文件

由于有boundary隔离，所以multipart/form-data既可以上传文件，也可以上传键值对，它采用了键值对的方式，所以可以上传多个文件。

 axios.post(url,params,{
            headers: {
                'Content-Type':'multipart/form-data'
            }
        })

注 ：multipart/form-data与x-www-form-urlencoded区别

               multipart/form-data：既可以上传文件等二进制数据，也可以上传表单键值对，只是最后会转化为一条信息；

               x-www-form-urlencoded：只能上传键值对，并且键值对都是间隔分开的。