[英]POST request with a JSON object that contains a File
I have a JSON object like so: 我有一个像这样的JSON对象:
const people = {
admin: {
name: 'john',
avatar: {
img: File
}
},
moderator: {
name: 'jake',
avatar: {
img: File
}
}
};
The img
property is just a File
object. img
属性只是一个File
对象。
I want to send this data as a POST
request to my node server. 我想将此数据作为
POST
请求发送到我的节点服务器。
So one approach that seems to work is to create a FormData
object and then manually append each property to it like so: 因此,一种似乎有效的方法是创建一个
FormData
对象,然后手动将每个属性附加到它,如下所示:
client.js client.js
let formData = new FormData();
formData.append('admin-name', people.admin.name);
formData.append('admin-avatar', people.admin.avatar.img);
formData.append('moderator-name', people.moderator.name);
formData.append('moderator-avatar', people.moderator.avatar.img);
fetch('/submit', { method: 'POST', body: formData })
server.js server.js
import formidable from 'express-formidable';
router.use('/submit', formidable());
router.post('/submit', (req, res) => {
console.log(req.files); // This contains the Files objects
console.log(req.fields); // This has the rest of the data
res.end();
});
Server Output 服务器输出
{ 'admin-avatar': File {}, 'moderator-avatar': File {} }
{ 'admin-name': 'john', 'moderator-name': 'jake' }
The main reason I don't like doing it this way is because I have to manually append
every single field. 我不喜欢这样做的主要原因是因为我必须手动
append
每个字段。 I don't think I can do this in a loop because in my data, some of the fields are nested objects. 我不认为我可以在循环中执行此操作,因为在我的数据中,某些字段是嵌套对象。 Also, in my server, the data is no longer grouped together like it was in the original object.
此外,在我的服务器中,数据不再像原始对象中那样组合在一起。
Is there any better way to do this? 有没有更好的方法来做到这一点? Thanks!
谢谢!
I don't think there is any clean/elegant way of dynamically creating a FormData
object. 我不认为有任何干净/优雅的方式动态创建
FormData
对象。 You could solve the repetitiveness by looping over the properties with Object.keys()
: 您可以通过使用
Object.keys()
循环遍历属性来解决重复性:
const people = {
admin: {
name: 'john',
avatar: {
img: {}
}
},
moderator: {
name: 'jake',
avatar: {
img: {}
}
}
}
const formData = new FormData()
Object.keys(people)
.forEach(authority => {
const { name, avatar: img } = people[authority]
formData.append(`${authority}-name`, name)
formData.append(`${authority}-avatar`, img)
})
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.