原生 JS 的 Base64 转码

本文介绍如何使用JavaScript原生方法btoa和atob进行Base64编码和解码,特别针对非ASCII码字符的处理,通过结合使用encodeURIComponent和decodeURIComponent方法,确保字符串的正确转换。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

原生 JS 的 Base64 转码

工作中常会用到转换base64,这边做了下总结;

JavaScript 原生提供两个 Base64 相关的方法:
  • btoa():任意值转为 Base64 编码;
  • atob():Base64 编码转为原来的值;

注意:这两个方法不适合非 ASCII 码的字符,会报错。


要将非 ASCII 码字符转为 Base64 编码,必须中间插入一个转码环节:
  • encodeURIComponent()  该方法会转码除了语义字符之外的所有字符,即元字符也会被转码。
Base64 编码转为原来的值时,同样需要转码:
  • decodeURIComponent()  该方法是 encodeURIComponent()方法的逆运算。

示例:

const str = "Hello, world!";
const strToBase64 = btoa(encodeURIComponent(str));
console.log(strToBase64); // SGVsbG8lMkMlMjB3b3JsZCE=
const base64ToStr = decodeURIComponent(atob(strToBase64));
console.log(base64ToStr); // Hello, world!

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值