btoa和atob是window对象的两个函数,其中btoa是binary to ascii,用于将binary的数据用ascii码表示,即Base64的编码过程,而atob则是ascii to binary,用于将ascii码解析成binary数据,看一个例子:

// Define the string

var string = 'Hello World!';

// Encode the String

var encodedString = btoa(string);

console.log(encodedString); // Outputs: "SGVsbG8gV29ybGQh"

// Decode the String

var decodedString = atob(encodedString);

console.log(decodedString); // Outputs: "Hello World!"

可以看到,字符串“Hello World!”已被Base64编码和解码。但是,atob和btoa不能编码Unicode字符:

var string = "Hello, 中国!";

window.btoa(string);

那如何用这种方式支持汉字呢?这里我们可以先将带有非Latin1字符的串先用encodeURIComponent编码:

var string = "Hello, 中国!";

//"SGVsbG8lMkMlMjAlRTQlQjglQUQlRTUlOUIlQkQlRUYlQkMlODE="

var encodedString = btoa(encodeURIComponent(string));

var decodedString = decodeURIComponent(atob(encodedString));

console.log(decodedString); //"Hello, 中国!"

注意,编码的过程是先encodeURI,再编码,那么解码的过程应该是先解码,再decodeURI。另外,在使用atob和btoa这两个函数时需要注意的是,IE9是不支持的,在IE11中,用仿真工具切换到IE9模式,然后直接在控制台调用btoa方法:

如果在IE中使用,需要IE版本为10及以上(以下是IE10的效果):

正是因为IE9不支持atob和btoa,我们才需要为兼容IE9而使用无奈之举:使用公共类库:

// Create Base64 Object

var Base64={_keyStr:"ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789+/=",encode:function(e){var t="";var n,r,i,s,o,u,a;var f=0;e=Base64._utf8_encode(e);while(f>2;o=(n&3)<<4|r>>4;u=(r&15)<<2|i>>6;a=i&63;if(isNaN(r)){u=a=64}else if(isNaN(i)){a=64}t=t+this._keyStr.charAt(s)+this._keyStr.charAt(o)+this._keyStr.charAt(u)+this._keyStr.charAt(a)}return t},decode:function(e){var t="";var n,r,i;var s,o,u,a;var f=0;e=e.replace(/[^A-Za-z0-9+/=]/g,"");while(f>4;r=(o&15)<<4|u>>2;i=(u&3)<<6|a;t=t+String.fromCharCode(n);if(u!=64){t=t+String.fromCharCode(r)}if(a!=64){t=t+String.fromCharCode(i)}}t=Base64._utf8_decode(t);return t},_utf8_encode:function(e){e=e.replace(/rn/g,"n");var t="";for(var n=0;n127&&r<2048){t+=String.fromCharCode(r>>6|192);t+=String.fromCharCode(r&63|128)}else{t+=String.fromCharCode(r>>12|224);t+=String.fromCharCode(r>>6&63|128);t+=String.fromCharCode(r&63|128)}}return t},_utf8_decode:function(e){var t="";var n=0;var r=c1=c2=0;while(n191&&r<224){c2=e.charCodeAt(n+1);t+=String.fromCharCode((r&31)<<6|c2&63);n+=2}else{c2=e.charCodeAt(n+1);c3=e.charCodeAt(n+2);t+=String.fromCharCode((r&15)<<12|(c2&63)<<6|c3&63);n+=3}}return t}}

// Define the string

var string = 'Hello World!';

// Encode the String

var encodedString = Base64.encode(string);

console.log(encodedString); // Outputs: "SGVsbG8gV29ybGQh"

// Decode the String

var decodedString = Base64.decode(encodedString);

console.log(decodedString); // Outputs: "Hello World!"

这个自定义的Base64对象可以转码的字符也不仅限于Latin1字符:

var string = "Hello, 中国!";

var encodedString = Base64.encode(string);//"SGVsbG8sIOS4reWbve+8gQ=="

var decodedString = Base64.decode(encodedString);

console.log(decodedString); //"Hello, 中国!"

参考页面:

btoa java,JavaScript用btoa和atob来编码解码Base64相关推荐

  1. javascript用btoa和atob来编码解码Base64

    javascript用btoa和atob来编码解码Base64 btoa和atob是window对象的两个函数,其中btoa是binary to ascii,用于将binary的数据用ascii码表示 ...

  2. JavaScript和C#通用gb2312和utf8编码解码函数简单实现

    1.javascript实现gb2312编码解码 随便看到一段话如下: "老赵的jscex https://github.com/JeffreyZhao/jscex/blob/master/ ...

  3. javascript实现gb2312编码解码

    1.javascript实现gb2312编码解码 随便看到一段话如下: "老赵的jscex https://github.com/JeffreyZhao/jscex/blob/master/ ...

  4. btoa java,java的btoa、atob

    java实现javascript 的 btoa.atob import java.util.regex.Matcher; import java.util.regex.Pattern; public ...

  5. JavaScript window对象之atob()和btoa()

    javascript原生的api本来就支持Base64,但是由于之前的javascript局限性,导致Base64基本中看不中用.当前html5标准正式化之际,Base64将有较大的转型空间,对于Ht ...

  6. Python爬虫:js的btoa和atob和pythonBase64编码解码比对分析

    比对js和py的Base64编码解码,探求一个共通之处 javascript代码 对英文字符进行base64编码解码 var str = 'javascript';// 编码 btoa(str) // ...

  7. js base64编码解码 btoa atob 函数简介

    window.atob(string):解码 用来解码一个已经被base-64编码过的字符串.(参数string: 必需是一个通过 btoa() 方法编码的字符串) window.btoa(strin ...

  8. base64和普通字符串互转---window.btoa window.atob;图片的base64格式

    目录 一.作用 二.使用方法 一.作用 将非ASCLL码数据转换为ASCLL码数据,便于网络传输(某些系统仅支持ASCLL编码): 二.使用方法 1)测试代码: //window.btoa(" ...

  9. window.btoa()方法;使字符编码成base64的形式

    atob() 函数能够   解码  通过base-64编码的字符串数据.相反地, btoa() 函数能够从二进制数据"字符串" 创建 一个base-64编码的ASCII字符串. 转 ...

最新文章

  1. Java 洛谷 P1059 [NOIP2006 普及组] 明明的随机数
  2. Kyoya and Photobooks
  3. SuSe防火墙iptables配置
  4. 20190906:(leetcode习题)Shuffle an Array
  5. java 文件分割器_Java分割器
  6. Referrer Policy 介绍
  7. python怎么重新运行,如何让python程序重新运行其
  8. word在html中预览,在网页中预览word和excel
  9. 国内O2O运营模式逐渐改变我们生活方式
  10. 龙格库塔格式的计算精度推导
  11. AWE /3GB 内存扩展技术
  12. 《塞尔达传说》与氛围游戏的兴起:在游戏中感受禅意
  13. SQLyog 新建mysql链接时 错误号码 2058
  14. idea maven拉取报错failed to transfer from http://0.0.0.0/ during a previous attempt
  15. 【算力网络】算力网络的技术创新——绿色与安全关键技术
  16. cortex m3的操作模式和状态
  17. 文本匹配模型ESIM
  18. 15天深度复习JavaWeb的详细笔记(四)——HTML、CSS
  19. SAP se11透明表添加字段时报错:字段级的结构更改(转换表xxxxxx)
  20. 组态王图素制作_组态王实例教程入门

热门文章

  1. 稳恒nb-iot模块WH-NB73 UDP透传和透传云使用说明
  2. win10 Docker Toolbox 默认路径不能写问题
  3. BZOJ4001[TJOI2015]概率论(数学、期望、生成函数、卡特兰数)
  4. 项目里面遇到的问题和解决方案的记录
  5. WPF Page close
  6. 数据访问类用静态方法。。。当多个人调用时返回值会返回别人的?。。。特别奇怪的问题???...
  7. tps波动很大的原因_期货揭秘:价格的波动规律(2)
  8. ehcache 的 diskStore path
  9. 连接Oracle时报错ORA-12541: TNS: 无监听程序
  10. 第二阶段第八天站立会议