介绍
在 JavaScript 中,可以使用 Base64来编码和解码字符串。
在本文中,您将介绍现代Web浏览器中可用的btoa和atobJavaScript功能。
前提条件
要跟随这篇文章,你将需要:
- JavaScript 中的字符串的理解. 您可以参阅 How To Work with Strings in JavaScript 以获取更多信息。 * 您可以了解使用 Windows 或 WorkGlobalScope 可用的功能 的理解。
使用 Base64 编码和解码字符串
btoa()和 atob()是Base64辅助函数,是HTML规范的核心部分,可在所有现代浏览器中使用。
注意:这些函数的命名参考了旧的Unix命令,用于将二进制转换为ASCII(btoa)和ASCII转换为二进制(atob)。
btoa() 接收一个字符串并将其编码为 Base64。
假设你有一个字符串,Hello World!并希望将其编码为 Base64。在浏览器的 Web 开发者控制台中,定义字符串,编码它,并显示编码字符串:
1// Define the string
2var decodedStringBtoA = 'Hello World!';
3
4// Encode the String
5var encodedStringBtoA = btoa(decodedStringBtoA);
6
7console.log(encodedStringBtoA);
此代码的输出是含有字母和数字的字符串:
1[secondary_label Output]
2SGVsbG8gV29ybGQh
atob() 接收一个字符串并从 Base64 解码它。
让我们从前面的编码字符串,‘SGVsbG8gV29ybGQh’,并从Base64解码它。
1// Define the string
2var encodedStringAtoB = 'SGVsbG8gV29ybGQh';
3
4// Decode the String
5var decodedStringAtoB = atob(encodedStringAtoB);
6
7console.log(decodedStringAtoB);
此代码的输出显示字符串已被转换回原始消息:
1[secondary_label Output]
2Hello World!
现在,你有两个工具来编码和解码Base64。
探索 Base64 的常见用例
您还可以使用 Base64 以与 HTML、JavaScript 和 CSS 兼容的方式表示二进制数据,例如,您可以使用 Base64 将图像嵌入 CSS 或 JavaScript 文件中。
可以使用 Base64 将输入,如表单数据或 JSON,转换为具有缩小字符集的字符串,该字符串是 URL 安全的,但是,由于某些服务器可以如何解释 plus (+) 和 forward-slash (/) 字符,建议使用 encodeURIComponent 代替。
了解 Base64 的局限性
Base64绝不是一个安全的加密方法。
Base64 也不是一种压缩方法,将字符串编码到 Base64 通常会导致 33% 更长的输出。
结论
在本文中,您被介绍了btoa和atob来编码和解码 Base64 字符串。
<$>[注] 注: Can I Use 记录了已知的问题 处理 UTF-8,并为较旧的浏览器提供了多重文件。
如果您想了解更多关于 JavaScript 的信息,请查看 我们的 JavaScript 主题页面以获取练习和编程项目。