如何在 JavaScript 中使用 Base64 编码和解码字符串

介绍

在 JavaScript 中,可以使用Base64对字符串进行编码和解码。

在本文中,您将了解现代 Web 浏览器中可用btoaatobJavaScript 函数。

先决条件

要阅读本文,您需要:

使用 Base64 编码和解码字符串

btoa()atob()是两个 Base64 辅助函数,它们是 HTML 规范的核心部分,可在所有现代浏览器中使用。

注意:这些函数的命名参考了用于将二进制转换为 ASCII (btoa) 和将 ASCII 转换为二进制 (atob) 的旧 Unix 命令。但是,“这些函数的输入和输出都是Unicode字符串”。

btoa() 接受一个字符串并将其编码为 Base64。

假设您有一个字符串"Hello World!",并希望将其编码为 Base64。在浏览器的 Web 开发人员控制台中,定义字符串、对其进行编码并显示编码后的字符串:

// Define the string
var decodedStringBtoA = 'Hello World!';

// Encode the String
var encodedStringBtoA = btoa(decodedStringBtoA);
console.log(encodedStringBtoA);

这段代码的输出是一串包含字母和数字的字符串:

Output
  • SGVsbG8gV29ybGQh

atob() 接受一个字符串并从 Base64 解码它。

让我们从之前的编码字符串中取出'SGVsbG8gV29ybGQh',并从 Base64 解码它。在浏览器的 Web 开发人员控制台中,定义字符串,对其进行解码并显示解码后的字符串:

// Define the string
var encodedStringAtoB = 'SGVsbG8gV29ybGQh';

// Decode the String
var decodedStringAtoB = atob(encodedStringAtoB);
console.log(decodedStringAtoB);

此代码的输出显示字符串已转换回其原始消息:

Output
  • Hello World!

现在,您有两个用于编码和解码 Base64 的工具。

探索 Base64 的常见用例

您还可以使用 Base64 以与 HTML、JavaScript 和 CSS 兼容的方式表示二进制数据。例如,您可以使用 Base64 在 CSS 或 JavaScript 文件中嵌入图像。

可以使用 Base64 将输入(如表单数据或 JSON)转换为具有 URL 安全的简化字符集的字符串。但是,由于某些服务器可能会如何解释加号 ( +) 和正斜杠 ( /) 字符,因此建议encodeURIComponent改用。

了解 Base64 的限制

Base64 绝不是一种安全的加密方法。

Base64 也不是一种压缩方法。将字符串编码为 Base64 通常会导致输出延长 33%。

结论

在这篇文章中,您介绍了btoaatob编码和解码Base64编码字符串。

如果您想了解有关 JavaScript 的更多信息,请查看我们的 JavaScript 主题页面以获取练习和编程项目。

觉得文章有用?

点个广告表达一下你的爱意吧 !😁