window.URL.createObjectURL

已于 2022-01-21 16:36:26 修改
阅读量1.6k 收藏
点赞数
分类专栏： js vue 文章标签： javascript 前端 html
于 2022-01-11 09:40:16 首次发布
原文链接：https://www.jianshu.com/p/8ac5bcc2ef4f
版权
js 同时被 2 个专栏收录
28 篇文章 1 订阅
订阅专栏
vue
25 篇文章 1 订阅
订阅专栏

创建一个新的对象URL,该对象URL可以代表某一个指定的File对象或Blob对象.

语法

  • data参数是一个File对象或者Blob对象.
  • objectURL是生成的对象URL.通过这个URL,可以获取到所指定文件的完整内容.

在你不需要这些对象URL的时候,你应该通过调用 window.URL.revokeObjectURL()方法来释放它们所占用的内容.虽然即使你不主动释放它们,浏览 器也会在当前文档被卸载的时候替你释放,不过,考虑到更好的性能和更少的内存占用,你应该在安全的时候主动施放它们.

const url = window.URL.createObjectURL(data)
window.URL.revokeObjectURL(url);
呵呵的牛
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
Windows.url.createObjectURL()
博客
08-14 7707
Windows.url.createObjectURL()在 图片上传预览中使用。  概述：为创建一个新的URL对象 objectURL=windows.URL.vreateObjectURL(blod); blod 参数是File对象或者是Blod对象， objectURL是生成的对象URL.通过这个URL,可以获取到所指定文件的完整内容.在每次调用createObjectURL
URL.createObjectURL和URL.revokeObjectURL的应用
龘
09-02 342
一.URL.createObjectURL URL.createObjectURL()方法会根据传入的参数创建一个指向该参数对象的URL。 这个URL的生命仅存在于它被创建的这个文档里. 新的对象URL指向执行的File对象或者是Blob对象。 objectURL = URL.createObjectURL(blob || file); 参数: File对象或者Blob对象 File对象,就是一个文件,比如我用input type="file"标签来上传文件,那么里面的每个文件都是一个File对象.
URL.createObjectURL
最新发布
assassin_0302的博客
05-29 237
使用URL.createObjectURL 报错 Failed to execute 'createObjectURL' on 'URL': Overload resolution failed.
下载各类文件流的方法(兼容各个浏览器，包含错误信息处理)
STRIVE_LC的博客
11-03 929
downloadFile(res,fileName) { const blob = new Blob([res], {type: 'application/json'}) // 通过fileReader读取这个blob const reader = new FileReader() // 将blob对象以文本的方式读出，读出完成后将会执行onload方法 reader.readAsText(blob) reader.onload = .
URL.createObjectURL()和URL.revokeObjectURL()
前端小陈的成长记录
09-25 994
URL.createObjectURL()和URL.revokeObjectURL()
浅谈js图片前端预览之filereader和window.URL.createObjectURL
11-22
浅谈js图片前端预览之filereader和window.URL.createObjectURL //preview img ： filereader方式 document.getElementById('imgFile').onchange = function(e){ 5 var ele = document.getElementById('imgFile')....
vue+axios实现文件下载及vue中使用axios的实例
10-17
let url = window.URL.createObjectURL(new Blob([data])); let link = document.createElement('a'); link.style.display = 'none'; link.href = url; link.setAttribute('download', 'excel.xlsx'); ...
文件下载 乱码 文件损坏 打开undefind等几个坑点
01-07
前端请求二进制文件流,返回的是乱码,如下图: 这个时候先别急着找后端,只要能下载生成想要的文件,文件打开内容是正确的都好说... link.href = window.URL.createObjectURL(blob); link.download = 导出文件.xls; link
camera.js百叶窗
08-26
video.src = window.URL.createObjectURL(stream); }, function(err) {}); // 创建并准备canvas var canvas = document.getElementById('canvas'); var ctx = canvas.getContext('2d'); // 每帧更新 function ...
window.URL.createObjectURL 的使用
热门推荐
baidu_38558076的博客
05-11 9万+
window.URL.createObjectURL    可以用于在浏览器上预览本地图片或者视频预览视频代码<!DOCTYPE html><html><head> <title></title></head><body><script type="text/javascript"
pc端使用window.URL.createObjectURL预览文档（word、pdf）
weixin_45294459的博客
03-23 2758
【代码】pc端使用window.URL.createObjectURL预览文档（word、pdf）
区分 window.URL.createObjectURL() 和 FileReader.readAsDataURL()
huoren_no1的博客
09-01 1491
URL.createObjectURL() 语法 objectURL = URL.createObjectURL(object); 参数 用于创建 URL 的 File 对象、Blob 对象或者 MediaSource 对象 返回值 一个DOMString包含了一个对象URL，该URL可用于指定源 object 的内容 作用 该方法生成一个 URL 对象可以直接赋值给 DOM 元素的 src 属性 该方法生成一个 URL 对象还可以作为 a 标签的 href 属性值，用于下载或
window.URL.createObjectURL()和window.URL.revokeObjectURL
曾大强博客
10-26 2008
每次调用createObjectURL的时候,一个新的URL对象就被创建了.即使你已经为同一个文件创建过一个URL. 如果你不再需要这个对象,要释放它,需要使用URL.revokeObjectURL()方法. 当页面被关闭,浏览器会自动释放它,但是为了最佳性能和内存使用,当确保不再用得到它的时候,就应该释放它.比如一张图片,我创建了一个对象URL,然后通过这个对象URL,我页面里加载了这张图.既然已经被加载,并且不需要再次加载这张图,那我就把这个对象URL释放,然后这个URL就不再指向这张图了.
html5 url对象,window.URL.createObjectURL()和window.URL.revokeObjectURL应该成对使用吗？
weixin_28867991的博客
06-30 2013
window.URL.createObjectURL()和window.URL.revokeObjectURL应该成对使用吗？首先我们来认识一下 URL.createObjectURL() 作用。语法：objectURL=URL.createObjectURL(object);URL.createObjectURL() 静态方法会创建一个 DOMString，其中包含一个表示参数中给出的对象的...
JS导出表格文件方法（使用window.URL.createObjectURL）
chelly_z的博客
05-10 2614
文件下载
window.URL.createObjectURL Blob URL在IE中兼容问题
Yang Yong 的博客
08-16 2万+
问题描述 window.URL.createObjectURL()可以直接生成blob:开头的链接，该链接产生于浏览器端，不会占用服务器资源。 window.URL.createObjectURL()在IE10, IE11以及Microsoft Edge中生成的blob:链接，你不能把它加到一个<a>节点上，也不能直接在浏览器地址栏打开访问，并且得到“Error: 拒绝访问。...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值