new Blob()详解以及blob转file

这篇具有很好参考价值的文章主要介绍了new Blob()详解以及blob转file。希望对大家有所帮助。如果存在错误或未考虑完全的地方,请大家不吝赐教,您也可以点击"举报违法"按钮提交疑问。

定义:

Blob() 构造函数返回一个新的 Blob 对象。blob 的内容由参数数组中给出的值的串联组成。

语法

var aBlob = new Blob( array, options );

参数

array 是一个由ArrayBuffer, ArrayBufferView, Blob, DOMString 等对象构成的 Array ,或者其他类似对象的混合体,它将会被放进 Blob。DOMStrings 会被编码为 UTF-8。
options 是一个可选的BlobPropertyBag字典,它可能会指定如下两个属性:
type,默认值为 “”,它代表了将会被放入到 blob 中的数组内容的 MIME 类型。
endings,默认值为"transparent",用于指定包含行结束符\n的字符串如何被写入。它是以下两个值中的一个:“native”,代表行结束符会被更改为适合宿主操作系统文件系统的换行符,或者 “transparent”,代表会保持 blob 中保存的结束符不变 非标准文章来源地址https://www.toymoban.com/news/detail-506028.html

示例

var aFileParts = ['<a id="a"><b id="b">hey!</b></a>']; // 一个包含 DOMString 的数组  可以是dom 数字 对象 日期等等   都要转成字符串  
//例如: let aFileParts = [JSON.stringify({age:18,sex:'男'})]   
var oMyBlob = new Blob(aFileParts, {type : 'text/html'}); // 得到 blob  里面的type是 MIME 类型   也就是 前面内容的格式  需要转成什么类型的格式

blob转file

 let obj = {
            age: 18,
            sex: '男'
        }
        let content = JSON.stringify(obj)
            // blob类型
        let blob = new Blob([content], {
                type: 'application/json'
            })
            // 将blob转成url
        let url = URL.createObjectURL(blob) //blob:null/244bec7f-e3d3-43d5-803e-f98cc5c8117f  =>链接里面的数据就是右边的内容 {"age":18,"sex":"男"}
        console.log(url)
            //blob转file
        let filename = '文件名'
        var file = new File([blob], filename, {
            type: 'application/json',
            lastModified: Date.now()
        });
        //或者
        var file1 = new File([content], filename, {
            type: 'application/json',
            lastModified: Date.now()
        });
        console.log("文件", file, file1)

到了这里,关于new Blob()详解以及blob转file的文章就介绍完了。如果您还想了解更多内容,请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章,希望大家以后多多支持TOY模板网!

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处: 如若内容造成侵权/违法违规/事实不符,请点击违法举报进行投诉反馈,一经查实,立即删除!

领支付宝红包 赞助服务器费用

相关文章

  • 解决axios请求文件流前端通过new Blob完成文件流下载文件打不开

    目录 1.首先请求封装axios的请求方式 2.根据接口文档查看文件流的请求类型 3.请求Methods 4.以上写完以后,好消息是文件可以成功下载 4.1坏消息是文件竟然是个损坏文件打不开,修复了也是乱码 5.解决问题 5.1 前端做文件下载有很多方式,前端返回文件流需要我们在axios请求封

    2024年04月25日
    浏览(46)
  • 谈谈:File、Blob、FileReader、ArrayBuffer、base64

    JavaScript 提供了一些 API 来处理文件或原始文件数据,例如:File、Blob、FileReader、ArrayBuffer、base64 等。下面就来看看它们都是如何使用的,它们之间又有何区别和联系。 1. Blob Blob全称为binary large Object 即二进制大对象,他是js中的一个对象,表示原始类似文件的数据。MDN中的解

    2024年02月09日
    浏览(49)
  • 阿里云图片上传返回地址有blob格式问题处理实录

    2.1根据上传返回响应状态 2.2调用GetObject接口获取下文件的大小     阿里云OSS上传图片功能很多人可能对实现过,正常情况下会返回https开头的图片地址.但是今天业务系统中运营人员反应上传的合同详情页面打开异常,看过服务端的日志之后发现用户上传的图片地址带有blob,线

    2023年04月21日
    浏览(49)
  • 后端返回数据流,前端进行转换blob文件流

    1. 首先相应的头里面请求改为 responseType: \\\'blob\\\' 2.           let res = await getPhotoVideoUrl() --此处为模拟的获取一个视频流的地址;         const img = new Blob([res], { type: \\\'image/png\\\' });         let imgUrl = window.URL.createObjectURL(img); 3.拿到流的地址后,先进行new Blob进行创建一个对象。

    2024年02月13日
    浏览(42)
  • 前端基于axios请求下载文件(后端返回Blob文件流)

    前端小白第一篇csdn文章就当自己记录学习啦! 我自己遇到的情况写在前面防止有人和我不一样,浪费时间浏览; 调用下载接口后端给我返回的数据格式(即文件流格式)如下: 1.按钮定义点击事件 2.调用后端接口 在使用 axios 请求下载文件 api 接口时,注意区分不同请求方法

    2024年02月11日
    浏览(65)
  • 【JavaScript】如何转换blob数据与file文件还有url

    大家好,关于 blob 对象和 file 对象有了解多少呢,它们都是一种文件的表示形式,文件之间是可以互相转换的,顺带一提,还有经常用到的临时文件路径 tempFileURL 。 首先,需要先知道文件类型有哪些,我们可以通过文件名后缀判断 常见的文件类型列表 文件后缀 MIME类型 说明

    2023年04月09日
    浏览(45)
  • axios返回几种数据格式? 其中Blob返回时的size是什么意思?

    axios返回几种数据格式? 其中Blob返回时的size是什么意思? 1、字符串(String):服务器可以返回纯文本或HTML内容,Axios会将其作为字符串返回。 2、JSON(JavaScript Object Notation):这是最常见的数据格式,服务器可以返回JSON格式的数据,Axios会将其解析为JavaScript对象。 3、数组(

    2024年02月09日
    浏览(39)
  • 前端下载文件流,设置返回值类型responseType:‘blob‘无效的问题

    本是一个非常简单的请求,即是下载文件。通常的做法如下: 1.前端通过Vue Axios向后端请求,同时在请求中设置响应体为Blob格式。 2.后端相应前端的请求,同时返回Blob格式的文件给到前端(如果没有步骤1设置响应体,则后端返回的是一个文件流,前端) 3.前端创建a标签进行

    2024年01月17日
    浏览(73)
  • vue 后端返回二进制流-前端通过blob对象下载文件-图片

    前言 在实际开发中我们经常会遇见下载文件的场景,比如下载合同,下载文件 下载文件有2种方式,一种是后端返回二进制流,前端通过blob对象接受根据不同类型下载 还有一种把地址直接在浏览器新窗口打开浏览器打开pdf可以预览和下载,其他文件直接下载 但不管是那种方

    2024年02月05日
    浏览(81)
  • 【js】js前端技巧之图片格式转换(File、Blob、base64):

    一、类型简介 BLOB(binary large object) : 二进制大对象,是一个可以存储二进制文件的容器。 在计算机中,BLOB常常是数据库中用来存储二进制文件的字段类型。 属性名称 读/写 描述 size 只读 Blob 对象中所包含数据的大小(字节)。 type 只读 一个字符串,表明该Blob对象所包含数据

    2024年02月07日
    浏览(56)

觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

博客赞助

微信扫一扫打赏

请作者喝杯咖啡吧~博客赞助

支付宝扫一扫领取红包,优惠每天领

二维码1

领取红包

二维码2

领红包