js中的blob,base64,url之间的关系

js的base64编码和解码

英文是这样的:// atob() 将base64解码
// btoa() 将字符串转码为base64
var str = ‘javascript‘;
window.btoa(str)
//转码结果 "amF2YXNjcmlwdA=="
window.atob("amF2YXNjcmlwdA==")
//解码结果 "javascript"

中文需要特殊一下。需要用到转码  encodeURIComponent  和   decodeURIComponent

console.log(window.btoa(encodeURIComponent("哈哈")))
console.log(decodeURIComponent(window.atob("JUU1JTkzJTg4JUU1JTkzJTg4")))
JUU1JTkzJTg4JUU1JTkzJTg4 哈哈

base64 转 blob 对象,文件上传

/**
* base64 转 blob 对象,文件上传
 * 转载自:http://blog.csdn.net/hsany330/article/details/52575459
 * @param dataURI
 * @returns {Blob}
 */
function dataURItoBlob(dataURI) {
    var byteString = atob(dataURI.split(‘,‘)[1]);
    var mimeString = dataURI.split(‘,‘)[0].split(‘:‘)[1].split(‘;‘)[0];
    var ab = new ArrayBuffer(byteString.length);
    var ia = new Uint8Array(ab);
    for (var i = 0; i < byteString.length; i++) {
        ia[i] = byteString.charCodeAt(i);
    }
    return new Blob([ab], {type: mimeString});
}

原文地址:https://www.cnblogs.com/coder-lzh/p/9545315.html

时间: 2024-10-16 12:03:10

js中的blob,base64,url之间的关系的相关文章

js中从blob提取二进制

文章结构: 一.所遇到的问题 二.解决方法 一. 服务器端通过websocket向浏览器端传输图片(二进制),需要根据不同的图片把图片显示在不同的位置,可行的一个方法是先把图片转化成二进制数组,再把二进制数组和一个字节的图片标识拼接在一块传输给浏览器端,最后在浏览器端拆分.找了好久才找到一些js处理二进制的相关方法,就在此记录一下. 二. 1.服务器端二进制拼接: public byte[] mergeByte(byte[] b1,byte[] b2) { byte[] b3=new byte[

js事件、Js中的for循环和事件的关系、this

一.js事件  1.事件 用户在网页中所触发的行为 鼠标滑动种类很多,键盘.表单特列: 点击:onclick 鼠标进入:onmouseenter 鼠标离开:onmouseleave 鼠标悬浮:onmouseover  鼠标移除:onmouseout 鼠标按下:onmousedown 鼠标抬起:onmouseup 鼠标移动:onmousemove 表单聚焦:onfocus 表单失去焦点:onblur 浏览器加载完成:onload js事件是一直存在的,可以绑定方法,也可以不绑定,如果没有绑定,事件

js中关于Blob对象的介绍与使用

blob对象介绍 一个 Blob对象表示一个不可变的, 原始数据的类似文件对象.Blob表示的数据不一定是一个JavaScript原生格式 blob对象本质上是js中的一个对象,里面可以储存大量的二进制编码格式的数据. 创建blob对象 创建blob对象本质上和创建一个其他对象的方式是一样的,都是使用Blob() 的构造函数来进行创建. 构造函数接受两个参数: 第一个参数为一个数据序列,可以是任意格式的值. 第二个参数是一个包含两个属性的对象{ type: MIME的类型, endings: 决

JS中基本类型与包装类型的关系

对于JS中一些类型的转化的东西,自己测试并得出的结论,有错误的地方请大大们留言. 不多废话,直接贴代码,测试请直接拷贝全部代码: <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"> <title>E

js中__proto__和prototype的区别和关系?

_proto__(隐式原型)与prototype(显式原型) 1.是什么 显式原型 explicit prototype property: 每一个函数在创建之后都会拥有一个名为prototype的属性,这个属性指向函数的原型对象.Note:通过Function.prototype.bind方法构造出来的函数是个例外,它没有prototype属性.(感谢 @陈禹鲁 同学的答案让我知道这一点) NOTE Function objects created using Function.prototy

java中的面向对象和类之间的关系

1.面向对象 a.分析问题中需要用到哪些类以及对象 b.分析以上类中或对象中应该具有哪些属性及方法 c.分析类之间的关系 (合适的方法应该出现在合适的类中) 2.举例:模板-实物 a.白板笔 b.员工(年龄.姓名.性别.工作岗位) (显示姓名,年龄,修改姓名,修改年龄,变更工作岗位) (区分对象:一般通过方法是无法区分对象的,通过属性可以区分对象) 3.类与对象 a.类是具有共同特征的一类事物的一个抽象 b.对象是这个类具体的某一个实例 4.类(对象)之间的4种关系 a.依赖关系(Depende

RAC中SID,instance_number,thread#,undotbs之间的关系

一.参数节选 下面是从一个2节点11gR2 RAC节选的参数文件内容:...... GZYT1.instance_number=1GZYT2.instance_number=2 ...... GZYT1.thread=1GZYT2.thread=2GZYT1.undo_tablespace='UNDOTBS1'GZYT2.undo_tablespace='UNDOTBS2' 参数文件中参数的格式是:x1.x2=x3,其中x1表示的是SID(System Identifier),x2表示的具体参数

js中的blob

什么是Blob? Blob 是什么? 这里说的是一种Javascript的对象类型. oracle 中也有类似的栏位类型. 在 [JS进阶] HTML5 之文件操作(file) 这一篇中用到了File对象,而实际上 file 对象只是 blob 对象的一个更具体的版本,blob 存储着大量的二进制数据,并且 blob 的 size 和 type 属性,都会被 file 对象所继承. 所以, 在大多数情况下,blob 对象和 file 对象可以用在同一个地方,例如,可以使用 FileReader

Js中parentNode,parentElement,childNodes,children之间的区别

转载自  http://www.jb51.net/article/43730.htm parentElement 获取对象层次中的父对象.  parentNode 获取文档层次中的父对象.  childNodes 获取作为指定对象直接后代的 HTML 元素和 TextNode 对象的集合.  children 获取作为对象直接后代的 DHTML 对象的集合.