一张表对号入座
| 你要做什么 | 怎么做 | 用这个 |
|---|---|---|
| 接口或日志里出现一长串没见过的字符，怀疑是 Base64 | 整段贴进去解码，能还原成正常内容的就可以确认 | Base64 编解码 |
| 要把图片、文件塞进文本协议里传输 | 邮件附件、JSON 字段、XML 都要求纯文本，先编码再传输，对面拿到再解码 | Base64 编解码 |
| 想把小图片直接嵌进 HTML 或 CSS | 转成 data URI 写在 src 里，省一次 HTTP 请求，适合几 KB 的图标 | 图片转 Base64 |
| URL 里带中文或特殊字符就报错 | 那是百分号编码（URL 编码）的活，和 Base64 是两套不同的编码 | URL 编码解码 |
| 解码出来中文是乱码 | 编码那一端用的不是 UTF-8，统一按 UTF-8 重新编码即可 | Base64 编解码 |
Base64 是什么：四个要点记住它
它用 64 个字符表示一切数据
大写 A-Z、小写 a-z、数字 0-9 共 62 个，再加 + 和 / 正好 64 个——所以叫 Base64。任何二进制数据都能用这 64 个字符写成一行纯文本，这是它能塞进 JSON、邮件、URL 的原因。
原理就一句话：3 字节变 4 字符
每取 3 个字节（24 位），切成 4 组各 6 位，每组的值去字母表里查一个字符。原数据长度不是 3 的倍数时，末尾补 1 个或 2 个 = 占位，解码时自动去掉。
体积会涨三分之一
3 字节变成 4 个字符，编码结果约是原大的 4/3。一张 300KB 的图编完约 400KB——这是 Base64 最大的代价，所以它只适合小数据。
它是编码，不是加密
Base64 不提供任何保护：没有密钥，规则公开，谁拿到字符串都能一步解回原文。把密码、token 编成 Base64 不等于打码，别用它保护任何东西。
为什么你的 Base64 老是出问题
十有八九是下面五个原因之一，逐个对照能省掉大部分排查时间：
- 编码端字符集不是 UTF-8：中文按 GBK 编码后再转 Base64，用 UTF-8 解出来就是乱码，反之也一样。
- 把 + 和 / 直接放进 URL：这两个字符在 URL 里分别是空格和路径分隔，会被直接改写，放 URL 前要先做 URL 编码。
- 把二进制结果当文本看：图片、压缩包解码出来是二进制，显示成乱码是正常的，要另存为文件再用对应软件打开。
- 大图硬转 data URI：几十 KB 以上的图嵌进页面，HTML 变大、没法缓存、每次打开都要重新解码，反而更慢。
- 拿 Base64 当加密用：它没有任何保护作用，敏感信息编一遍照样是明文，该加密要用正经的加密算法。
Base64 和 URL 编码，别搞混
两者都叫「编码」，用途完全不同：
- Base64：把任意二进制变成一行文本，解决「文本协议传不了二进制」的问题，比如把图片塞进 JSON。
- URL 编码（百分号编码）：把 URL 里不安全的字符转成 %XX 形式，解决「URL 里出现中文、空格、& 就出错」的问题。
认错场景只会白折腾：中文进 URL 该用 %E4%B8%AD 的地方塞进了一长串 Base64，该用 Base64 的图片数据变成一串 %XX——两者互救不了。
三条实用建议
- Base64 只当传输载体，别当存储格式：落库、存文件都用原始二进制，读取时再编码。
- data URI 只用于小图：几 KB 的图标、小背景可以嵌进 HTML/CSS；内容图、头像一律用真实地址，能被缓存和 CDN 加速。
- 敏感数据只用本地工具：含 token、个人信息的字符串别粘到陌生网站，本站工具全部在浏览器里跑，断网也能用。
常见问题
Base64 是加密吗？
不是。Base64 没有密钥、规则完全公开，任何人都能一步解回原文，等于明文。别用它保护密码、token 或任何敏感信息，该加密要用正经的加密算法。
为什么编码后体积变大了？
每 3 字节编成 4 个字符，结果约是原大的 4/3，涨了三分之一左右。传输带宽敏感、或数据量大的场景，要先想清楚这个代价。
结尾的 = 号是什么意思？
补位用的。原始字节数不是 3 的倍数时，算法会在末尾补 1 个或 2 个 =，解码时按规则去掉，不影响还原出的内容。
为什么解出来是乱码？
九成是编码端的字符集不是 UTF-8。中文按 GBK 编码后再转 Base64，用 UTF-8 解出来就是乱码；两端统一用 UTF-8 就正常了。
图片转 Base64 有什么代价？
体积涨三分之一、每次打开页面都要重新解码、图片没法被缓存和 CDN 加速。只建议几 KB 以内的小图标、小背景用；内容图、头像一律用真实图片地址。
数据会上传到服务器吗？
不会。编码、解码、图片互转全部在你的浏览器里完成，断网也能用，含 token 的字符串可以放心处理。
配着站内工具一起用
编解码、图片互转还会顺手用到这几个本地工具：Base64 编解码（文本与二进制互转）、图片转 Base64（嵌进 HTML/CSS，或从 data URI 还原成图）、URL 编码解码（中文进 URL 前先过一遍）、JSON 格式化（JSON 里嵌 Base64 图时先美化再看结构）。