前言
在 Web 开发中，经常用到上传文件的功能，而 HTTP 协议中规定的文件上传格式是 MIME Multipart。为了方便地构造和解析这种格式，可以使用 npm 包 mime-multipart，本文将介绍其具体用法。
安装
使用 npm 安装该包：
npm install mime-multipart
用法
构造 Multipart
构造 Multipart 需要以下三个参数：
parts: 一个数组，包含多个 Partboundary: 一个字符串，表示 Multipart 的边界，这个字符串需要保证在整个数据中唯一lastBoundary: 一个布尔值，表示是否在 Multipart 最后添加一个结束符
-- -------------------- ---- -------
----- - --------- - - --------------------------
----- ----- - -
-
-------- -
---------------------- ----------- ---------------
--------------- -------------
--
----- ---------
--
-
-------- -
---------------------- ----------- -------------- ------------------------
--------------- -------------
--
----- -------- ------
--
--
----- --------- - --- -----------
------
--------- -------------
------------- -----
---
----- --------------- - ---------------------
-----------------------------以上代码中，我们使用了 Multipart 类，它的构造函数接受一个 options 对象，其中的 parts 数组包含两个 Part。每个 Part 都有 headers 和 body 两个属性，headers 用来描述此 Part 的类型、名称等信息。对于文件，Content-Disposition 表示文件的名字以及在表单中的名称，Content-Type 表示文件的 MIME 类型。body 是此 Part 的内容，可以是字符串或者文件流等数据。
Multipart 类还有一个 toString 方法，用于将构造出的 Multipart 转为字符串。
解析 Multipart
解析 Multipart 也有相应的方法，我们可以使用 parse 函数将字符串转化为一个解析好的数组。
const { parse } = require('mime-multipart');
const multipartArray = parse(multipartString);
console.log(multipartArray);使用 parse 函数，可以得到一个数组，它的长度就是 Multipart 中包含的 Part 数量，每个元素都是一个对象，包含一个 headers 属性和一个 body 属性。headers 的内容与构造 Multipart 时相同，而 body 则是一个包含数据的 Buffer。
示例代码
以下代码演示了如何使用 Multipart 实现文件上传的功能，前端代码使用了 Vue 3.0 的 Composition API，后端用 Node.js。
前端代码：
-- -------------------- ---- -------
------ - --- - ---- ------
------ - --------- - ---- -----------------
------ ------- -
------- -
----- -------- - ----------
----- -------- - --------
----- ---- - ----------
----- -------- - -------
----- ---------- - -- -- -
----- ----- - ---------------
--------------
--
----- ---------- - ----- -- -- -
----- -------- - --- -----------
----------------------- ------------
----- --------- - --- -----------
------ -
-
-------- -
---------------------- ----------- --------------
--------------- -------------
--
----- ------ -------
--
--
--------- -------------
------------- -----
---
----- --------------- - --------------------------------- ---------
----- --------------- - --- -----------
--------------------------------------
---------------------------
-------------------------------
----- --- - ----- ---------------- -
------- -------
----- ---------
-------- -
--------------- --------------------- --------------------------------
----------------- -----------------------
--
---
----------- ------------
--
----- ---------------- - ------- -- -
----- -------------- - -------------------
-------------- - ------------------
---------- - -------------
--
------ -
---------
---------
---------
-----------
-----------
-----------------
--
--
--------- -
-----
----------- ----- -- -------- ------
------ -------------- ----------- --------------- ------ -------------------------- --
------- -------------------------- -------------
------- -----------------------------------
--------- ----------------- --------- --
------
--
--后端代码：
-- -------------------- ---- -------
----- - ------------ - - ----------------
----- - ----- - - --------------------------
----- ------ - ------------------ ---- -- -
-- ----------- --- ------ -- ------- --- ---------- -
--- -------------- - ---
--- --------- - --
----- ----------- - ----------------------------
----- -- --------- - ------------------------------------
-------------- ------- -- -
--------- -- -------------
-------------- - ------------ ----------
---
------------- -- -- -
----- -------- - -------------------------- -- ----------------------------------------------------------
----- -------- - --------------------------------------------------------------------
----- ---- - --------------
--------------------- ----- ------------ ----- -------------- ---------
--------------- -------------
---
- ---- -
-------------- - ----
------------ ---------
-
---
--------------------总结
本文介绍了 npm 包 mime-multipart 的使用方法，包括构造和解析 Multipart，以及如何应用在文件上传的场景中。开发者可以根据自己的需求，了解和使用这个包的相关功能。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/60066f481d8e776d08041148