在前端项目中，我们常常需要在浏览器端处理二进制数据，比如直接读取文件数据，或者在客户端上传文件。JavaScript中的Blob对象就是用来描述这些二进制数据的，但是它的使用方法和 API 并不是很友好。在生产环境中，我们经常需要对二进制数据进行一些其他操作，比如加密、解密、压缩、解压缩等。这时，一个完整的库能够帮助我们大大提高开发效率。其中，npm包 based-blob 就是一个可以快速处理二进制数据的JavaScript库。
什么是 based-blob？
based-blob 是一个封装了 Blob 和 ArrayBuffer 对象的 npm 包，提供了一系列对二进制数据的封装，帮助开发者更容易地操作这些数据。
based-blob 的安装
使用 npm 安装 based-blob 依赖：
$ npm install based-blob
如何使用 based-blob?
based-blob 导出的主要实例是 Blob 和 Base64 对象。
我们可以使用 Blob.fromBytes 方法将字节数组转化为 Blob。
import {Blob} from 'based-blob'; const byteArr = new Uint8Array([72,101,108,108,111,32,87,111,114,108,100,33]); const blob = Blob.fromBytes(byteArr);
我们还可以使用 Blob.fromBase64 方法将 base64 字符串转化为 Blob。
import {Blob} from 'based-blob'; const base64Str = 'aGVsbG8gd29ybGQh'; const blob = Blob.fromBase64(base64Str);
Base64 对象提供了两个方法：
toBase64(bytes: Uint8Array): string：将 Uint8Array 转化为 Base64 字符串。fromBase64(base64: string): Uint8Array：将 Base64 字符串转化为 Uint8Array 字节数组。
下面是一个完整的示例，展示了如何将文字以及图片数据进行 Base64 编码，并且可以将它们保存到文件：
-- -------------------- ---- ------- ------ ------ ------- ---- ------------- ----- ---- - ----------- ------ ----- ------- - --- ---------------- ---- ---- ---- -- --- --- --- --- --- -- -- -- -- -- --- -- --- -- -- ---- ---- -- --- -- -- -- -- -- -- -- -- -- -- -- -- -- -- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- -- -- -- -- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- ---- ---- -- --- -- -- -- -- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- ---- ---- -- --- -- -- --- -- ---- -- --- -- --- -- --- -- --- -- ---- ---- -- -- --- -- --- -- -- --- -- -- --- -- ---- ---- -- --- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- --- -- --- --- --- --- -- --- --- -- --- --- --- ---- --- --- ---- ---- ---- -- --- --- ---- ---- --- --- ---- ---- ---- --- --- --- ---- ---- ---- ---- -- --- -- -- -- -- --- -- --- -- --- -- ---- ---- --- -- ---- ---- ---- ---- --- ---- ---- -- ---- --- ---- ---- ---- --- --- --- ---- ---- ---- ---- ---- --- ---- ---- --- --- --- ---- --- ---- ---- ---- -- ---- --- ---- --- ---- ---- ---- ---- ---- ---- --- ---- ---- ---- ---- --- ---- ---- ---- ---- ---- ---- ---- --- ---- --- ---- ---- ---- ---- ---- ---- ---- ---- ---- ---- --- ---- ---- ---- ---- ---- ---- --- ---- ---- ---- ---- --- --- --- ---- ---- ---- ---- ---- -- --- ---- --- ---- --- --- ---- --- --- --- -- --- ---- ---- ---- ---- ---- --- ---- ---- ---- ---- -- ---- -- ---- --- ---- --- ---- ---- ---- ---- ---- ---- ---- --- ---- --- --- --- ---- ---- ---- --- -- ---- --- --- ---- --- --- --- ---- ---- --- ---- --- ---- ---- -- ---- ---- ---- ---- --- ---- --- --- --- ---- --- --- ---- ---- ---- ---- --- ---- -- ---- --- --- ---- ---- ---- ---- ---- ---- --- ---- ---- ---- ---- --- --- ---- --- ---- --- --- --- ---- ---- --- --- ---- --- --- --- ---- ---- ---- -- --- ---- ---- ---- --- ---- --- ---- ---- ---- --- ---- ---- ---- ---- ---- ---- ---- ---- --- ---- --- ---- ---- --- ---- --- ---- ---- --- ---- ---- --- ---- -- ---- ---- -- --- ---- ---- --- ---- ---- --- --- ---- ---- ---- ---- ---- --- ---- ---- ---- ---- --- --- -- --- ---- ---- --- ---- --- --- ---- ---- --- --- ---- ---- --- -- ---- --- --- ---- -- --- --- ---- --- ---- --- ---- ---- -- ---- --- --- ---- ---- ---- ---- ---- ---- ---- --- --- --- --- --- --- --- ---- --- ---- --- ---- -- ---- ---- --- ---- --- --- ---- --- ---- ---- --- --- ---- ---- --- ---- --- ---- ---- ---- --- ---- --- ---- ---- ---- -- ---- ---- --- --- --- --- ---- ---- ---- ---- ---- ---- --- ---- ---- --- --- ---- ---- ---- ---- ---- ---- ---- ---- --- ---- ---- ---- --- --- ---- ---- ---- ---- --- ---- --- ---- ---- --- -- --- ---- ---- ---- ---- ---- ---- ---- --- --- --- ---- --- ---- ---- ---- ---- ---- ---- ---- ---- ---- ---- ---- ---- --- -- ---- ---- ---- ---- ---- ---- ---- ---- --- ---- ---- ---- ---- ---- ---- --- ---- ---- ---- ---- --- ---- ---- ---- ---- ---- ---- --- ---- --- --- ---- ---- ---- --- -- ---- --- ---- ---- --- --- --- ---- ---- ---- --- ---- ---- ---- ---- ---- ---- ---- ---- --- ---- ---- ---- --- --- ---- --- ---- ---- -- -- ---- --- ---- ---- ---- ---- ---- ---- ---- ---- ---- ---- --- --- --- --- --- --- --- --- --- -- ---- ---- ---- ---- --- ---- ---- ---- ---- ---- --- --- ---- ---- ---- ---- ---- --- ---- ---- ---- ---- ---- ---- --- ---- --- ---- ---- ---- --- --- --- --- --- ---- --- ---- ---- ---- --- ---- ---- ---- ---- ---- --- ---- ---- -- ---- --- ---- ---- ---- ---- ---- -- ---- --- --- --- ---- ---- ---- ---- --- --- ---- ---- ---- ---- ---- ---- ---- ---- ---- --- ---- ------ ----- -------- - ------------------- -------------------------------------- -- ------------------------ ----- ---------- - ------------------------- ----- ---- - ---------------------------- ------------- - ---------------------- --------- - ----------------------------------------------- ---------------------- --------------------- ------------- - ---------------------- --------- - ----------------------------------------------- --------------- ---------------------- ---------------------展开代码
总结
本篇文章简单介绍了基本的 based-blob 库使用方法，并通过示例展示了如何将 Base64 编码数据保存为文件。当然，它还有其他很多用法，希望这篇文章能够帮助你快速上手 based-blob。
在前端开发中，处理二进制数据是一个比较困难的问题。这时候， based-blob 作为一个封装了 Blob 和 ArrayBuffer 对象的库，可以帮助你更加简单、高效地操作二进制数据，提高开发效率。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/6005596181e8991b448d6d35
