← 返回博客列表
技术基础2026-03-10 · 7 分钟 阅读

什么是 Base64 编码?原理、用途与在线转换详解

Base64 是一种将二进制数据转换为 ASCII 文本的编码方案,广泛用于电子邮件附件传输、图片嵌入 HTML/CSS、API 数据传输等场景。本文从原理到实战带你彻底搞懂 Base64。

# Base64# 编码# 前端开发# Web

什么是 Base64?

Base64 是一种基于 64 个可打印字符来表示二进制数据的编码方案。这 64 个字符包括:大写字母 A-Z(26 个)、小写字母 a-z(26 个)、数字 0-9(10 个)以及加号 + 和斜杠 /(2 个),共计 64 个字符。因此得名 "Base64"。

这种编码方式最早被用于 MIME(多用途互联网邮件扩展)标准,用于在只能传输 ASCII 文本的协议中安全地传输二进制数据(如图片、文件等)。

Base64 的工作原理

Base64 编码的核心是"3字节 → 4字符"的转换逻辑:

1. 将原始二进制数据每 3 个字节(3 × 8 = 24 位)分为一组

2. 将这 24 位拆分为 4 组,每组 6 位

3. 每个 6 位数值(0-63)对应一个 Base64 字符表中的字符

例如,字符串 Man 的 Base64 编码:

  • M = 01001101
  • a = 01100001
  • n = 01101110
将 24 位拼接后按 6 位分组:010011 010110 000101 101110,对应 Base64 字符表分别是 T、W、F、u,所以 Man 的 Base64 编码结果是 TWFu

Base64 的主要使用场景

1. 图片嵌入到 CSS/HTML(Data URI)

这是前端开发中最常见的 Base64 用途之一。通过将图片转成 Base64,可以直接将图片数据写到 CSS 或 HTML 中:

``css

.icon {

background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAA...');

}

` 优点:减少 HTTP 请求数量,对于小图标和装饰性图片非常有效。 缺点:Base64 编码后体积会增大约 33%,因此不适合用于大图片。

2. APIToken 与身份认证

HTTP 基本认证(Basic Authentication)使用 Base64 编码传输用户名和密码:

`

Authorization: Basic dXNlcm5hbWU6cGFzc3dvcmQ=

`

注意:Base64 并不是加密!任何人都可以解码,因此必须配合 HTTPS 使用。

3. JWT(JSON Web Token)

现代应用广泛使用的 JWT Token 其实也是 Base64URL(Base64 的变体,用 - 代替 +,用 _ 代替 /)编码的三段结构:

`

Header.Payload.Signature

`

每一段都是 Base64URL 编码后的 JSON 数据。

4. 电子邮件附件传输

Base64 的最初设计场景就是邮件传输。SMTP 协议只能传输 7 位 ASCII 文本,通过 MIME 标准和 Base64 编码,我们可以在邮件中安全传输图片、文档等二进制附件。

在线 Base64 工具推荐

如果你需要快速进行 Base64 编码/解码,不需要复杂的环境配置,可以直接使用我们的在线工具:

  • 图片转 Base64 工具:支持拖拽上传,一键将 PNG、JPG、SVG 等图片转换为 Base64 Data URI,同时支持将 Base64 解码还原为图片并下载。

JavaScript 中的 Base64

在现代浏览器和 Node.js 中,可以直接使用内置函数进行 Base64 操作:

`javascript

// 编码(纯 ASCII 字符)

const encoded = btoa('Hello, World!'); // SGVsbG8sIFdvcmxkIQ==

// 解码

const decoded = atob('SGVsbG8sIFdvcmxkIQ=='); // Hello, World!

// 注意:对于中文等非 ASCII 字符,需要先进行 URI 编码

const encodeChinese = btoa(unescape(encodeURIComponent('你好')));

``

Base64 与加密的区别

这是一个非常常见的误区:Base64 不是加密算法,只是一种编码方式

|--------|--------|--------------|

对比项Base64加密(如 AES)
是否可逆完全可逆需要密钥才可逆
是否需要密钥不需要需要
用途数据格式转换保护数据安全
体积变化增大约 33%通常有填充,体积增加
如果你需要真正的数据加密,应该使用 MD5(单向)、SHA、AES 等密码学算法,而不是 Base64。

总结

Base64 是一种简单而实用的编码方式,其核心价值在于:将任意二进制数据转换为纯文本,使其能在只支持文本传输的环境中安全流通。理解 Base64 的工作原理和适用场景,是每个 Web 开发者的必备知识。

W

woshiit 技术团队

woshiit AI 导航 · 原创内容

更多文章

技术分享

SBTI人格测试:超越MBTI的15维度性格分析工具

12分钟

AI 工具

女娲.skill:用AI复刻大师思维,与乔布斯、马斯克深度对话

8 分钟

信息安全

MD5 是什么?详解 MD5 加密算法的原理与安全性

8 分钟

技术基础

URL 编码完全指南:为什么 URL 中的中文会变成 %E4%B8%AD

6 分钟