在前端开发中，文件上传是一个非常常见的需求。而在现代化的 web 开发中，将文件上传至云存储已经成为一个更普遍的选择，可以减轻服务器压力，提高程序的可扩展性。Azure Blob Storage 是微软云平台提供的一种对象存储技术，可以作为 Azure Cloud 的一部分，与 Azure Functions 和 Azure App Service 等云平台服务集成使用。@fuechschen/multer-azure-storage 就是一个专门为 Azure Blob Storage 设计的 npm 包，可以帮助前端开发人员在项目中更方便地实现文件上传至云存储。
关于 @fuechschen/multer-azure-storage
@fuechschen/multer-azure-storage 是基于 Multer 实现的 Azure Blob Storage 存储桶文件上传处理中间件。它可以轻松处理从客户端上传的多个文件，将它们存储在 Azure Blob Storage 中，并返回文件相关信息。
安装
使用 @fuechschen/multer-azure-storage 有以下前置条件：
- 已经创建好 Azure Blob Storage 存储桶。
- 已经在 Azure 中设置了存储连接字符串，并将连接字符串添加到项目的 .env 文件中。
你可以通过以下命令在项目中安装 @fuechschen/multer-azure-storage ：
npm install @fuechschen/multer-azure-storage
使用
加载中间件
在文件上传处理中间件中加载 Multer 和 Multer-Azure-Storage 中间件模块，将其传递给 Multer 并指定为 storage 属性的值。最后使用 Multer 中间件加载程序主要代码如下：
-- -------------------- ---- -------
----- ------ - ------------------
----- - ------------------ - - --------------------------------------------
----- ------ - --------
-------- --- --------------------
----------------- --------------------------------------------
---------- ---------------------------------------------
------------ ---------------------------------------
-------------- -----------------------------------------
--------------------- ------------------------------------------------- -- ------ -- -----------
--
---在上述代码中，我们从 @fuechschen/multer-azure-storage 模块中引入 MulterAzureStorage 类。然后创建了一个新的 storage 实例，并且传入了一些必要的参数，例如连接字符串和存储桶相关信息。
使用中间件
Multer Azure Storage 中间件的使用非常简单。只需在前端页面中添加一个提交表单，并在 form 中指定 enctype 属性为 multipart/form-data，文件上传表单将按例进行提交。
<form action="/upload" method="POST" enctype="multipart/form-data">
<input type="file" name="avatar" />
<input type="submit" value="Upload Avatar" />
</form>将前面加载的 Multer 中间件作为处理器加载到 HTTP 路由上：
router.post('/upload', upload.array('avatar', 3), function (req, res, next) {
res.send({name: req.files[0].originalname, url: req.files[0].url});
});在上述代码中，我们调用了 upload.array() 方法并将 'avatar' 和 3 个文件作为参数传递给 Multer 处理器。loadImages() 方法将会取出客户端上传的所有文件并在Azure Blob Storage 中存储它们。
你可以用下面的代码片段在控制台中查看上传的文件信息：
console.log(req.files);
建议
本文介绍了 @fuechschen/multer-azure-storage 的基本使用方法。但使用此包前仍需了解 Azure Blob Storage 和 Multer 相应的基础知识。只有具备基本的知识和技能，才能将 @fuechschen/multer-azure-storage 用好，达到更好的使用效果。
示例代码
-- -------------------- ---- -------
----- ------ - ------------------
----- - ------------------ - - --------------------------------------------
----- ------ - --------
-------- --- --------------------
----------------- --------------------------------------------
---------- ---------------------------------------------
------------ ---------------------------------------
-------------- -----------------------------------------
--------------------- ------------------------------------------------- -- ------ -- -----------
--
---
---------------------- ---------------------- --- -------- ----- ---- ----- -
--------------- -------------------------- ---- -------------------
---
-----------------------来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/600574fb81e8991b448ea34e