npm系列:formidable ---- formidable使用方法及使用Express框架和formidable模块处理文件上传的简单示例

wsad0532

已于 2024-10-30 10:36:33 修改

阅读量1.5k

点赞数 26

分类专栏： npm包学习笔记文章标签： npm express 前端 formidable

于 2024-10-30 10:23:04 首次发布

本文链接：https://blog.csdn.net/wsad0532/article/details/143358060

版权

npm包学习笔记专栏收录该内容

19 篇文章

订阅专栏

Node.js模块formidable是一个功能强大的工具，它专为解析表单数据尤其是文件上传而设计。以下是对formidable模块的详细介绍：

一、概述

formidable是一个开源的Node.js模块，由@felixge为Transloadit开发。它支持快速且流式的multipart解析，自动将文件上传写入磁盘，并提供丰富的插件API，允许自定义解析器和插件。formidable经过大量实际应用的考验，被认为是生产就绪的，并在多个生产环境中稳定运行多年。

二、核心优势

高性能：formidable的解析速度极快，每秒可处理900-2500 mb的数据，远超同类模块。
流式处理：支持流式解析，有效减少内存占用，提高处理效率。
自动写入磁盘：自动将上传的文件写入磁盘，简化开发流程。
插件支持：提供插件API，允许开发者自定义解析器和插件，增强模块的灵活性和可扩展性。
错误处理：优雅的错误处理机制，确保应用的稳定运行。
测试覆盖：极高的测试覆盖率，确保代码质量和稳定性。

三、使用方法

安装：

可以通过npm安装formidable模块：
```
bash复制代码

npm install formidable
```

创建解析对象：

使用formidable.IncomingForm()创建一个解析对象。在创建对象时，可以传入一个选项对象来配置解析器的行为。

const formidable = require('formidable');  
const form = new formidable.IncomingForm({  
    encoding: 'utf-8', // 设置表单域的编码  
    uploadDir: '/path/to/upload', // 设置上传文件存放的文件夹  
    keepExtensions: true, // 设置该属性为true可以使得上传的文件保持原来的文件的扩展名  
    maxFieldsSize: 2 * 1024 * 1024, // 限制所有存储表单字段域的大小（除去file字段），默认为2M  
    maxFields: 1000 // 设置可以转换多少查询字符串，默认为1000  
});

解析表单：

使用form.parse(request, callback)方法来解析表单数据。request表示请求信息，callback是一个回调函数，接收解析完成之后的信息。回调函数有三个参数：err（请求出错信息）、fields（普通请求参数）、files（上传文件请求参数）。
```
form.parse(request, (err, fields, files) => {  
    if (err) {  
        // 处理错误  
        return;  
    }  
    // 处理字段和文件  
    console.log('Fields:', fields);  
    console.log('Files:', files);  
});
```

监听事件：

formidable模块还支持监听一系列事件来跟踪解析过程。例如，可以监听progress事件来更新进度条，监听field事件来接收字段/值对，监听fileBegin事件来检测新文件的开始上传等。

form.on('progress', (bytesReceived, bytesExpected) => {  
    console.log(`Received ${bytesReceived}/${bytesExpected} bytes`);  
});  
 
form.on('field', (name, value) => {  
    console.log(`Field ${name}: ${value}`);  
});  
 
form.on('fileBegin', (name, file) => {  
    console.log(`File ${name} began uploading`);  
});  
 
form.on('file', (name, file) => {  
    console.log(`File ${name} uploaded to ${file.path}`);  
});  
 
form.on('error', (err) => {  
    console.error('Error during form parsing:', err);  
});  
 
form.on('aborted', () => {  
    console.log('Request aborted');  
});  
 
form.on('end', () => {  
    console.log('Request successfully parsed');  
});

四、应用场景

formidable适用于各种需要处理文件上传和表单数据的场景。无论是使用Node.js内置的http模块，还是与Express.js、Koa等框架结合，formidable都能提供稳定可靠的解析服务。它特别适合那些需要高效处理大量文件上传的应用，如图像和视频处理服务。

综上所述，formidable是一个功能强大、性能卓越的Node.js模块，它提供了高效、灵活且可靠的表单数据解析服务。无论您是Node.js初学者还是经验丰富的开发者，formidable都能为您的项目提供稳定的支持。

五、使用Express框架和formidable模块处理文件上传的简单示例

以下是一个使用Express框架和formidable模块处理文件上传的简单示例。

首先，确保你已经安装了Express和formidable模块：

bash复制代码

npm install express formidable

然后，创建一个名为app.js的文件，并添加以下代码：

const express = require('express');  
const formidable = require('formidable');  
const path = require('path');  
const fs = require('fs');  
  
const app = express();  
const PORT = 3000;  
  
// 设置一个用于保存上传文件的目录  
const uploadDir = path.join(__dirname, 'uploads');  
if (!fs.existsSync(uploadDir)){  
    fs.mkdirSync(uploadDir);  
}  

app.get("/", (req, res) => {
  res.sendFile(__dirname + "/01.html");
});  
  
app.post('/upload', (req, res) => {  
    // 创建一个新的formidable表单解析实例  
    const form = new formidable.IncomingForm({  
        uploadDir: uploadDir, // 设置文件上传的目录  
        keepExtensions: true, // 保留文件的扩展名  
        onFileBegin: (name, file) => {  
            // 可以在这里重命名文件，或者做其他处理  
            // 例如：file.path = path.join(uploadDir, `${Date.now()}_${file.name}`);  
        }  
    });  
  
    // 解析表单数据  
    form.parse(req, (err, fields, files) => {  
        if (err) {  
            // 处理错误  
            return res.status(500).send('Error uploading file.');  
        }  
  
        // 访问上传的文件和表单字段  
        const file = files.file; // 假设表单中有一个名为"file"的文件输入字段  
        const fileName = file.name;  
        const filePath = file.path;  
  
        // 你可以在这里对文件进行进一步处理，比如移动到其他目录或存储到数据库  
  
        // 返回响应  
        res.send(`File ${fileName} uploaded successfully.`);  
    });  
});  
  
// 启动服务器  
app.listen(PORT, () => {  
    console.log(`Server is running on http://localhost:${PORT}`);  
});

这里有一个简单的HTML表单示例:01.html，你可以用它来测试你的上传功能：

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>File Upload</title>
</head>

<body>
    <form action="/upload" method="post" enctype="multipart/form-data">
        文件上传: <input type="file" name="file" required>
        <button type="submit">Upload</button>
    </form>
</body>

</html>

在这个例子中，我们创建了一个简单的Express服务器，并在/upload路径上设置了一个POST路由。这个路由使用formidable来解析表单数据，特别是文件上传。

请注意以下几点：

我们设置了uploadDir来指定文件应该上传到的目录。如果目录不存在，我们会使用fs.mkdirSync创建它。
在form.parse回调中，我们检查是否有错误发生。如果有，我们返回一个500状态码和错误消息。
如果文件上传成功，我们可以通过files对象访问上传的文件。在这个例子中，我们假设表单中有一个名为file的文件输入字段。
你可以通过file.name获取文件的原始名称，通过file.path获取文件在服务器上的路径。
在onFileBegin钩子中，你可以对文件进行重命名或其他预处理。在这个例子中，我们注释掉了重命名的代码，但你可以根据需要取消注释并进行修改。

现在，你可以启动服务器：

bash复制代码

node app.js

然后，浏览器访问http://localhost:3000，点击上传文件，通过http://localhost:3000/upload发送POST请求来上传文件，点击 Upload按钮确认上传。确保你的表单包含一个名为file的文件输入字段，并且enctype属性设置为multipart/form-data`。