在 JavaScript 中将字符串转换为 base64。btoa 和 atob 已弃用

Question

我最近一直在 VS Code 中处理一些项目，突然开始在我的代码中收到 btoa 和 atob 现已弃用的通知。除了 VS Code 之外，我找不到任何相关资源。如果这是真的，还有什么替代方案呢？

Answer 1

Node btoa() 和 atob() 函数是唯一已被弃用的函数。但是，如果您正在处理 DOM 代码（前端）并看到此已弃用的通知，则可以使用 window 对象来绕过它。

window.atob()

欲了解更多信息

Answer 2

TLDR： Node JS 已弃用这些函数 btoa 和 atob。如果您正在为网络浏览器编写代码，则只需在窗口前面添加此弃用标记即可。

编码：

window.btoa('test') 

结果：dGVzdA==

解码

window.atob('dGVzdA==')

结果：测试

否则，您可以使用“yarn add buffer”或“npm i buffer”安装缓冲区以在浏览器上运行。缓冲区模块的 API 与节点的缓冲区 API 相同。

这是一个在浏览器中使用 javascript 模块的 React 示例，但它可以在任何使用 webpack 或 Parcel 甚至带有脚本 src 的普通 javascript 的现代 javascript 前端应用程序上运行：

//this will run on browser    
import React from "react";
import { Buffer } from 'buffer';
export default function App() {

  const encodeBase64 = (data) => {
    return Buffer.from(data).toString('base64');
  }
  const decodeBase64 = (data) => {
    return Buffer.from(data, 'base64').toString('ascii');
  }

  return <div>
    {'encoded test to base64 = ' + encodeBase64('test')}<br />
    {'decoded dGVzdA== to ascII = ' + decodeBase64('dGVzdA==')}
  </div>;
}

上面的反应钩子将产生：

encoded test to base64 = dGVzdA==
decoded dGVzdA== to ascII = test

btoa()：接受一个字符串，其中每个字符代表一个 8 位字节。如果传递的字符串包含无法用 8 位表示的字符，它可能会中断。可能这就是 btoa 被弃用的原因。

atob()：返回一个字符串，其中每个字符代表一个 8 位字节。

如果您使用的是nodejs，只需将atob和btoa替换为Buffer即可。这是官方文档 Nodejs 中的 Buffers：

//With NodeJS

export const encodeBase64 = (data) => {
    return Buffer.from(data).toString('base64');
}
export const decodeBase64 = (data) => {
    return Buffer.from(data, 'base64').toString('ascii');
}

Answer 3

仍然在 VS Code 中，我查看了已弃用的 btoa(str) 函数的注释。它建议使用以下内容作为替代：

const base64Str = Buffer.from(str, 'utf8').toString('base64');

Answer 4

btoa并且atob仅在 Node.js 中被弃用。如果您在前面加上 ，window.您将摆脱这个弃用标记。

另一方面，如果您尝试在后端使用btoa或，那么您绝对应该使用接口。atobBuffer

参考：

1. https://github.com/microsoft/TypeScript/issues/45566#issuecomment-905057883
2. https://github.com/microsoft/TypeScript/issues/45566
3. https://developer.mozilla.org/en-US/docs/Web/API/btoa（无弃用警告！）