解析原来浏览器原生支持JS Base64编码解码

内容导读

互联网集市收集整理的这篇技术教程文章主要介绍了解析原来浏览器原生支持JS Base64编码解码，小编现在分享给大家，供广大互联网技能从业者学习和参考。文章包含2586字，纯文字阅读大概需要4分钟。

内容图文

上次给大家分享了如何用js实现剪切板粘贴上传图片，今天跟大家分享下JS Base64编码解码。

1. 基础不牢，选型糟糕

糟糕的技术选型往往源自自身技术广度不足。就在数月前，一个前端HTML字符信息转Base64的需求，我是毫不犹豫去找了个开源的base64.js。使用很简单，浏览器引入该JS文件，然后Base64编码这样：

解码就调用decode方法，如下：

数据准确，功能良好。当时弄完还洋洋得意，以为是个完美的解决。结果，今天发现，尼玛原来浏览器很早就支持了JS Base64加密解密，而上面这种洋洋得意的做法完全就是瞎子点灯——白费蜡！根本就不是一个好的技术选型。

由于技术广度掌握不足，或者说JS基础掌握不牢，导致浪费了大把时间去找Base64的JS语言库，学习其API用法，换来一个冗余完全不需要加载的JS，现在来看，真是个糟糕的技术选型。

2. 原生atob和btoa方法

实际上，从IE10+浏览器开始，所有浏览器就原生提供了Base64编码解码方法，不仅可以用于浏览器环境，Service Worker环境也可以使用。

方法名就是atob和btoa，具体语法如下：

1）Base64解码

语法为（浏览器中）：

var decodedData = window.atob(encodedData);

或者（浏览器或js Worker线程中）：

var decodedData = self.atob(encodedData);

例如：

window.atob('emhhbmd4aW54dQ==');

// 返回：'zhangxinxu'

atob这个方法名称乍一看，很奇怪，不知道这个单词什么意思。我们可以理解为 A to B，也就是从A到B。这里的B指的就是Base64吗？哈哈哈，恭喜你！猜错了！A指的才是Base64，反的，B才是普通字符，普通意思就是low，俗称low B。所以我们这么记忆，Low B，Low B，B表示很Low的普通字符，A才是Base64，和首字母对应关系是反的。

因此，atob表示Base64字符to普通字符，也就是Base64解码。

2）Base64编码

语法为（浏览器中）：

var encodedData = window.btoa(stringToEncode);

或者（浏览器或js Worker线程中）：

var encodedData = self.btoa(stringToEncode);

例如：

window.btoa('zhangxinxu');

// 返回：'emhhbmd4aW54dQ=='

btoa这个方法名称乍一看，很奇怪，不知道这个单词什么意思。我们可以理解为 B to A，也就是从B到A。那B指什么，A指什么呢？和atob方法一样，B指的是low B普通字符串，A指的是Base64字符。

因此，btoa方法表示low B普通字符to Base64字符，也就是Base64编码。

3. IE8/IE9的polyfill

当下，仍有不少PC项目还需要兼容IE9，所以，我们可以专门针对这些浏览器再引入一段ployfill脚本或者一个JS文件即可。

实际使用，我们可以借助IE条件注释无缝对接。也就是HTML中嵌入下面一段代码：

[if IE]表示所有IE浏览器，由于IE10+浏览器已经放弃了著名的IE条件注释的支持，Chrome等浏览器本身就不支持这个IE私有语法，因此，很天然的，上面一段script引入只在IE9-浏览器下有效。而我们本来就希望只IE8，IE9浏览器引入ployfill，于是正好完美衔接上。

也就是原生支持atob和btoa方法的浏览器认为就是一段无需关心的HTML注释，不支持atob和btoa的IE9及其以下浏览器则会加载我们的base64-polyfill.js，使浏览器也支持window.btoa和window.atob这个语法。

以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持脚本之家。

内容总结

以上是互联网集市为您收集整理的解析原来浏览器原生支持JS Base64编码解码全部内容，希望文章能够帮你解决解析原来浏览器原生支持JS Base64编码解码所遇到的程序开发问题。 如果觉得互联网集市技术教程内容还不错，欢迎将互联网集市网站推荐给程序员好友。

内容备注

版权声明：本文内容由互联网用户自发贡献，该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容， 请发送邮件至 gblab@vip.qq.com 举报，一经查实，本站将立刻删除。

内容手机端