Base64エンコードとは？仕組み・使い方・変換方法をわかりやすく解説

Base64エンコードの仕組み、なぜ必要なのか、メール・Data URI・APIでの使い方、エンコード・デコードの方法、よくあるトラブルまで初心者向けに徹底解説します。

Base64エンコードとは何か

Base64とは、バイナリデータ（画像・ファイル・任意のバイト列）をASCII文字列に変換するエンコード方式です。名前の「64」は、変換後に使われる文字が64種類であることに由来します。

具体的には、以下の64文字（＋パディング用の =）だけを使ってデータを表現します。

A-Z（26文字）
a-z（26文字）
0-9（10文字）
+, /（2文字）
=（パディング用）

たとえば「Hello」という文字列をBase64エンコードすると、SGVsbG8= という文字列になります。

元のテキスト: Hello
Base64エンコード後: SGVsbG8=

一見すると暗号のように見えますが、Base64は暗号化ではありません。誰でも簡単にデコード（元に戻す）できます。あくまで「データの表現形式を変換する」ためのものです。

なぜBase64が必要なのか

「なぜわざわざ変換する必要があるのか？」という疑問は当然です。Base64が必要になる理由は、テキストしか扱えない場面でバイナリデータを送りたいときがあるからです。

テキスト専用プロトコルの制約

インターネットの初期に設計されたプロトコル（SMTPなど）は、ASCII文字（7ビット）しか扱えませんでした。画像や実行ファイルなどのバイナリデータをそのまま送ると、途中で文字化けしたりデータが壊れたりします。

Base64を使えば、どんなバイナリデータでも安全なASCII文字列に変換できるため、テキスト専用の経路でも問題なくデータを送受信できます。

主な利用シーン

利用シーン	用途	具体例
メール添付	MIMEエンコード	画像やPDFをメールに添付
Data URI	HTML/CSSに画像を埋め込み	`data:image/png;base64,...`
API通信	JSONにバイナリデータを含める	画像アップロードAPI
Basic認証	認証情報の送信	`Authorization: Basic dXNlcjpwYXNz`
設定ファイル	バイナリデータの格納	SSH鍵、証明書

Base64エンコードの仕組み

Base64がどのようにデータを変換するのか、ステップごとに見てみましょう。

ステップ1: バイナリに変換

まず、元のデータをバイト列（8ビット単位）に変換します。

"Man" → M(77) a(97) n(110)
→ 01001101 01100001 01101110

ステップ2: 6ビットごとに分割

8ビットの並びを6ビットごとに区切り直します。

01001101 01100001 01101110
↓ 6ビットに再分割
010011 010110 000101 101110

ステップ3: Base64テーブルで変換

6ビットの各値（0〜63）をBase64の文字テーブルに照らし合わせて変換します。

010011 → 19 → T
010110 → 22 → W
000101 → 5  → F
101110 → 46 → u

結果: "Man" → "TWFu"

パディング（= の役割）

元のデータが3バイトの倍数でない場合、末尾に = を追加して長さを調整します。

元のバイト数	パディング
3の倍数	なし
余り1バイト	`==`
余り2バイト	`=`

"M"   → TQ==（1バイト → ==で埋める）
"Ma"  → TWE=（2バイト → =で埋める）
"Man" → TWFu（3バイト → パディング不要）

データサイズの増加

Base64エンコードすると、データサイズは約33%増加します。3バイトのデータが4文字（4バイト）に変換されるためです。

元のサイズ × 4/3 ≒ Base64後のサイズ

たとえば100KBの画像をBase64に変換すると約133KBになります。この点はパフォーマンスを考慮する際に重要です。

実際の使い方 — ユースケース別解説

メール（MIME Base64）

電子メールで画像やファイルを添付するとき、MIMEという規格でBase64エンコードが使われます。

Content-Type: image/png
Content-Transfer-Encoding: base64

iVBORw0KGgoAAAANSUhEUgAAAAUA
AAAFCAYAAACNbyblAAAAHElEQVQI
12P4//8/w38GIAXDIBKE0DHxgljN
BAAdrpVAAAAASUVORK5CYII=

メールソフトは自動的にこれを処理するため、ユーザーが意識することはほとんどありません。

Data URI（HTML/CSSへの画像埋め込み）

小さな画像をHTMLやCSSに直接埋め込むことで、HTTPリクエストの数を減らせます。

<!-- 通常の画像読み込み -->
<img src="/images/icon.png" alt="アイコン">

<!-- Base64で埋め込み（Data URI） -->
<img src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUg..." alt="アイコン">

/* CSSでの使用例 */
.icon {
  background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz...);
}

Data URIの使いどころ:

数KB以下の小さなアイコンやロゴ
CSSスプライトの代替
メール用HTMLテンプレート（外部画像を参照できない場合）

避けるべき場面:

大きな画像（サイズが33%増えるうえ、キャッシュが効かない）
頻繁に更新される画像

API通信でのバイナリデータ送信

REST APIでJSONを使って画像データを送る場合、Base64が一般的です。

{
  "name": "profile.jpg",
  "content_type": "image/jpeg",
  "data": "iVBORw0KGgoAAAANSUhEUgAAAAUA..."
}

// JavaScriptでファイルをBase64に変換してAPIに送信
async function uploadImage(file) {
  const reader = new FileReader();
  reader.readAsDataURL(file);

  reader.onload = async () => {
    const base64Data = reader.result.split(',')[1]; // "data:..." 部分を除去
    const response = await fetch('/api/upload', {
      method: 'POST',
      headers: { 'Content-Type': 'application/json' },
      body: JSON.stringify({ data: base64Data })
    });
  };
}

HTTP Basic認証

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

ユーザー名: user
パスワード: pass

Base64("user:pass") → "dXNlcjpwYXNz"

Authorization: Basic dXNlcjpwYXNz

注意: Base64は暗号化ではないため、Basic認証は必ずHTTPS（TLS）と組み合わせて使ってください。

エンコード・デコードの方法

JavaScriptの場合

// エンコード（ASCII文字列のみ）
const encoded = btoa('Hello World');
console.log(encoded); // "SGVsbG8gV29ybGQ="

// デコード
const decoded = atob('SGVsbG8gV29ybGQ=');
console.log(decoded); // "Hello World"

// 日本語を含む場合（UTF-8対応）
function encodeBase64(str) {
  const encoder = new TextEncoder();
  const bytes = encoder.encode(str);
  const binStr = Array.from(bytes, b => String.fromCharCode(b)).join('');
  return btoa(binStr);
}

function decodeBase64(base64) {
  const binStr = atob(base64);
  const bytes = Uint8Array.from(binStr, c => c.charCodeAt(0));
  return new TextDecoder().decode(bytes);
}

console.log(encodeBase64('こんにちは')); // "44GT44KT44Gr44Gh44Gv"
console.log(decodeBase64('44GT44KT44Gr44Gh44Gv')); // "こんにちは"

Pythonの場合

import base64

# エンコード
encoded = base64.b64encode(b'Hello World')
print(encoded)  # b'SGVsbG8gV29ybGQ='

# デコード
decoded = base64.b64decode(b'SGVsbG8gV29ybGQ=')
print(decoded)  # b'Hello World'

# 日本語の場合
text = 'こんにちは'
encoded = base64.b64encode(text.encode('utf-8'))
print(encoded.decode('ascii'))  # "44GT44KT44Gr44Gh44Gv"

コマンドライン（Linux / macOS）

# エンコード
echo -n 'Hello World' | base64
# SGVsbG8gV29ybGQ=

# デコード
echo 'SGVsbG8gV29ybGQ=' | base64 --decode
# Hello World

# ファイルをBase64に変換
base64 image.png > image_base64.txt

# Base64からファイルに復元
base64 --decode image_base64.txt > image.png

オンラインツールで変換

コードを書かずに手軽にBase64変換したい場合は、Base64エンコード・デコードツールが便利です。テキストを貼り付けるだけで即座に変換でき、ファイルのBase64変換にも対応しています。ブラウザ上で完結するため、データが外部サーバーに送信されることもありません。

Base64のバリエーション

Base64にはいくつかの亜種があります。用途に応じて使い分けが必要です。

標準Base64（RFC 4648）

使用文字: A-Z, a-z, 0-9, +, /
パディング: =

メール（MIME）やPEMフォーマットなどで広く使われる標準的な形式です。

Base64url（URL安全版）

使用文字: A-Z, a-z, 0-9, -, _
パディング: なし（または省略可能）

+ と / はURLで特別な意味を持つため、URLに含めても安全な - と _ に置き換えた方式です。JWTトークンやURLパラメータで使われます。

標準:   SGVsbG8+V29ybGQ/
URL安全: SGVsbG8-V29ybGQ_

使い分けの目安

用途	推奨形式
メール添付	標準Base64
Data URI	標準Base64
URLパラメータ	Base64url
JWT	Base64url
JSON内のデータ	標準Base64

よくあるトラブルと対処法

日本語をbtoa()でエンコードするとエラーになる

JavaScriptの btoa() はLatin-1（ISO-8859-1）の範囲外の文字を受け付けません。

btoa('こんにちは'); // DOMException: Failed to execute 'btoa'

対処法: 先にUTF-8のバイト列に変換してからエンコードします（上記のJavaScript例を参照）。

パディング（=）が欠けていてデコードできない

一部のシステムはパディングを省略してBase64文字列を出力します。デコード時にエラーになる場合は、手動でパディングを追加してください。

function addPadding(base64) {
  const pad = 4 - (base64.length % 4);
  if (pad !== 4) {
    base64 += '='.repeat(pad);
  }
  return base64;
}

改行文字が含まれている

MIMEエンコードされたBase64は76文字ごとに改行が入ります。デコード前に改行を除去する必要がある場合があります。

const cleaned = base64String.replace(/[\r\n]/g, '');
const decoded = atob(cleaned);

Base64で暗号化したつもりが…

Base64はエンコード（符号化）であり、暗号化ではありません。セキュリティ目的で使うことは絶対に避けてください。

# 誰でもデコードできる
echo "cGFzc3dvcmQxMjM=" | base64 --decode
# password123

パスワードや個人情報の保護には、AESなどの暗号化アルゴリズムを使いましょう。

Base64とパフォーマンス

Base64は便利ですが、使いどころを間違えるとパフォーマンスに悪影響を与えます。

Data URIのサイズ制限

ほとんどのブラウザは数MB程度のData URIに対応していますが、2KB以下の画像に使うのが推奨されます
Base64文字列はブラウザのキャッシュが効かないため、毎回HTMLと一緒に読み込まれます
CSS内のBase64はGzip圧縮との相性が悪く、ファイルサイズの削減効果が薄い場合があります

API通信での注意点

大きなファイルをBase64でJSON内に含めると、メモリ使用量が増えます
可能であれば multipart/form-data を使ったファイルアップロードの方が効率的です
Base64文字列の生成・パース自体にもCPUコストがかかります

推奨される使い分け

ファイルサイズ	推奨方式
〜2KB	Data URI（Base64）
2KB〜1MB	通常のファイル参照
1MB〜	multipart/form-dataまたはストリーミング

まとめ

Base64エンコードは、バイナリデータをテキスト形式に変換するためのシンプルで汎用的な方式です。

押さえておくべきポイント:

Base64は**エンコード（符号化）**であり、暗号化ではない
テキスト専用の通信経路でバイナリデータを扱うために使う
変換後のサイズは約33%増加する
URLで使う場合はBase64url（- _ 版）を選ぶ
JavaScriptで日本語を扱う場合は btoa() 単体ではなくTextEncoder経由で変換する
パフォーマンスを考慮し、大きなデータのBase64化は避ける

実際のBase64変換を試したい方は、Base64エンコード・デコードツールをお使いください。テキストの変換もファイルの変換もブラウザ上で完結し、データが外部に送信されることはありません。

この記事の内容はAssistyのBase64エンコード・デコードで実際にお試しいただけます。