作为全栈工程师，文件上传是前端开发中必须掌握的技能之一。而 Multer 是 Express.js 中常用的文件上传中间件之一，可适用于处理单个文件和多个文件上传。本文将详细介绍如何在 Express.js 应用程序中使用 Multer 实现文件上传。
一、安装 Multer
在开始使用 Multer 之前，需要使用 npm 命令安装 Multer:
npm install multer
安装完成后，在代码中引入 Multer。
const multer = require('multer');二、配置 Multer
在使用 Multer 之前，需要对 Multer 进行配置。可以使用 Multer 构造函数创建一个 Multer 实例，并进行相应的设置。
-- -------------------- ---- -------
----- ------- - --------------------
------------ -------- ----- ----- --- -
-------- ------------
--
--------- -------- ----- ----- --- -
----- ------------ - ---------- - --- - ------------------------ - ----
-------- -------------- - --- - ------------ - ---------------------------------
-
---
----- ------ - ---------------- ----------这里使用了 diskStorage 的存储引擎将上传的文件保存在磁盘上，并设置了文件的存储路径和文件名等信息。其中，destination 参数指定了保存文件的目录，filename 参数指定了保存到磁盘中的文件名。具体的实现代码可以根据自己的需求进行修改。通过使用 multer 方法创建了一个 Multer 实例 upload，并将其配置为使用存储引擎 diskStorage。
三、设置文件上传路由
在 Multer 配置完成之后，需要将其绑定到上传文件路由中，这样才能实现文件上传功能。在 Express.js 中可以通过以下方式来设置上传文件路由。
app.post('/upload', upload.single('avatar'), function (req, res, next) {
//处理上传文件的逻辑
});上述代码中的 /upload 是文件上传的路由，通过使用 upload.single('avatar') 方法来声明当前路由只接受名为 avatar 的文件。upload.single 方法指定了 Express.js 在处理请求时要使用的 upload 实例。通过使用这种方式，Multer 将会通过上传的文件自动解析出文件名、文件路径、文件大小等信息，并存储到 req.file 对象中，将文件的其他数据部分存储在 req.body 中。
四、前端页面上传文件
处理上传文件的服务器端配置完成之后，需要编写上传文件的前端页面，一般使用表单的方式进行文件上传。
-- -------------------- ---- -------
--------- -----
------
------
----- ----------------
----------------- ------------
-------
------
----- ------------- ----------------------------- -----------------
------ ----------- ---------------
------ ------------- --------------
-------
-------
-------在 form 标签中设置了 method='post' 属性，还设置了 enctype='multipart/form-data' 属性，这样可以支持文件上传功能。其中，name='avatar' 表明上传的文件被命名为 avatar，这个名字会在 Node.js 代码中被使用。
五、文件上传成功后的处理
在文件上传成功后，可以根据需要对上传的文件进行额外的处理。这里根据需求进行数据库存储、图片处理、文本提取等操作。
-- -------------------- ---- -------
------------------- ------------------------ -------- ----- ---- ----- -
----- ---------- - ------------------ -- -----
-- ----------
--------------
----------- ----------
-- -------- ------- ---- -
-- ------- -
------ ------------
-
-------------------
---
---六、完整代码
下面是使用 Multer 实现文件上传的完整代码示例：
-- -------------------- ---- -------
----- ------- - -------------------
----- ------ - ------------------
----- ---- - ----------------
----- ----- - --------------------------
----- --- - ----------
-- -- ------
----- ------- - --------------------
------------ -------- ----- ----- --- -
-------- ------------
--
--------- -------- ----- ----- --- -
----- ------------ - ---------- - --- - ------------------------ - ----
-------- -------------- - --- - ------------ - ---------------------------------
-
---
----- ------ - ---------------- ----------
-- --------
------------------- ------------------------ -------- ----- ---- ----- -
----- ---------- - ------------------ -- -----
-- ----------
--------------
----------- ----------
-- -------- ------- ---- -
-- ------- -
------ ------------
-
-------------------
---
---
---------------- -------- -- -
-------------------- --- --------- -- ---- --------
---七、总结
本文详细介绍了如何使用 Multer 在 Express.js 应用程序中实现文件上传，从安装 Multer 到配置 Multer，再到设置上传文件路由和前端页面上传文件，并对上传成功后的文件进行处理。希望这篇文章能够对大家有所帮助。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/64fc2918f6b2d6eab320dc9a