在 Web 应用中，文件上传功能是很常见的需求，例如用户上传头像、文章配图等。Node.js 提供了丰富的模块和工具，可以轻松地实现文件上传功能。
1. 前置知识
在学习 Node.js 实现文件上传功能之前，需要掌握以下知识：
- Node.js 的基础知识，包括模块、事件、回调函数等。
- HTTP 协议的基础知识，包括请求、响应、状态码等。
- FormData 对象的使用，它可以帮助我们将表单数据和文件一起提交到服务器。
2. 实现步骤
实现文件上传功能的步骤如下：
2.1 创建表单
首先，需要在前端创建一个表单，用于选择文件并提交到服务器。可以使用 HTML5 新增的 input 标签的 type 属性为 file，例如：
----- ---------------- ------------- ------------------------------ ------ ----------- -------------- ------- ------------------------- -------
需要注意的是，表单的 enctype 属性必须设置为 multipart/form-data，否则文件将无法上传。
2.2 接收文件
当用户选择文件并提交表单后，服务器需要接收文件并保存到磁盘中。可以使用 Node.js 内置的 http 模块来创建服务器，并使用 formidable 模块来处理文件上传。
----- ---- - ----------------
----- ---------- - ----------------------
----- -- - --------------
----------------------- ---- -- -
-- -------- --- --------- -- ------------------------ --- ------- -
----- ---- - ------------ ---------- ---- ---
--------------- ----- ------- ------ -- -
-- ----- -
-------------------
-------------- - ----
------------------
-------
-
----- - ------ - - ------
----- ------- - ------------
----- ------- - --------------------------------------
------------------ -------- ----- -- -
-- ----- -
-------------------
-------------- - ----
------------------
-------
-
-------------- - ----
------------------
---
---
-------
-
-- ----
-------------- - ----
------------ --------
----------------上述代码中，我们首先判断请求的 URL 是否为 /upload，如果是，就使用 formidable 模块解析请求体，获取上传的文件信息。然后，将文件从临时目录移动到指定的目录中，并返回上传成功的响应。
需要注意的是，formidable 模块默认会将文件保存到临时目录中，需要手动将文件移动到指定的目录中。
2.3 显示上传的文件
当用户上传文件后，服务器需要将文件保存到磁盘中，并可以在页面中显示出来。可以在前端使用 img 标签来显示图片，例如：
---- ------------------------- ---------
需要注意的是，需要将服务器上的文件路径映射到 URL 路径上，可以使用 Node.js 的静态文件服务器来实现，例如使用 express 框架：
----- ------- - ------------------- ----- --- - ---------- ------------------- --------------------------- ---------------- -- -- - ------------------- ------- -- ------------------------ ---
上述代码中，我们使用 express.static 中间件将 uploads 目录映射到 /uploads 路径上，这样用户就可以通过访问 /uploads/avatar.png 来查看上传的头像了。
3. 总结
通过本文的学习，我们了解了 Node.js 实现 Web 应用中的文件上传功能的方法，包括创建表单、接收文件和显示文件等步骤。需要注意的是，文件上传功能存在安全风险，需要对上传的文件进行验证和限制，例如文件类型、文件大小等。
来源：JavaScript中文网 ，转载请注明来源 本文地址：https://www.javascriptcn.com/post/663c2285d3423812e4a02337