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的文章,之所以再写这篇文章的原因时发现没有找到系统的介绍的文章,有的介绍如何实现本地项目的图片转码,有的介绍如何实现网络资源的图片转化,但是系统介绍的 ...
随机推荐
- 【linux】的文件按时间排序
> ls -alt # 按修改时间排序 > ls --sort=time -la # 等价于> ls -alt > ls -alc # 按创建时间排序 > ls -alu ...
- 【漏洞学习】slowHTTPtest 慢速 DOS 攻击方法 修复方案
日期:2018-05-28 21:41:59 更新:2019-07-05 23:15:21 作者:Bay0net 介绍:学习一下 slowHTTPtest 的攻击及防御. 0x01. 安装 下载链接 ...
- 001-Django简介与项目创建
简介 django,是用python语言写的开源web开发框架,并遵循MVC设计 主要目的是简便.快速的开发数据库驱动的网站 强调代码复用,有很多第三方插件,强调快速开发和DRY(DoNotRepea ...
- 【Airtest】Airtest中swipe方法兼容不同分辨率的解决方法
使用Airtest中swipe方法由于不同分辨率的手机上滑动的坐标位置不同,所以想要兼容所有的手机,仅仅靠固定坐标就会出现问题 想要兼容所有的手机,可以按照如下思路进行 1.首先获取手机的分辨率,可以 ...
- Struts2框架学习笔记1
1,框架概述 1.1,什么是框架(了解) 将一些重复性的代码进行封装,简化程序员的编程操作,可以使得程序员在编码中把更多的精力放到业务需求的分析和理解上面,相当于一个半成品软件. 1.2,三大框架(掌 ...
- Grass Planting
大致题意: 维护一棵树,支持两种操作: P x y x到y路径上的每条边的值+1:Q x y 询问x到y路径上所有边的值的和.Input第一行两个正整数,N,M表示点数和操作数:接下来N-1行每行两个 ...
- 5.使用github脚本LAZY----几个最好的发行版----自定义终端----基本命令
使用现成的脚本 LAZY * 如果您不想手动设置,可以用这个脚本帮您设置 访问:github.com/arismelachroinos/lscript sudo apt-get git git clo ...
- pkg-config too old的解决方法
linux下安装一些库时,会提示pkg-config too old,可以尝试下面的命令 apt-get install pkg-config
- 【Linux-驱动】驱动策略----信号量
访问共享资源的代码区块叫“临界区”,临界区需要以某种互斥机制加以保护:自旋锁.信号量等.互斥访问:一个执行单元在访问共享资源的时候,其他的执行单元被禁止访问. 信号量:在Liunx中的信号量是一种睡眠 ...
- JavaScript event对象clientX,offsetX,screenX异同
event对象是JavaScript中最重要的对象之一,他代表了各种事件的状态,在各种事件的事件处理中经常用到,比如键盘活动.鼠标活动等等,其中有几个对象官方说的比较模糊,很难理解,这里有必要通俗化的 ...