vue发送form-data数据格式请求
在vue中调用就项目的已有接口时,发现一直报500的错误,经过network中的请求方式进行了对比,如下图:旧项目的接口请求:我的接口请求:经过对比,发现旧项目中的请求数据格式为form-data格式,而vue中的请求数据格式为json格式,于是,我就在vue的axios请求时进行了配置,将它的请求数据格式改为form-data格式,具体如下:设置headers请求头:...l...
在vue中调用就项目的已有接口时,发现一直报500的错误,经过network
中的请求方式进行了对比,如下图:
旧项目的接口请求:
我的接口请求:
经过对比,发现旧项目中的请求数据格式为form-data
格式,而vue中的请求数据格式为json
格式,于是,我就在vue的axios
请求时进行了配置,将它的请求数据格式改为form-data
格式,具体如下:
设置headers请求头:
...
let headers = {
'Content-Type': 'application/x-www-form-urlencoded; charset=UTF-8'
}
let transformRequest = [
function (data) {
let ret = ''
for (let it in data) {
// 防止数据为 null 时,转换成字符串 'null' 传给后端导致报错
ret += encodeURIComponent(it) + '=' + (data[it] !== null ? encodeURIComponent(data[it]) : '') + '&'
}
ret = ret.substring(0, ret.lastIndexOf('&'))
return ret
}
]
// 数据请求
axios.post(url, sendData, {headers: headers, transformRequest: transformRequest}).then(successCallBack).catch(errorCallBack)
完成上面的配置,即可实现form-data
数据格式的请求;
关于form-data
和json
这两种数据格式请求的区别及优劣势,我从网上总结了下面几点:
1.数据格式不同,form-data
的数据格式为:a=1&b=2&c=3; json
的数据格式为:{“a”: 1, “b”: 2, “c”: 3};
2.请求头不同,form-data
:Content-Type: application/x-www-form-urlencoded
; json
: Content-Type: application/json
3.对于同样的数据信息,使用for-data
数据量会比使用json
的要小一点;
4.对于可读性来说,json
的可读性要好;
5.form-data
传二进制比较方便,如上传文件,而使用json
则不太合适;
更多推荐
所有评论(0)