vue element-ui express multer上传文件到服务器

第一步是安装好multer库并且引入

第二部app.js中设置传上来文件的存储路径以及文件名


var storage = multer.diskStorage({
destination: function(req, file, cb) {
cb(null, uploadFolder) // 保存的路径，备注：需要自己创建
},
filename: function(req, file, cb) {
const fileFormat = (file.originalname).split(’.’) // 取后缀
cb(null, file.originalname)
} })
var upload = multer({ storage: storage })
第三部前端编写

const formData = new FormData()
const file = this.$refs.upload.uploadFiles[0] const headerConfig = { headers: { 'Content-Type': 'multipart/form-data' }} if (!file) { // 若未选择文件 alert('请选择文件') return } formData.append('file', file.raw) this.$refs.upload.uploadFiles[0]constheaderConfig=headers:′Content−Type′:′multipart/form−data′if(!file)//若未选择文件alert(′请选择文件′)returnformData.append(′file′,file.raw)this.axios.post(’/upload’, formData, headerConfig).then(res => {
this.url=’./’+res.data

这里用的前端表格是vue element-ui写的提交数据用的是jquery中axios，用的时候记得先配置