Blob + ArrayBuffer 怎么将流文件，转为本地文件读取？

Blob + ArrayBuffer

ArrayBuffer对象：(模拟内存中二进制数据， 用来操作内存)

01：设计目的为了满足 JavaScript 与显卡之间大量的、实时的数据交换（二进制）

02：只能通过视图（TypedArray视图和DataView视图）来进行操作。“视图”部署了数组接口，这意味着，可以用数组的方法操作内存
TypedArray视图：共包括 9 种类型的视图，用来读写简单类型的二进制数据。
DataView视图：可以自定义复合格式的视图，用来读写复杂类型的二进制数据。

Blob对象：（二进制大型对象，操作二进制文件）

01: Blob 对象表示一个二进制文件的数据内容，通常用来读写文件，比如一个图片文件的内容就可以通过 Blob 对象读写
02:  Blob的数据不可变。最多只能slice出新的Blob。不可变意味着你想直接翻转它某个二进制位的值，是不可能的。
想使用这个Blob的话，只能整体使用。比如最常用的URL.createObjectURL，FormData等。

01: 调取后端接口，后端返回流数据？一般用于文件下载（excel和图片等相关文件下载）

02：axios请求  在请求数据的接口的时候，添加在请求头中  responseType: 'arraybuffer'，此处转成了base64

axios.get( global.SERVER_URL + '/ws/dms/meta/' + imgData[0].id, { 
    responseType: 'arraybuffer',
 }).then(res => {
    
    引入buffer库解析:
     const url = 'data:image/png;base64,' + new Buffer(res).toString('base64'); 

    btoa解析：
        'data:image/png;base64,' + btoa(new Uint8Array(res.data).reduce((data, byte) => data + String.fromCharCode(byte), ''))
 })

03： web自动解析

<iframe style={{height:  200, width: '100%'}} src='http://192.168.xx.118:8082/ws/dms/meta/595'}></iframe>

<img src="http://192.168.xx.118:8082/ws/dms/meta/595" width="628" height="837">

 

04： XMLHttpRequest

var xmlRequest = new XMLHttpRequest();
xmlRequest.open("GET", url, true);  
xmlRequest.responseType = "blob";// 指明返回的数据的类型是二进制
xmlRequest.onreadystatechange = function(e) {  
    if (this.readyState == 4 && this.status == 200) {  
        console.log(this._response)
    }  
}  
xmlRequest.send(null);