正在上传 react/express/multer 文件夹中的文件
Uploading files in forlder with react/express/multer
我正在尝试使用 express 和 multer 上传大文件。
回调请求发送 200,但我真的不知道如何将我的文件上传到特定文件夹中。我尝试了两种方法都没有成功。
第一个:
app.post('/upload', (req, res, next) => {
let myFile = req.files;
let i = 0;
for (i; i < myFile.length; i++) {
let filemName = MyFile[i].name
myFile[i].mv(`${__dirname}/uploads/${fileName}`, function(err) {
if (err) {
return res.status(500).send(err);
}
res.json({file: `uploads/${fileName}`});
});
}
})
此代码return 500.
第二种方式(只试了一个文件):
app.post ('/uploader', (req, res, next) => {
var file = req.files.file;
// file.mv(`${__dirname}/uploads/${file.name}`), function(err) {
// if (err) {
// return res.status(500).send(err);
// }
// }
console.log('file');
console.log(file[0]);
fs.rename(req.file[0], '~/dev/file-upload/backend/uploads' + file[0].name, function (err) {
if (err) throw err;
console.log('Move complete');
})
此代码 return 没有任何错误,但没有将文件放入文件夹中。
最后是我的客户端代码:
handleUploadFile(event) {
event.preventDefault();
const data = new FormData();
let c = this.uploadInput.files.length;
console.log("c = ", c);
console.log("mydata :", this.uploadInput.files);
for (var i = 0; i < c; i++){
data.append('filename', this.uploadInput.files[i].name);
data.append('file', this.uploadInput.files[i]);
}
var options = {
method: 'post',
body: data,
}
fetch(apiBaseUrl + '/uploader', options).then((response) => {
console.log('res', response);
}).catch(function (err) {
console.error("!!! error :", err);
})
}
render() {
return (
<form onSubmit={this.handleUploadFile}>
<div>
<input ref={(ref) => { this.uploadInput = ref; }} type="file" multiple="multiple" />
</div>
<br />
<div>
<button>Upload</button>
</div>
</form>
);
}
预先感谢您的帮助:)
我解决了我的问题。
body-parser 不支持解析 multipart/form-data 请求的主体。
下面的link给了我所有需要的answers。
我正在尝试使用 express 和 multer 上传大文件。
回调请求发送 200,但我真的不知道如何将我的文件上传到特定文件夹中。我尝试了两种方法都没有成功。
第一个:
app.post('/upload', (req, res, next) => {
let myFile = req.files;
let i = 0;
for (i; i < myFile.length; i++) {
let filemName = MyFile[i].name
myFile[i].mv(`${__dirname}/uploads/${fileName}`, function(err) {
if (err) {
return res.status(500).send(err);
}
res.json({file: `uploads/${fileName}`});
});
}
})
此代码return 500.
第二种方式(只试了一个文件):
app.post ('/uploader', (req, res, next) => {
var file = req.files.file;
// file.mv(`${__dirname}/uploads/${file.name}`), function(err) {
// if (err) {
// return res.status(500).send(err);
// }
// }
console.log('file');
console.log(file[0]);
fs.rename(req.file[0], '~/dev/file-upload/backend/uploads' + file[0].name, function (err) {
if (err) throw err;
console.log('Move complete');
})
此代码 return 没有任何错误,但没有将文件放入文件夹中。 最后是我的客户端代码:
handleUploadFile(event) {
event.preventDefault();
const data = new FormData();
let c = this.uploadInput.files.length;
console.log("c = ", c);
console.log("mydata :", this.uploadInput.files);
for (var i = 0; i < c; i++){
data.append('filename', this.uploadInput.files[i].name);
data.append('file', this.uploadInput.files[i]);
}
var options = {
method: 'post',
body: data,
}
fetch(apiBaseUrl + '/uploader', options).then((response) => {
console.log('res', response);
}).catch(function (err) {
console.error("!!! error :", err);
})
}
render() {
return (
<form onSubmit={this.handleUploadFile}>
<div>
<input ref={(ref) => { this.uploadInput = ref; }} type="file" multiple="multiple" />
</div>
<br />
<div>
<button>Upload</button>
</div>
</form>
);
}
预先感谢您的帮助:)
我解决了我的问题。
body-parser 不支持解析 multipart/form-data 请求的主体。
下面的link给了我所有需要的answers。