JavaScript Base64 编码

Base64编码解码：btoa/atob（仅ASCII/Latin1）、TextEncoder+Uint8Array处理Unicode Base64、btoa(encodeURIComponent(str))中文兼容方案、data URL格式data:image/png;base64,...、ArrayBuffer↔Base64互转 · 难度：入门 · +10XP

JavaScript Base64 —— 编码与解码

Base64是一种将二进制数据转换为ASCII字符串的编码方式，广泛用于data URL、JWT、基本认证等场景。浏览器内置了btoa和atob两个函数。

基本用法

// 编码（Binary to ASCII）
const encoded = btoa('Hello World'); // 'SGVsbG8gV29ybGQ='
// 解码（ASCII to Binary）
const decoded = atob(encoded); // 'Hello World'
// 中文处理：btoa不支持中文，需先编码
const chineseEncoded = btoa(encodeURIComponent('你好'));
const chineseDecoded = decodeURIComponent(atob(chineseEncoded));

动手练习

1. 基础练习：把一张小图片转成data URL（data:image/png;base64,...）。
2. 进阶应用：用Base64编码用户密码（仅用于学习，生产不要用！）。
3. 项目实战：在文件上传前用Base64预览图片。