可以通过以下步骤实现:
npm install multer
然后在ExpressJs的代码中引入multer:
const multer = require('multer');
const storage = multer.diskStorage({
destination: function (req, file, cb) {
cb(null, 'uploads/'); // 指定文件上传的目标路径
},
filename: function (req, file, cb) {
cb(null, file.originalname); // 指定文件上传后的文件名
}
});
const upload = multer({ storage: storage });
app.post('/upload', upload.single('file'), function (req, res, next) {
// 文件上传成功后的处理逻辑
});
其中,upload.single('file')
表示只处理名为file
的文件上传。
fetch
或axios
等库发送POST请求,将文件上传到ExpressJs服务器。可以使用以下代码实现文件上传:const fileInput = document.querySelector('input[type="file"]');
const formData = new FormData();
formData.append('file', fileInput.files[0]);
fetch('/upload', {
method: 'POST',
body: formData
})
.then(response => response.json())
.then(data => {
// 文件上传成功后的处理逻辑
})
.catch(error => {
// 文件上传失败后的处理逻辑
});
其中,/upload
是ExpressJs服务器的文件上传路由。
总结:
通过以上步骤,可以实现从ExpressJs向React发送文件的功能。在ExpressJs中使用multer中间件处理文件上传,然后在React中使用fetch
或axios
等库发送POST请求将文件上传到ExpressJs服务器。
领取专属 10元无门槛券
手把手带您无忧上云