图片转 Base64
拖进一张图，选你实际需要的输出形态 —— 完整 Data URI、纯字符串、CSS 规则、HTML 标签或 JSON 值 —— 然后复制。
图片用 FileReader 在本地读取，不会上传。
什么时候会用到
- 把一个小图标内联进样式表或 HTML 模板，省掉一次网络请求。
- 通过只接受字符串的 JSON 接口发送图片。
- 把占位图直接嵌进构建产物，让它脱离资源目录也能用。
别的 Base64 工具为什么在这里失败
多数工具只给一种输出形态，剩下的要你手工把前缀切掉 —— 这一步很容易切错，而且切错了看不出来。
折行要么永远开着、要么永远关着。需要满足 MIME 风格消费者的字符串，用起来就不对。
体积代价从来不显示，于是有人内联了一张 200 KB 的照片，然后不明白页面为什么变慢了。
常见问题
多大以内内联才划算？
Base64 比二进制大约多 33% 字节，而且它无法单独缓存、压缩效果也更差。经验值是 4 KB 以内内联 —— 图标和很小的 logo。超过约 10 KB 之后，多出的字节和失去的缓存通常比省下的那次往返更贵。
我该选哪种输出格式？
给 src 属性或 fetch 调用用完整 Data URI；接口只接受载荷、MIME 由它自己提供时用纯字符串；值直接写进样式表时用 CSS 那个选项，因为它连引用和引号都带上了。
为什么是 76 字符折行？
那是 MIME 规范对编码内容规定的行长。有些解析器至今仍强制要求，会拒绝更长的行。如果你的消费方是现代的 JSON 解析器或浏览器，单行输出更简单也更合适；折行选项是为那些严格场景准备的。
转换时我的图片会被上传吗？
不会。文件用 FileReader 读取并在内存中编码。代码里根本不存在上传路径，你可以在 Network 面板验证：转换一张 5 MB 的图片，不产生任何请求。