Skip to content

❤Node12-Node中间件multer

node中间件multer的认识安装和使用

1、multer简介

官网地址
https://www.npmjs.com/package/multer

简介
multer 是一个Node.js中间件,用于处理multipart/form-data类型的数据,主要用于上传文件。它是专门设计来处理文件上传的,非常适合用在像图片上传这样的场景中

需要注意的是:

multer 不会处理任何非 multipart/form-data 类型的表单数据,就是没办法处理base64位的数据

换一句换说:前端必须这样设置类型 'Content-type': 'multipart/form-data'

guthub官方解释链接 https://github.com/expressjs/multer/blob/master/doc/README-zh-cn.md

2、安装

javascript
yarn add --save multer

3、引入multer和路径path

javascript
// 引入文件上传的包 Node.js中间件,用于处理multipart/form-data类型的数据
import multer from 'multer'
import path from 'path'

4、使用

方法和属性

1. multer()** 构造函数**:

plain
-   使用 `multer()` 构造函数来创建一个 `multer` 实例,用于处理文件上传。你可以通过传递配置选项来定制文件上传的行为,比如指定上传文件的存储目录等。

1. 常用配置选项

plain
-   `dest`: 指定上传文件的存储目录。
-   `fileFilter`: 定义一个函数,用于过滤上传的文件。
-   `limits`: 设置上传文件的大小限制等。

1. 主要方法

plain
-   **`single(fieldname)`** : 处理上传的单个文件。`fieldname` 是表单字段的名称,用于指定要处理的文件。
-   **`array(fieldname[, maxCount])`** : 处理上传的多个文件,可选参数 `maxCount` 用于指定最大上传文件数量。
-   **`fields(fields)`** : 处理上传的多个文件,每个文件可能属于不同的表单字段。
-   **`none()`** : 不处理文件上传,用于仅处理表单文本字段。

multer简单应用于上传文件存储的目的地文件夹

javascript
const upload = multer({dest: 'uploads/'}); // 上传

在Node接口之中使用这个multer 实例,创建了 multer 实例后,upload 变量可用于作为中间件在路由中处理文件上传

javascript
app.post('/upload', upload.single('file'), (req, res) => {
    res.send('File uploaded successfully!');
});

5、multer 之中 storage存储引擎的使用

multer 提供了两种存储引擎:

  1. DiskStorage:将上传的文件保存到磁盘上的特定位置。
  2. MemoryStorage:将上传的文件保存在内存中,作为 Buffer 对象。这通常用于临时文件或当你需要对文件进行处理然后再决定是否保存到磁盘上。

使用 DiskStorage

DiskStorage 允许你控制文件的存储路径和文件名。这是通过使用 destinationfilename 函数来实现的,这两个函数都可以根据请求和文件的详细信息动态地定义。

javascript
const multer = require('multer');

// 配置 DiskStorage
const storage = multer.diskStorage({
    destination: function (req, file, cb) {
        // 设置文件存储位置
        cb(null, 'uploads/')
    },
    filename: function (req, file, cb) {
        // 设置文件名
        const uniqueSuffix = Date.now() + '-' + Math.round(Math.random() * 1E9)
        cb(null, file.fieldname + '-' + uniqueSuffix)
    }
});

const upload = multer({ storage: storage });

// 在路由中使用
app.post('/upload', upload.single('file'), (req, res) => {
    res.send('File uploaded successfully!');
});

使用 MemoryStorage

使用 MemoryStorage时,上传的文件不会写入磁盘,而是存储在内存中。对于需要处理文件数据(如解析、转换)然后可能再保存到数据库或其他存储系统的场景非常有用

javascript
const multer = require('multer');

// 配置 MemoryStorage
const storage = multer.memoryStorage();

const upload = multer({ storage: storage });

// 在路由中使用
app.post('/upload', upload.single('file'), (req, res) => {
    // 可以从 req.file.buffer 访问文件数据
    res.send('File uploaded and processed!');
});

选择存储方式(选择哪种存储方式取决于我们实际的应用需求)

适当的存储引擎可以优化应用的性能和资源使用,确保上传的文件按照预期方式处理和存储。

  • 需要永久保存文件,或者对文件的物理位置有特定要求,使用 DiskStorage
  • 需要处理文件数据,然后决定是否保存或如何保存,使用 MemoryStorage

6、使用DiskStorage实现的方案

javascript
// 设置存储引擎
const storage = multer.diskStorage({
    destination: (req, file, cb) => {
        // cb(null, 'uploads/');
        // 获取当前日期
        const date = new Date();
        const year = date.getFullYear();
        const month = (date.getMonth() + 1).toString().padStart(2, '0');
        const day = date.getDate().toString().padStart(2, '0');
        const dateString = `${year}-${month}-${day}`;

        // 设置文件存储路径
        let destination;
        if (file.mimetype.startsWith('image/')) {
            destination = `uploads/${dateString}/img`;
        } else {
            destination = `uploads/${dateString}/file`;
        }
         // 判断目录是否存在,不存在则创建
        fs.access(destination, (error) => {
            console.log('文件存储判断');
            if (error) {
                fs.mkdirSync(destination, { recursive: true });
            }
            cb(null, destination);
        });

        // 创建文件夹
        // fs.mkdirSync(destination, { recursive: true });

        cb(null, destination);
    },
    filename: (req, file, cb) => {
        // 设置文件名为原始文件名
        // cb(null, file.originalname);
        cb(null, file.fieldname + '-' + Date.now() + path.extname(file.originalname));
    }
});

使用

javascript
// 配置Multer
const upload = multer({ 
    storage: storage,
    limits: { fileSize: 10 * 1024 * 1024 },
});

7、(优化)使用multer上传文件时根据文件类型限制传送的文件大小

使用 Multer 的 limits 选项来限制不同类型文件的最大大小。

为图像和视频分别创建不同的上传实例,并在其中设置不同的大小限制实现对图像和视频文件大小的不同管理。

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

const app = express();

// 创建 Multer 实例
const imageUpload = multer({
    limits: {
        fileSize: 10 * 1024 * 1024, // 10MB 限制
    },
});

const videoUpload = multer({
    limits: {
        fileSize: 100 * 1024 * 1024, // 100MB 限制
    },
});

// 图像上传路由
app.post('/upload/image', imageUpload.single('image'), (req, res) => {
    res.send('Image uploaded successfully!');
});

// 视频上传路由
app.post('/upload/video', videoUpload.single('video'), (req, res) => {
    res.send('Video uploaded successfully!');
});

app.listen(3000, () => {
    console.log('Server is running on port 3000');
});

Released under the MIT License.