Javascript 如何在文件上载中附加FormData?
我正在开发一个JS/Node.JS/React/MongoDB应用程序,允许用户上传文件。通过输入(type='file')选择文件后,该文件将添加到服务器上的上载文件夹中,该文件夹工作正常。但是,我还需要随文件发送一个“jobId”,以便将其保存到MongoDB数据库中的关联“job” 简言之,我曾尝试使用“jobId”属性附加该文件,以便在服务器上使用它,但当我在发布文件后对其进行console.log时,该属性不存在。有什么问题的线索吗?提前感谢:) 处理上载事件的函数:Javascript 如何在文件上载中附加FormData?,javascript,node.js,reactjs,file-upload,form-data,Javascript,Node.js,Reactjs,File Upload,Form Data,我正在开发一个JS/Node.JS/React/MongoDB应用程序,允许用户上传文件。通过输入(type='file')选择文件后,该文件将添加到服务器上的上载文件夹中,该文件夹工作正常。但是,我还需要随文件发送一个“jobId”,以便将其保存到MongoDB数据库中的关联“job” 简言之,我曾尝试使用“jobId”属性附加该文件,以便在服务器上使用它,但当我在发布文件后对其进行console.log时,该属性不存在。有什么问题的线索吗?提前感谢:) 处理上载事件的函数: cons
const handleFileUpload = (e) => {
let selected = e.target.files[0]
var file = new FormData()
file.append('file', selected)
file.append('jobId', '1234')
props.onFileUpload(file)
}
处理向服务器投递的父级:
const uploadFile = (file) => {
fetch('http://localhost:8080/upload', {
method: 'POST',
header: {
'Content-Type': 'multi-part/form-data'
},
body: file
})
}
return (
<DetailsList job = {job} tasks = {tasks} onNewTask = {addTask} onFileUpload = {uploadFile} />
)
}
我从来没有使用过令人敬畏的,但看起来您试图从文件中读取jobId,而不是从父表单数据中读取。
function uploadFile(req, callback) {
new formidable.IncomingForm().parse(req)
.on('fileBegin', (name, file) => {
file.originalFileName = file.name
uniqueFilename = `${uuid.v4()}.${file.name.split('.').pop()}`
file.name = uniqueFilename
file.path = __basedir + '/uploads/' + file.name
console.log(file)
})
.on('file', (name, file) => {
callback(file.name, file.originalFileName)
})
}
app.post('/upload', (req, res) => {
uploadFile(req, (fileURL, originalFileName) => {
res.send('UPLOAD')
})
})