在前端开发过程中，我们经常需要处理表单数据。而处理表单数据的一种便捷方式是使用 FormData 对象。但是，使用原生的 FormData 对象会存在一些兼容性和使用限制问题。为此，我们可以借助 npm 包 formdata 来处理表单数据，它提供了更为便捷且完整的表单数据处理方案，以便更好地满足我们的开发需求。
安装
在使用 npm 包 formdata 之前，我们首先需要进行安装。我们可以在项目目录下运行以下命令：
--- ------- --------
使用方法
创建 FormData 对象
可以通过以下方式来创建 FormData 对象：
----- -------- - ------------------------- ----- -------- - --- -----------
设置表单数据
我们可以使用 append 方法来为 FormData 对象设置表单数据：
--------------------------- ------------ --------------------------- ----------
发送表单数据
formdata 包还提供了便捷的发送表单数据方式：
------ ----- ---- -------------
------------------- -
------- -------
----- ---------
--
-------------- -- ----------------
---------- -- -
------------------
--
------------ -- -
---------------------
---支持文件上传
formdata 包支持文件上传，我们只需要通过 append 方法将文件对象添加到 FormData 对象中即可：
----- -- - -------------- ----- ---------- - ------------------------------------- ----------------------- ----------- ----------------
深入理解
Node.js 环境下使用 formdata
在 Node.js 环境下，我们使用的是 formdata-node 包，而非浏览器自带的 FormData 对象。这样做是因为，在 Node.js 环境下，我们需要使用第三方的 HTTP 请求库来发送数据（如 node-fetch），而这些库对 FormData 对象的支持程度较差。而使用 formdata-node 可以很好地解决这个问题。
上传文件
在 formdata 包中，上传文件的方式与处理表单数据的方式一致，只需要调用 append 方法，然后将文件对象作为参数传递进去即可。需要注意的是，文件对象需要转化成可读流。
另外，我们可以指定上传的文件名，通过第三个参数来指定。
与原生的 FormData 对象的不同
相比于原生的 FormData 对象，formdata 包具有更好的兼容性。在原生的 FormData 对象中，使用某些特殊类型的数据（例如 Blob、File）时，可能会出现兼容性问题。而 formdata 包则不存在这个问题。
此外，原生的 FormData 对象对 Unicode 字符的支持比较差，在使用非 ASCII 字符时需要进行编码。而 formdata 包无需进行编码即可支持 Unicode 字符。
总结
formdata 包提供了更为便捷且完整的表单数据处理方案，它具有更好的兼容性和支持度，并且支持文件上传。在 Node.js 环境下使用 formdata-node 可以很好地解决第三方 HTTP 请求库对 FormData 对象的支持程度较差的问题。
希望这篇文章可以帮助你更好地学习和使用 formdata 包。
来源：JavaScript中文网 ，转载请联系管理员！ 本文地址：https://www.javascriptcn.com/post/5ef6ec1a403f2923b035b8d4