Multer文件上传

Multer是一个node.js中间件,用于处理multipart/form-date类型的表单数据,主要用于上传文件。

安装

$ npm install --save multer

使用

Multer会添加一个 body 对象以及 file 或 files 对象到 express 的request 对象中。body 对象包含表单的文本域信息, file 或 files 对象包含对象表单上传的文件信息。
基本使用方法:

var express = require('express')
var multer  = require('multer')
var upload = multer({ dest: 'uploads/' })

var app = express()

app.post('/profile', upload.single('avatar'), function (req, res, next) {
  // req.file 是 `avatar` 文件的信息
  // req.body 将具有文本域数据,如果存在的话
})

app.post('/photos/upload', upload.array('photos', 12), function (req, res, next) {
  // req.files 是 `photos` 文件数组的信息
  // req.body 将具有文本域数据,如果存在的话
})

var cpUpload = upload.fields([{ name: 'avatar', maxCount: 1 }, { name: 'gallery', maxCount: 8 }])
app.post('/cool-profile', cpUpload, function (req, res, next) {
  // req.files 是一个对象 (String -> Array) 键是文件名,值是文件数组
  //
  // 例如:
  //  req.files['avatar'][0] -> File
  //  req.files['gallery'] -> Array
  //
  // req.body 将具有文本域数据,如果存在的话
})

如果你需要处理一个只有文本域的表单,你可以使用任何一个multer方法(.single(), .array(), fields()),下面是一个使用 .array() 的例子:

var express = require('express')
var app = express()
var multer  = require('multer')
var upload = multer()

app.post('/profile', upload.array(), function (req, res, next) {
  // req.body 包含文本域
})

图片上传实例

前端使用vue:

methods   : {
      upLoad(e) {
        let file = e.target.files[0];
        // upload image
        let fd = new FormData();
        fd.append('file', file);
        this.$http.post('/api/post/uploadImage', fd}).then(res => {
          this.imgPath = res.data.path;
        });
      }
    }

后端:

const express = require('express');
const app = express();
const multer = require('multer');

app.use(express.static('public'));// 加载静态文件,需要手动创建

const storage = multer.diskStorage({
    destination: (req, res, cb) => {
        cb(null, './public/uploads')
    },
   // 文件重命名
    filename   : (req, file, cb) => {
        cb(null, Date.now() + file.originalname)
    }
});
const upload = multer({storage: storage});
apiRoutes.post('/post/uploadImage', upload.single('file'), (req, res) => {
    let url = '/api/uploads/' + req.file.filename;
    res.json({success: true, path: url});
});

可参考文档 multer。

你可能感兴趣的:(Multer文件上传)