這種方式存儲會直接保留源文件,不會變成二進制,再取圖片直接用node服務地址即可,如localhost:8080/images/line2.png
node代碼
var express = require('express');//引入express框架
var router = express.Router();//路由
const multer = require('multer');//multer插件
var storage = multer.diskStorage({
destination: function (req, file, cb) {
cb(null, 'public/images/')
//文件保存路徑
},
filename: function (req, file, cb) {
console.log(file.originalname)
cb(null, file.originalname)
//存儲文件名
}
})
var upload = multer({ storage: storage })
router.post('/uploader', upload.single('file'), function (req, res, next) {
//定義接口
res.send('ok')
});
前端代碼
var formdata = new FormData();
formdata.append("file", this.$refs.form.uploadFiles[0].raw);
var requestOptions = {
method: 'POST',
body: formdata,
redirect: 'follow'
};
fetch("http://localhost:3000/uploader?file", requestOptions)
.then(response => response.text())
.then(result => console.log(result))
.catch(error => console.log('error', error));
之前試着用axios發送formdata到後臺,但是試了很多方法都上傳不過去,最後用了fetch傳遞一次就通了,下面貼下之前的axios方法,希望有大佬幫指點指點。
axios({
method: 'post',
url:'http://localhost:3000/uploader',
headers: { "Content-Type": "multipart/form-data" },
data:{
file:qs.stringify(formData)
}
})