1.base64转blob(二进制数据)

/**
* 将以base64的图片url数据转换为Blob
* @param urlData 用url方式表示的base64图片数据
*/
function convertBase64UrlToBlob(urlData){
var arr = urlData.split(','), mime = arr[0].match(/:(.*?);/)[1],
bstr = atob(arr[1]), n = bstr.length, u8arr = new Uint8Array(n);
while(n--){
u8arr[n] = bstr.charCodeAt(n);
}
return new Blob([u8arr], {type:mime});
}

2.blob转base64

/**
* 借助FileReader实现转化
* return base64Url
*/
function blobToDataURL(blob) {
let a = new FileReader();
a.onload = function (e) {
return e.target.result;
}
a.readAsDataURL(blob);
}

blob将图片以二进制数据的形式传给后台,据说是更加友好,我没有进行过多研究。

写在最后

  哪位大佬如若发现文章存在纰漏之处或需要补充更多内容,欢迎留言!!!

相关推荐:

 

base64和Blob互相转换的更多相关文章

  1. js实现图片的Blob base64 ArrayBuffer 的各种转换

    一.相关基础知识 构造函数 FileReader() 返回一个新构造的FileReader 事件处理 FileReader.onabort  处理abort事件.该事件在读取操作被中断时触发. Fil ...

  2. js实现图片资源、blob、base64的各种场景转换

    文件转babase64 function getImgToBase64(url,callback){//将图片转换为Base64 var canvas = document.createElement ...

  3. JS实现图片base64转blob对象,压缩图片,预览图片,图片旋转到正确角度

    base64转blob对象 /** 将base64转换为文件对象 * @param {String} base64 base64字符串 * */ var convertBase64ToBlob = f ...

  4. python base64 编解码,转换成Opencv,PIL.Image图片格式

    二进制打开图片文件,base64编解码,转成Opencv格式: # coding: utf-8 import base64 import numpy as np import cv2 img_file ...

  5. Base64转Blob

    最近碰见一个问题,a链接的href为base64,但在chrome下载时显示下载失败,经查询,base64过大会在某些浏览器上下载失败(如新版chrome),解决方法是将base64转为blob fu ...

  6. PIL.Image与Base64 String的互相转换

    https://www.jianshu.com/p/2ff8e6f98257 PIL.Image与Base64 String的互相转换 mona_alwyn 2018.01.18 19:02* 字数 ...

  7. base64 和 Blob 相互转换

    Base64 to Blob function dataURLtoBlob(dataurl) { var arr = dataurl.split(','), mime = arr[0].match(/ ...

  8. 图片和base64编码字符串 互相转换,图片和byte数组互相转换

    图片和base64编码字符串 互相转换 import sun.misc.BASE64Decoder; import sun.misc.BASE64Encoder; import java.io.*; ...

  9. 图片预览(base64和blob:图片链接)和ajax上传、下载(带进度提示)

    直接上代码 html和js <!DOCTYPE html> <html> <head> <meta name="viewport" con ...

随机推荐

  1. Mysql系列(十一)—— 性能分析其他常用监控

    show status show status可以查询显示出当前mysql server的状态信息.该语句不需要任何权限. 对于show status可以时用like子句,模糊检索需要的状态信息.如: ...

  2. 检测代码潜在bug和质量之SonarQube

    参数使用 项目分析参数可以在多个地方设置,继承关系如下: 全局分析参数,通过Web UI设置,作用于所有项目(配置–>通用–>通用中设置) 项目分析参数,通过WebUI设置,覆盖全局参数( ...

  3. pom.xml管理jar包——安全性框架配置文件

    <properties> <project.build.sourceEncoding>UTF-8</project.build.sourceEncoding> &l ...

  4. 深浅赋值+orm操作+Django-admin简单配置

    知识点 深浅copy 浅值深id orm操作 ManyToManyField 虚拟字段 告诉Django orm 自动帮你创建第三张表 查询的时候可以借助该字段跨表 外键属性可赋值外联对象 Model ...

  5. vue 的 Class 与 Style 绑定

    操作元素的 class 列表和内联样式是数据绑定的一个常见需求.因为它们都是属性,所以我们可以用 v-bind 处理它们:只需要通过表达式计算出字符串结果即可.不过,字符串拼接麻烦且易错.因此,在将 ...

  6. sqlldr导入数据取消回显记录条数

    之前在脚本中使用sqlldr导入数据时,如果表的数据量较大的话,会使日志文件变得极大,之后在网上查找了很久,才在一个偶然的机会找到这个参数 silent=all 但是最近发现这样写有个问题,就是加了这 ...

  7. Designing Data-Intensive Applications笔记

    <Designing Data-Intensive Applications>书看完很久了,前段时间陈皓来公司技术分享也推荐了这本书.读起来酣畅淋漓,写篇系统总结的意愿强烈,无耐内容属实太 ...

  8. maven仓库报错 sqljdbc4、ojdbc6、tomcat-jdbc-8.5.14

    报错:Cannot resolve com.microsoft.sqlserver:sqljdbc4:4.0  和  Missing artifact com.microsoft.sqlserver: ...

  9. linux部署docker镜像

    安装git yum install git 生成ssh秘钥 cat ~/.ssh/id_rsa.pub //查看是否有秘钥 ssh-keygen -t rsa -C "" //生成 ...

  10. 学Redis

    Redis 简介 Redis 是完全开源免费的,遵守 BSD 协议,是一个高性能的 key - value 数据库 Redis 与 其他 key - value 缓存产品有以下三个特点: Redis ...