Node.js接收文件分片数据并进行合并处理

前言：上一篇文章讲了如何进行文件的分片：Vue3使用多线程处理文件分片任务，那么本篇文章主要看一下后端怎么接收前端上传来的分片并进行合并处理。

目录：

• 一、文件结构
• 二、主要依赖
• • [1. `express`](#1. express)
  • [2. `multer`](#2. multer)
  • [3. `fs` (文件系统模块)](#3. fs (文件系统模块))
  • [4. `path`](#4. path)
  • [5. `cors`](#5. cors)
  • [6. `body-parser`](#6. body-parser)
  • 总结：
• 三、示例代码

一、文件结构

1. chunks：文件分片存储；
2. node_modules：依赖；
3. uploads：合并后的文件存储目录；
4. index.js：程序主文件；

二、主要依赖

1. express

const express = require('express');

• 作用 ：express 是一个流行的 Node.js Web 框架，它提供了一组简单的工具和功能，用于构建 Web 服务器和处理 HTTP 请求。它简化了路由、请求和响应的处理，使开发者能够更快速地构建 Web 应用。
• 用法 ：通过 express() 创建应用实例并处理路由、请求、响应等。
• 下载：

npm i express -S

2. multer

const multer = require('multer');
const upload = multer({ dest: 'uploads/' });

• 作用 ：multer 是一个 Node.js 中间件，专门用于处理 multipart/form-data 类型的表单数据，尤其是文件上传。它可以将上传的文件保存到磁盘、内存或自定义位置。
• 用法 ：multer 配置了存储路径 dest: 'uploads/'，表示将上传的文件临时保存在 uploads/ 目录下。通过 upload.single('file') 或 upload.array('files') 可以处理单个文件或多个文件的上传。
• 下载：

npm i multer -S

3. fs (文件系统模块)

const fs = require('fs');

• 作用 ：fs 是 Node.js 内置的文件系统模块，提供了用于文件和目录操作的 API。它允许你读取文件、写入文件、删除文件、列出目录等。
• 用法 ：fs 允许对本地文件系统执行同步和异步操作，常用于文件上传、存储、读取等操作。

4. path

const path = require('path');

• 作用 ：path 是 Node.js 内置模块，提供了一些用于处理文件和目录路径的实用工具函数。它使得路径的操作变得更加简单且跨平台。
• 用法 ：常见的用法包括拼接路径、解析路径、获取文件扩展名等。例如，path.join() 用于安全地拼接路径，path.extname() 获取文件的扩展名。

5. cors

const cors = require('cors');

• 作用 ：cors 是一个中间件，用于处理跨源资源共享（CORS）请求。CORS 是一种机制，允许在不同域之间进行资源共享。cors 中间件允许你设置哪些源（域）可以访问服务器的资源。
• 用法 ：通过 app.use(cors()) 启用跨域请求支持，允许所有域访问该服务器。你也可以通过 cors({origin: 'http://example.com'}) 配置只允许指定的源访问。
• 下载：

npm i cors -S

6. body-parser

const Parser = require("body-parser");

• 作用 ：body-parser 是 Express 中间件的一个旧版库，用于解析请求的 body 部分。它支持将请求体解析为 JSON、URL 编码格式等，并将解析后的数据附加到 req.body 上。
• 用法 ：可以使用 Parser.json() 和 Parser.urlencoded() 来分别解析 JSON 数据和 URL 编码的数据。
  • Parser.json()：用于解析 application/json 类型的请求体，将其解析为 JavaScript 对象。
  • Parser.urlencoded({ extended: true })：用于解析 URL 编码的表单数据，extended 选项为 true 时，支持更复杂的对象和数组解析。
  • Parser.json({limit:'5gb'})：限制请求体的大小为 5GB。
• 下载：

npm i body-parser -S

总结：

• express：用来创建 Web 服务器和路由。
• multer：用来处理文件上传。
• fs：用于操作文件系统（如读取、写入文件）。
• path：提供路径操作的工具，跨平台支持。
• cors：用于处理跨域请求，允许不同域访问资源。
• body-parser ：解析 HTTP 请求体（JSON 或 URL 编码数据），并将其附加到 req.body 中。

三、示例代码

关于如何使用，在 Vue3使用多线程处理文件分片任务 中有介绍到，感兴趣的可以去看看。

const express = require('express');
const multer = require('multer');
const fs = require('fs');
const path = require('path');
const cors = require('cors')
const Parser = require("body-parser");

// 创建 express 应用
const app = express();
const upload = multer({ dest: 'uploads/' });
// parse application/x-www-form-urlencoded
app.use(Parser.json({limit:'5gb'}));
app.use(Parser.urlencoded({limit:'5gb',extended:true}));
// parse application/json
app.use(Parser.json());
app.use(cors())

// 接收分片
app.post("/upload-chunk", upload.single("file"), (req, res) => {
    const { chunkIndex, hash, fileName } = req.body; // 分片索引、哈希值、文件名
    const chunk = req.file; // 上传的分片文件
    const chunkDir = path.join(__dirname, "chunks", fileName); // 存储分片的目录
    if (!fs.existsSync(chunkDir)) fs.mkdirSync(chunkDir, { recursive: true });  //文件夹不存在则进行创建
    // chunkDir 命名时候需要注意，尽量进行标识以防文件名冲突
    const chunkPath = path.join(chunkDir, `${chunkIndex}-${hash}`); // 分片文件名加哈希
    fs.rename(chunk.path, chunkPath, (err) => {
        if (err) {
            console.error("存储分片失败:", err);
            return res.json({code:500, msg: "存储失败，请重新上传" });
        }
        res.json({ code:200, msg: ` ${chunkIndex} 上传成功` });
    });
});
// 合并文件
app.post("/merge-chunks", async (req, res) => {
    const { fileName, totalChunks } = req.body;
    const chunkDir = path.join(__dirname, "chunks", fileName);
    const targetPath = path.join(__dirname, "uploads", fileName); // 最终文件存储路径
    try {
        // 确保目标文件不存在
        if (fs.existsSync(targetPath)) {
            fs.unlinkSync(targetPath);
        }
        const writeStream = fs.createWriteStream(targetPath);
        for (let i = 0; i < totalChunks; i++) {
            const chunkFiles = fs.readdirSync(chunkDir).filter((file) => file.startsWith(`${i}-`));
            if (chunkFiles.length === 0) {
                res.json({code:500, msg: "上传失败，请重新上传" });
                throw new Error(`分片缺失: ${i}`);
            }
            // 读取分片内容
            const chunkPath = path.join(chunkDir, chunkFiles[0]);
            const data = fs.readFileSync(chunkPath);
            writeStream.write(data);
            // 删除已合并分片
            fs.unlinkSync(chunkPath);
        }

        writeStream.end();

        // 删除分片目录
        fs.rmdirSync(chunkDir);
        res.json({ code:200, msg: "文件上传成功", path: '/uploads/' + fileName });
    } catch (err) {
        console.error("合并文件失败:", err);
        res.json({code:500, msg: "文件合并失败" });
    }
});

// 启动服务器
const PORT = 3000;
app.listen(PORT, '0.0.0.0', () => {
    console.log(`Server started on http://localhost:${PORT}`);
})