Base64エンコードとは?仕組み・用途・デコード方法をわかりやすく解説

Webの開発をしていると「Base64エンコード」という言葉を目にすることがあります。しかし「何のためにあるの?」「どういう仕組み?」と疑問を持つ方も多いでしょう。この記事では、Base64の概念から実際の使い方まで、プログラミング初心者でも理解できるようにわかりやすく解説します。

今すぐBase64のエンコード・デコードを試す

⚡ Base64 Encoder/Decoder を使う →

Base64エンコードとは何か

Base64(ベースろくじゅうし)とは、バイナリデータ(画像や音声ファイルなど)を、テキストとして扱える64種類の文字(A〜Z、a〜z、0〜9、+、/)に変換するエンコード方式です。

「エンコード」は「変換する」という意味です。Base64エンコードとは、元のデータを64種類の文字だけで表現できる形式に変換することを指します。

使用する64文字は以下のとおりです:

なぜBase64が必要なのか

コンピューターはすべてのデータを「0と1」のバイナリ形式で扱います。しかし、メールやHTMLなどのテキストベースのプロトコルは、バイナリデータをそのまま扱えない場合があります。

例えば、メールにファイルを添付するとき。ファイルはバイナリですが、メールの本文はテキストです。ここでBase64が活躍します。バイナリデータをテキストに変換することで、テキストしか扱えない場所でもデータを安全に送れるようになります。

Base64の仕組み(図解)

Base64は3バイト(24ビット)のデータを4文字に変換します。

例として「Man」という文字をエンコードしてみましょう。

  1. 「M」「a」「n」をASCIIコードに変換 → 77、97、110
  2. 2進数に変換 → 01001101 01100001 01101110
  3. 6ビットずつに分割 → 010011 010110 000101 101110
  4. 各6ビットを10進数に → 19、22、5、46
  5. Base64テーブルで文字に変換 → T、W、F、u

結果:「Man」→「TWFu」になります。

このように元のデータより約33%サイズが大きくなるのがBase64の特徴です。

Base64の主な用途

1. メールの添付ファイル(MIME)

メールの添付ファイルはBase64でエンコードされてから送信されます。これにより、テキスト形式のメールプロトコル(SMTP)でバイナリファイルを送ることができます。

2. HTMLに画像を埋め込む(Data URI)

画像ファイルをBase64に変換することで、外部ファイルなしにHTMLの中に画像を直接埋め込めます。

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

小さいアイコンやロゴなど、サーバーへのリクエスト数を減らしたいときに便利です。

3. JWT(JSON Web Token)

Webの認証によく使われるJWTは、Base64でエンコードされたヘッダー・ペイロード・署名の3つの部分で構成されています。

4. APIのBasic認証

HTTPのBasic認証では、「ユーザー名:パスワード」をBase64でエンコードしてHTTPヘッダーに含めます。

Authorization: Basic dXNlcjpwYXNzd29yZA==

ただしBase64は暗号化ではなく、簡単にデコードできるため、必ずHTTPSと組み合わせて使用する必要があります。

5. CSSのFont Embedding

Webフォントをbase64でエンコードしてCSSに直接埋め込むことも可能です。外部フォントファイルを読み込まずに済むため、読み込み速度の最適化に使われます。

JavaScriptでBase64を使う方法

ブラウザのJavaScriptには標準でBase64の関数が用意されています。

// エンコード
const encoded = btoa('Hello, World!');
console.log(encoded); // SGVsbG8sIFdvcmxkIQ==

// デコード
const decoded = atob('SGVsbG8sIFdvcmxkIQ==');
console.log(decoded); // Hello, World!

ただしbtoa()は日本語などの非ASCII文字には対応していません。日本語を扱う場合は次のようにします。

// 日本語のエンコード
const text = 'こんにちは';
const encoded = btoa(encodeURIComponent(text)
  .replace(/%([0-9A-F]{2})/g, (_, p1) =>
    String.fromCharCode('0x' + p1)));

// デコード
const decoded = decodeURIComponent(atob(encoded)
  .split('').map(c =>
    '%' + c.charCodeAt(0).toString(16).padStart(2,'0')).join(''));

PythonでBase64を使う方法

import base64

# エンコード
text = "Hello, World!"
encoded = base64.b64encode(text.encode()).decode()
print(encoded)  # SGVsbG8sIFdvcmxkIQ==

# デコード
decoded = base64.b64decode(encoded).decode()
print(decoded)  # Hello, World!

# ファイルをBase64に変換
with open("image.png", "rb") as f:
    img_b64 = base64.b64encode(f.read()).decode()
print(img_b64)

Base64とBase64URLの違い

通常のBase64は「+」「/」「=」を使いますが、URLの中で使うとエンコードが必要になってしまいます。そこでURL・ファイル名に安全な「Base64URL」という亜種があります。

Base64Base64URL
+-(ハイフン)
/_(アンダースコア)
= (パディング)省略可能

JWTはBase64URLを使用しています。

よくある質問

Q. Base64は暗号化ですか?

いいえ。Base64はエンコード(変換)であり、暗号化ではありません。誰でも簡単にデコードできます。セキュリティ目的には使用できません。

Q. Base64にするとファイルサイズはどう変わりますか?

元のデータより約33%(4/3倍)大きくなります。1MBの画像をBase64にすると約1.33MBになります。

Q. =(イコール)が最後に付くのはなぜですか?

Base64は3バイトずつ処理します。データの末尾が3の倍数でない場合、=でパディング(埋め合わせ)します。=は1〜2個付く場合があります。

Q. オンラインでBase64に変換するには?

下のツールを使えば、テキストや画像ファイルをブラウザ上で即座にBase64変換できます。データはサーバーに送信されないので安心です。

Base64のエンコード・デコードを今すぐ試す

⚡ Base64 Encoder/Decoder を使う →