将图片地址转为blob格式的例子

简介: 将图片地址转为blob格式的例子

HTML代码:

<div id="forAppend" class="demo"></div>

Javascript代码:

<script>

var eleAppend = document.getElementById("forAppend");

window.URL = window.URL || window.webkitURL;

if (typeof history.pushState == "function") {

var xhr = new XMLHttpRequest();

xhr.open("get", "此处填写您的图片地址", true);

// 数据响应类型 blob

xhr.responseType = "blob";

xhr.onload = function() {

if (this.status == 200) {

var blob = this.response;

var img = document.createElement("img");

img.onload = function(e) {

window.URL.revokeObjectURL(img.src); // 清除释放

};

// 在img放置blob

img.src = window.URL.createObjectURL(blob);

eleAppend.appendChild(img);

}

}

xhr.send();

} else {

eleAppend.innerHTML = '<p style="color:#cd0000;">请更换浏览器重试~</p>';

}

</script>

请务必在环境下运行

目录
相关文章
livp图片怎么打开以及怎么转换成jpg格式教程
livp图片怎么打开以及怎么转换成jpg格式教程
后端返回base64格式数据转excel格式文件并下载
后端返回base64格式数据转excel格式文件并下载
248 0
|
JavaScript 前端开发 应用服务中间件
【前端项目笔记】原生js上传文件及文件转换成base64、blob类型
项目中经常会用到上传图片上传视频等功能,由于后端nginx限制,经常要进行文件转化才能上传,大文件可能还要进行切片上传处理。
665 1
|
前端开发 API
图片或文件Blob、File、Base64之间的相互转换
在做前端项目的时候,遇到图片的上传或者下载时,不可避免的会遇到Blob、File、Base64三种类型的转换。那么今天就总结下,三者之间的相互转换。 首先我们看看base64 ,File 对象,Blob 对象长什么样的,怎么来的。
515 1
|
人工智能 Java 对象存储
Java获取阿里云图片临时URL与图片文件转换Base64编码方法
在使用阿里云人工智能产品服务时,有部分服务需要上传的参数中包含文件URL,当我们没有开通OSS服务时,可以使用临时URL服务、或部分服务支持Base64编码格式,此文章为生成临时URL-JavaSDK方案与图片文件转换Base64编码方案。
2029 0
|
7月前
excel 图片地址转成图片
excel 图片地址转成图片
129 1
|
7月前
将图片(路径)转换为Base64 和 将base64转换为file类型
将图片(路径)转换为Base64 和 将base64转换为file类型
后端返回的base64流形式的图片,怎么放在src中
后端返回的base64流形式的图片,怎么放在src中
175 0
图片转base64 并根据格式加前缀
图片转base64 并根据格式加前缀
415 0
*.pvr.ccz文件还原成png格式
*.pvr.ccz文件还原成png格式
229 0