Data URI 生成器 - 在线文件转 Base64

1. 怎么用

文件模式会按文件自带类型生成；文本模式可手改媒体类型（如文本、矢量图、脚本）。编码切换后重新生成再复制。

1. 选择文件模式或文本模式。
2. 上传文件或粘贴文本；确认媒体类型与编码方式。
3. 复制生成的数据统一资源标识，嵌入超文本或样式。

2. 适用范围

• 小资源（几 KB）内联收益最大：减少请求，首屏更利落。
• 超过约十 KB 的资源内联往往亏——base64 约膨胀三分之一，超大内联拖慢解析。
• 矢量图常优先百分号编码，语义保留更完整、体积也可能更小。
• 邮件模板常需内联图片——许多客户端默认不加载外链图。

3. 两种编码怎么选

base64 适合二进制（位图、字体）；百分号编码适合文本资源（矢量图、样式片段），因为某些字符在标识里有特殊含义。矢量图内联的经典坑：井号必须编码，否则样式会把后面内容当锚点。样式的地址函数用引号包裹时，注意标识内部引号配对，避免截断。

4. 缓存与体积权衡

• 内联资源无法单独缓存——改一个图标等于整页缓存失效。
• 构建工具常对很小的资源自动内联，超过阈值仍发独立文件；本页适合手工决定或调试。
• 复制前看一眼输出长度，异常膨胀往往是选错了编码或误塞了大图。

5. 和 Base64、图片工具的配合

只要纯 Base64 字符串、不要数据统一资源标识前缀时，用 Base64 相关工具即可。图片先压缩或转格式再来本页，能明显缩短标识长度。全程本地，文件与文本不会上传。

6. 安全提示

处理前后各留一份原文副本，方便对照；遇到不确定的边界输入，先缩小样本再放大。团队协作时把本页步骤写进检查清单，比口头约定更不容易漂移。 处理前后各留一份原文副本，方便对照；遇到不确定的边界输入，先缩小样本再放大。团队协作时把本页步骤写进检查清单，比口头约定更不容易漂移。 处理前后各留一份原文副本，方便对照；遇到不确定的边界输入，先缩小样本再放大。团队协作时把本页步骤写进检查清单，比口头约定更不容易漂移。

• 不要把含密钥的配置以数据统一资源标识形式提交到公共仓库。
• 内联脚本标识在部分内容安全策略下会被拦截——先查站点策略。
• 来路不明的标识不要直接贴进生产页，先确认媒体类型与内容。