文件上传是许多网站的必要功能之一，包括社交媒体、文件共享站点等。然而，在未经过充分验证的情况下，文件上传功能很容易成为网络攻击者的攻击目标。这种类型的攻击往往被称为文件上传漏洞，通过一些方式，攻击者可以将恶意代码或病毒上传到服务器上并执行。
因此，在开发时需要考虑文件上传功能的安全性。本文将介绍如何使用 Express.js 实现安全文件上传方案，并提供示例代码，为您提供深度学习和指导意义。
确保上传的文件类型是安全的
文件上传漏洞的一个主要来源是未能限制上传文件的类型。攻击者可能会上传一些可执行的脚本或电子表格以获取有关服务器的敏感信息。因此，确保上传的文件类型是安全的非常重要。
在 Express.js 中，可以使用 multer 中间件来处理文件上传。multer 中间件允许我们使用 fileFilter 筛选上传的文件类型以保证安全。在本例中我们将只允许上传 JPG、JPEG、PNG 和 GIF 格式的文件。
-- -------------------- ---- -------
----- ------ - ------------------
----- ------ - --------
----- -----------
----------- ----- ----- --- -- -
----- ---------- - -------------- ------------ -------------
-- ------------------------------------ -
-------- ------
- ---- -
------ -------------- ---- ----- ---- ---- ----- --- --- --- --- ------------
-
--
---在以上示例中，我们创建了一个 multer 实例，使用 fileFilter 方法进行筛选。validMimes 变量包含允许的文件类型，如果上传的文件类型不在白名单中，则抛出一个异常。
预防文件名冲突
文件名冲突是很常见的问题，当上传的文件与已存在的文件同名时，通常会发生覆盖的情况。如果我们可以处理这个问题，就可以避免文件覆盖和文件名冲突对系统的影响。
在 Express.js 中，我们可以通过更改文件名来预防文件名冲突。在 multer 中间件中，可以使用 rename 函数来更改文件名。在本例中，我们使用 UUID 作为生成的文件名，这是一种理想的用于文件名的字符串。
-- -------------------- ---- -------
----- - --- ------ - - ----------------
----- ------ - ------------------
----- ------ - --------
----- -----------
----------- ----- ----- --- -- -
----- ---------- - -------------- ------------ -------------
-- ------------------------------------ -
-------- ------
- ---- -
------ -------------- ---- ----- ---- ---- ----- --- --- --- --- ------------
-
--
--------- ----- ----- --- -- -
----- -------- - ---------
-------- ----------
--
---在以上示例中，我们通过 require('uuid') 导入了 uuid 模块，并使用 uuidv4() 方法生成唯一的文件名。
防止文件上传过大
通常情况下，上传的文件大小应该限制在一定范围内，以保证服务器能够顺利地处理请求。我们可以使用 multer 中间件提供的 limits 选项来限制上传文件的大小。
-- -------------------- ---- -------
----- ------ - ------------------
----- ------ - --------
----- -----------
----------- ----- ----- --- -- -
----- ---------- - -------------- ------------ -------------
-- ------------------------------------ -
-------- ------
- ---- -
------ -------------- ---- ----- ---- ---- ----- --- --- --- --- ------------
-
--
--------- ----- ----- --- -- -
----- -------- - ---------
-------- ----------
--
------- -
--------- -------- -- - --
--
---在以上示例中，我们通过 limits 选项限制了上传文件的大小，最大值为 1 MB。
安全地保存和读取上传文件
在 multer 中间件中，我们可以使用 diskStorage 方法来指定文件的存储位置和文件名。如果我们将上传的文件保存到服务器的磁盘中，则需要确保该位置不会被网络攻击者访问。
在本例中，我们将上传的文件保存到项目文件夹的 uploads 目录中。为了防止攻击者通过访问该目录来访问上传的文件，我们需要提供另一个 API，该 API 可以在必要时返回已上传文件的内容。
-- -------------------- ---- -------
----- ------- - -------------------
----- -- - --------------
----- ---- - ----------------
----- --- - ----------
------------------------- ----- ---- -- -
----- -------- - -------------------- ---------- -----------------
-- ------------------------- -
-----------------------
- ---- -
--------------------
-
---在以上示例中，我们使用 express 的 .get 方法提供了一个获取已上传文件的 API。该 API 接收文件名作为参数，在文件不存在的情况下返回 HTTP 状态码 404，否则返回文件的二进制数据。
示例代码
-- -------------------- ---- -------
----- ------- - -------------------
----- - --- ------ - - ----------------
----- ------ - ------------------
----- -- - --------------
----- ---- - ----------------
----- --- - ----------
----- ------ - --------
----- -----------
----------- ----- ----- --- -- -
----- ---------- - -------------- ------------ -------------
-- ------------------------------------ -
-------- ------
- ---- -
------ -------------- ---- ----- ---- ---- ----- --- --- --- --- ------------
-
--
--------- ----- ----- --- -- -
----- -------- - ---------
-------- ----------
--
------- -
--------- -------- -- - --
--
---
------------------- ---------------------- ----- ---- -- -
----------
-------- -----
----- ---------
---
---
------------------------- ----- ---- -- -
----- -------- - -------------------- ---------- -----------------
-- ------------------------- -
-----------------------
- ---- -
--------------------
-
---
---------------- -- -- -
------------------- -- --------- -- ---- -------
---在以上示例中，我们为 Express.js 应用程序提供了两个 API：
/upload: 此 API 接收一个与名为file的表单控件关联的文件上传，并保存到服务器的磁盘中。该 API 将文件信息作为响应返回。/uploads/:name: 此 API 接收文件名作为参数，并返回指定文件的二进制数据。
尝试使用自己的文件进行上传并获取其二进制数据时，我们需要访问 /uploads/<文件名> API。在本例中，已上传的文件保存在项目文件夹的 uploads 子目录中。
总结
在本文中，我们介绍了如何使用 Express.js 实现安全文件上传方案，并提供了示例代码。实现此功能时需要注意以下几点：
- 确保上传的文件类型是安全的
- 预防文件名冲突
- 防止文件上传过大
- 安全地保存和读取上传文件
在编写文件上传功能时，我们应遵循最佳实践，确保文件上传是安全的，并为用户提供良好的体验。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/66570562d3423812e4c23523