JS 图片转blob 转base64
//转换为blob有跨域限制
var loadImageToBlob = function (url, callback) { if (!url || !callback) return false;
var xhr = new XMLHttpRequest();
xhr.open('get', url, true);
xhr.responseType = 'blob';
xhr.onload = function () {
// 注意这里的this.response 是一个blob对象 就是文件对象
callback(this.status == 200 ? this.response : false);
}
xhr.send();
return true; }
$("#app-wraper img").each(function () {
loadImageToBlob($(this).attr("src"), function (blobFile) {
if (!blobFile) return false;
var reader = new FileReader();
//将文件以Data URL形式读入页面
reader.readAsDataURL(blobFile);
reader.οnlοad = function (e) {
//显示文件
var h = '<img src="' + this.result + '" alt="" />';
$("#result").append(h);
}
});
});
JS 图片转blob 转base64的更多相关文章
- JS图片上传后base64转码
代码: // 获取文件流 var fileObj = document.getElementById('inputId').files; // 实例化一个FileReader对象 var reader ...
- js实现图片的Blob base64 ArrayBuffer 的各种转换
一.相关基础知识 构造函数 FileReader() 返回一个新构造的FileReader 事件处理 FileReader.onabort 处理abort事件.该事件在读取操作被中断时触发. Fil ...
- js 图片base64转file文件的两种方式
js 图片base64转file文件的两种方式 https://blog.csdn.net/yin13037173186/article/details/83302628 //将base64转换为bl ...
- JS 实现blob与base64互转
/** * base64 to blob二进制 */ function dataURItoBlob(dataURI) { var mimeString = dataURI.split(',')[0]. ...
- js 将图片文件转换成base64
1.情景展示 在JavaScript中,如何使用图片文件转换成base64? 2.解决方案 /** * 网络图像文件转Base64 * @param img dom对象 */ function g ...
- js如何将选中图片文件转换成Base64字符串?
如何将input type="file"选中的文件转换成Base64的字符串呢? 1.首先了解一下为什么要把图片文件转换成Base64的字符串 在常规的web开发过程中,大部分上传 ...
- H5 Js图片转base64编码
<!Doctype html> <html> <head> <meta charset="utf-8" /> <title&g ...
- JS 图片转Base64
JS 图片转Base64 有时候需要向HTML中插入一张图片,可苦于上线后找不到一个合适的网盘来存储这些图片,有没有一种办法能将图片转换成文字,然后直接插入HTML中呢,通过Base64编码就可以解决 ...
- JS图片转Base64
网络上有很多片介绍通过js将图片转换成base64的文章,之所以再写这篇文章的原因时发现没有找到系统的介绍的文章,有的介绍如何实现本地项目的图片转码,有的介绍如何实现网络资源的图片转化,但是系统介绍的 ...
随机推荐
- sql type subtype 统计
select * from testtable; type subtype value a sa 1b sb 1a sb errorb sa errora sb 1b sb 1c sa errorc ...
- mysql5.7无法启动原因排查
前天刚刚拷了同事最新的MySQL5.7,安装成功后运行良好,今天却无法启动,Navicat也无法连接. 开始排查原因: 1.进入dos命令窗口,输入net start mysql启动,提示 百度出现错 ...
- VBA文件操作
做这些东西主要是为了,实现,我们的最终目标. 查到 两个大表里面的变化数据. 所以 这次 ①实现了 文件操作的一部分内容. 包括,excel的打开.分四个步骤. 1.路径 2.打开工作博 3.操作 4 ...
- LeetCode算法题-Backspace String Compare(Java实现)
这是悦乐书的第327次更新,第350篇原创 01 看题和准备 今天介绍的是LeetCode算法题中Easy级别的第197题(顺位题号是844).给定两个字符串S和T,如果两个字符串都输入到空文本编辑器 ...
- kafka学习(八)
管理kafka 主题操作 1.在集群里创建一个主题需要用到3个参数.这些参数是必须提供的,尽管有些已经有broker级别的默认值. 主题名字,想要创建的主题的名字,主题名字可以包含字母,数 ...
- 十、Zabbix-自动关联模板
之前的文章中,我们实现了自动注册,自动分组:并且创建了模板,监控项,触发器.为的就是能够实现主机自动被期望的监控项监控到.接下来我们只要能让自动注册的主机能够自动连接到我们设置好的模板,就可以实现自动 ...
- Scrapy输出文件格式问题汇总
Q:Scrapy抓取的内容(包含中文)输出到JSON Lines文件时如何确保输出的是字符本身而不是其unicode编码? A:默认的JsonLinesItemExporter其ensure_asci ...
- [Git] 019 merge 命令的补充
回顾:[Git] 017 加一条分支,享双倍快乐 的 "2.3" 1. "Fast-forward" "Git" 在合并分支时会尽可能地使用 ...
- [转帖]CentOS 7 使用kubeadm 部署 Kubernetes
CentOS 7 使用kubeadm 部署 Kubernetes 关闭swap 执行swapoff临时关闭swap. 重启后会失效,若要永久关闭,可以编辑/etc/fstab文件,将其中swap分 ...
- PL/SQL基本操作
1.常规过程化形式 declare o_booking_flag ); begin -- Call the procedure destine_ticket(', , 'E', , o_booking ...