浅谈 javascript 之 Blob对象

Blob = Binary Large Object 的缩写，直译为二进制大对象，虽然在大多数前端开发中并不常见，但实际上在MYSQL数据库中，可以通过设置一个BLOB类型的数据来存储一个BLOB对象的内容

使用blob对象是在接受后台返回的数据流，导出数据，下载excel是用于处理后端返回的数据流，后端返回的是一个下载链接，类似这样的：

<a href="blob:http://172.168.0.110:10000/67d67b99-4996-4607-badb-22420af5b8d8" download="%E9%61%A8%E8%AF%8A%E6%97%A5%E5%BF%97%U1%88%97%A8%A1%A8.xlsx">Download file</a>

我们需要通过blob对象来处理，需要模拟一个<a>标签来提供下载链接

          const link = document.createElement('a') // 创建一个a标签

          link.style.display = 'none'

         // 通过构造函数来实例化一个Blob对象

          const blob = new Blob([res.data], {

            type: 'application/vnd.ms-excel' // 数据类型

          })

          // res.data 一般为文件的 size, type, 所以blob值一般就是这些

          // 创建一个url 对象，并将blob实例作为参数传入，这样href的值就是以blob开头的一个文件流下载链接

         // "blob:http://127.0.0.1:8080/9b3e0266-9d56-4119-b3b9-38ccce875fd3"

         // objectURL = URL.createObjectURL(object), object 参数是一个用于创建 URL 的 File 对象、Blob 对象或                 者 MediaSource 对象。

          link.href = URL.createObjectURL(blob)

          const fileName = 'xxx.xlsx'

          link.download = fileName

          link.click()

创建一个Bolb对象 （构造函数来构建）

var blob = new Blob(array[optional], options[optional]);

构造函数，接受两个参数

第一个参数：为一个数据序列，可以是任意格式的值，例如，任意数量的字符串，Blobs 以及 ArrayBuffers。

第二个参数：用于指定将要放入Blob中的数据的类型(MIME)（后端可以通过枚举MimeType，获取对应类型：

MimeType mimeType = MimeType.toEnum(file.getContentType())）

  <script>
    var blob = new Blob(["Hello World!"],{type:"text/plain"})
  </script>

Blob对象的基本属性：

size ：Blob对象包含的字节数。(readonly)

type ： Blob对象包含的数据类型MIME，如果类型未知则返回空字符串。

Blob对象的基本方法： 

大文件分割 (slice() 方法)，slice方法与数组的slice类似。

Blob.slice([start, [end, [content-type]]])

type ： Blob对象包含的数据类型MIME，如果类型未知则返回空字符串。

也可参考以下博客，写的很详细：

https://www.jianshu.com/p/75bfd7cd9e1b

https://blog.csdn.net/weixin_41888813/article/details/83858343

https://www.jianshu.com/p/33564726aed8