前端使用vue FormData传递数据数据,后台接收时获取不到参数。
解决方法:使用JSON提交方式: Content-Type:application/json
(1)后台PUT请求接口,使用注解RequestBody接收json数据:
@PutMapping(value = "/shareflight/{id}")
public Object updateById(@Validated @RequestBody ShareFlightAO shareFlight, @PathVariable("id") String id) {
if (StringUtils.isEmpty(id)) {
return ServiceResultHelper.genResultWithFaild("主键为空", -1);
}
UserAO user = (UserAO) SecurityUtils.getSubject().getPrincipal();
shareFlight.setId(id);
shareFlight.setUpdater(user.getId());
shareFlight.setUpdateTime(DateTimeUtil.formatDateTime(new Date()));
return shareFlightService.saveOrUpdate(shareFlight);
}
(2)前端service在请求头中声明使用json提交数据到后台:
//更新数据状态
function updateById(data) {
return xAxios({
url: '/datastatistics/api/dataservice/shareflight/' + data.get("id"),
method: 'PUT',
headers:{
'Content-Type':'application/json'
},
data: data
});
}
此时data还是FormData类型。
将FormData格式的数据转为json,发送请求到后台:
//formdata转为json
function formData2Json(formData) {
var jsonData = {};
for (var entry of formData.entries()) {
jsonData[entry[0]] = entry[1];
}
return JSON.stringify(jsonData);
}
//封装请求
function xAxios(options) {
let opts = {...options};
opts.method = opts.method || 'GET';
opts.data = (opts.method == 'GET' || opts.method == 'DELETE') ? null : ((opts.headers && opts.headers['Content-Type']) ? formData2Json(opts.data) : opts.data);
opts.headers = opts.headers || {}
opts.headers['Content-Type'] = (opts.method == 'GET' || opts.method == 'DELETE') ? null : ((opts.headers && opts.headers['Content-Type']) ||
'application/x-www-form-urlencoded');
let sessionId = localStorage.getItem('sessionId')
if (sessionId) {
if (!opts.url.match(/upload/g)) {
opts.headers['sid'] = sessionId
} else {
let token = localStorage.getItem('token')
opts.url = `${opts.url}?token=${sessionId}`
}
}
return new Promise((resolve, reject) => {
axios(opts)
.then(respone => {})
})