图片转 Base64

将图片拖放或者粘贴到虚线区域

如何使用图片转 base64 工具?

轻松两步

  1. 点击虚线区域的“选择一张图片”按钮,或者直接从电脑本地拖拽一张图片到虚线区域
  2. 点击“复制”按钮,将会成功复制转换后 base64 编码到您的剪切板

什么是图片的 base64 编码格式?

图片转 base64 就是将图片转为 base64 编码格式的字符串,这个新生成的字符串包含了所有的图片信息。对于 html 的img标签来说,可以直接替换src属性值,仍然可以渲染出图片。

您可以这样替换图片地址:

原来

<img src="https://www.mozilla.org/media/protocol/img/logos/firefox/logo-sm.f26fdae37f50.png" />

现在(效果和使用原地址是一样的)

<img src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAEAAAABACAMAAACd..." />

为什么需要将图片转为 base64?

  1. 减少 http 请求。网页中的每张图片都需要一个 http 来请求下载,使用 base64 可以随着 html 一同下载,减少一次 http 请求。特别是很小的图片,很适合转成 base64 格式直接嵌入到 html 中
  2. 减少内存占用。base64 格式是文本格式,内存占用小,降低了服务器消耗
  3. 引入方便。网页开发中经常需要处理静态资源的路径,路径引用会很混乱,如果使用 base64 编码直接嵌入,就不用担心路径问题