我正在尝试在同一个多部分POST请求中向我的RESTendpoint发送一个文件和一些json。该请求是使用axios库直接从javascript发出的，如下面的方法所示。
doAjaxPost() {
var formData = new FormData();
var file = document.querySelector('#file');
formData.append("file", file.files[0]);
formData.append("document", documentJson);
axios({
method: 'post',
url: 'http://192.168.1.69:8080/api/files',
data: formData,
})
.then(function (response) {
console.log(response);
})
.catch(function (response) {
console.log(response);
});
}
然而，问题是，当我在网络选项卡中检查chrome开发工具中的请求时，我发现＜code＞文档＜/code＞没有＜code＞内容类型＜/code＜字段，而＜code＞文件＜/code〕字段＜code＞属性类型＜/code＞是＜code＞application/pdf＜/code>（我正在发送一个pdf文件）。
在服务器上，文档的内容类型是text/plain；charset=us ascii。
更新：
我设法通过邮递员提出正确的请求，将文档作为 .json 文件发送。虽然我发现这只适用于Linux / Mac。
要设置内容类型，您需要传递一个类似文件的对象。您可以使用Blob创建一个。
const obj = {
hello: "world"
};
const json = JSON.stringify(obj);
const blob = new Blob([json], {
type: 'application/json'
});
const data = new FormData();
data.append("document", blob);
axios({
method: 'post',
url: '/sample',
data: data,
})
试试这个。
doAjaxPost() {
var formData = new FormData();
var file = document.querySelector('#file');
formData.append("file", file.files[0]);
// formData.append("document", documentJson); instead of this, use the line below.
formData.append("document", JSON.stringify(documentJson));
axios({
method: 'post',
url: 'http://192.168.1.69:8080/api/files',
data: formData,
})
.then(function (response) {
console.log(response);
})
.catch(function (response) {
console.log(response);
});
}
您可以在后端解码此字符串化的 JSON。
您只需要将正确的标题添加到您的请求中
axios({
method: 'post',
url: 'http://192.168.1.69:8080/api/files',
data: formData,
header: {
'Accept': 'application/json',
'Content-Type': 'multipart/form-data',
},
})
