有谁知道js中如何操作blob二进制流?
网友回复
js可以通过blob方法直接操作二进制数据
Blob 对象表示一个不可变、原始数据的类文件对象。Blob 表示的不一定是JavaScript原生格式的数据。File 接口基于Blob,继承了 blob 的功能并将其扩展使其支持用户系统上的文件。 创建Blob var blob = new Blob( dataArr:Array, opt:{type:string}) dataArray: 数组,包含了要添加到 Blob 对象中的数据,数据可以是任意多个 ArrayBuffer, ArrayBufferView, Blob, 或者 DOMString 对象。 opt:对象,用于设置Blob的属性(如: MIME 类型) 1.创建一个DOMString对象的Blob对象 var a="<p>l</p>" var b = new Blob([a],{type:"text/plain"})2.创建一个装满ArrayBuffer对象的Blob对象
var a=new ArrayBuffer(16) var b = new Blob([a],{ type:"text/plain"})3.创建一个装满ArrayBufferView对象的Blob对象
var a=new ArrayBuffer(16) var b = new Int16Array(a) 通过url下载文件 通过createObjectURL //axios需要添加responseType:'blob' let blob = new Blob([res.data], {type: "application/vnd.ms-excel"}); let url = window.URL.createObjectURL(blob); window.location.href = url; 通过插件file-saver //axios需要添加responseType:'blob' var blob = new Blob([res.data], {type: "text/plain;charset=utf-8"}); saveAs(blob, "file.txt"); createDownload("download.txt","download file"); function createDownload(fileName, content){ var blob = new Blob([content]); var link = document.createElement("a"); link.innerHTML = fileName; link.download = fileName; link.href = URL.createObjectURL(blob); document.getElementsByTagName("body")[0].appendChild(link); } 从 Blob 中提取数据 readAsText()readAsText 方法可以将 Blob 或者 File 对象转根据特殊的编码格式转化为内容(字符串形式)
这个方法是异步的,也就是说,只有当执行完成后才能够查看到结果,如果直接查看是无结果的,并返回undefined也就是说必须要挂载 实例下的 onload 或 onloadend 的方法处理转化后的结果
当转化完成后, readyState 这个参数就会转换 为 done 即完成态, event("loadend") 挂载的事件会被触发,并可以通过事件返回的形参得到中的 FileReader.result 属性得到转化后的结果
// 一个文件上传的回调 <input type="file" οnchange="onChange(event)"> function onChange(event) { var file = event.target.files[0]; var reader = new FileReader(); reader.onload = function(event) { // 文件里的文本会在这里被打印出来 console.log(event.target.result) }; reader.readAsText(file,'UTF-8'); }readAsDataURL() readAsDataURL 方法会读取指定的 Blob 或 File 对象。读取操作完成的时候,readyState会变成已完成DONE,并触发 loadend 事件,同时 result 属性将包含一个data:URL格式的字符串(base64编码)以表示所读取文件的内容。 //<input type="file" οnchange="previewFile()"><br> //<img src="" height="200" alt="Image preview..."> function previewFile() { var preview = document.querySelector('img'); var file = document.querySelector('input[type=file]').files[0]; var reader = new FileReader(); reader.addEventListener("load", function () { preview.src = reader.result; }, false); if (file) { reader.readAsDataURL(file); } }
uniapp怎么实现修改默认picker的选中颜色和确认按钮颜色样式?
uniapp怎么实现自定义nav导航条向上滚动导航条背景变色?
js如何生成随机用户昵称?
如何解决python print输出不显示缓冲问题?
python-docx创建Word文档报错ValueError: All strings must be XML compatible: Unicode or ASCII, no NULL bytes
python如何实时监控指定目录的文件增删改操作记录?
python如何生成word文档?
uniapp如何自定义组件并且可以使用v-model双向绑定?
uniapp的subNVues如何使用?
uniapp的自定义组件component如何实现滑到底部自动加载更多和下拉刷新?