Base64エンコーダー＆デコーダー

Base64とは？

// Encode plain text to Base64
const encoded = btoa('Hello, World!');
console.log(encoded); // → 'SGVsbG8sIFdvcmxkIQ=='

// Decode Base64 back to text
const decoded = atob('SGVsbG8sIFdvcmxkIQ==');
console.log(decoded); // → 'Hello, World!'

// UTF-8 safe encode (handles Chinese, emoji, any Unicode)
function encodeBase64(str) {
  const bytes = new TextEncoder().encode(str);  // to UTF-8 bytes
  return btoa(String.fromCharCode(...bytes));
}
console.log(encodeBase64('你好')); // → '5L2g5aW9'

主な機能

使用例

Hello, World!

SGVsbG8sIFdvcmxkIQ==

你好世界 🌍

5L2g5aW95LiW55WMIPCfjI0=

{"user":"alice","role":"admin"}

eyJ1c2VyIjoiYWxpY2UiLCJyb2xlIjoiYWRtaW4ifQ==

Line 1
Line 2
Line 3

TGluZSAxCkxpbmUgMgpMaW5lIDM=

使い方

1. 1

   テキストまたはBase64を入力

   左側の「テキスト」エリアにエンコードしたいテキストを入力するか、右側の「Base64」エリアにデコードしたいBase64文字列を貼り付けます。変換は即座に双方向で行われます。

2. 2

   リアルタイムで結果を確認

   入力すると同時にもう一方のエリアが自動更新されます。無効なBase64などのエラーがあれば即座に表示されます。

3. 3

   結果をコピー

   各エリアのコピーボタンをクリックすると、エンコードまたはデコードの結果をクリップボードにコピーできます。

一般的なユースケース

データURIの生成

画像やファイルをBase64にエンコードし、データURIとしてHTMLやCSSに直接埋め込みます。

JWTのデバッグ

Base64エンコードされたJWTトークンのヘッダーとペイロードをデコードして、クレームや有効期限を確認します。

API開発

JSON APIで送信するバイナリデータをエンコードしたり、Base64レスポンスをデコードして内容を検査したりします。

メールエンコーディング

MIMEエンコードされたメールのコンテンツや添付ファイルのエンコード・デコードを行います。

証明書の検査

PEMエンコードされた証明書や鍵をデコードして、バイナリコンテンツの内容を確認します。

設定データの埋め込み

環境変数や設定ファイルに安全に埋め込むために、設定データやシークレットをエンコードします。

技術的な詳細

RFC 4648準拠

RFC 4648で定義されている標準Base64エンコーディング（A-Z、a-z、0-9、+、/のアルファベットと=パディング）を実装しています。

TextEncoderによるUTF-8処理

Web APIのTextEncoderを使用してUnicode文字列をUTF-8バイト列に変換してからエンコードするため、すべてのスクリプトと絵文字を正しく処理します。

ブラウザベースの処理

すべてのエンコーディングはネイティブのbtoa()/atob()とTextEncoder/TextDecoderを使用しています。外部ライブラリもサーバー通信も不要です。

ベストプラクティス

セキュリティ目的で使用しない

Base64はエンコーディングであり、暗号化ではありません。パスワード、トークン、機密データの「保護」に使用しないでください。必ず適切な暗号化を使用してください。

サイズ増加に注意する

Base64はデータサイズが約33%増加します。大きなファイルの場合は、Base64エンコードの代わりにバイナリ転送を検討してください。

UTF-8エンコーディングを使用する

非ASCII文字（日本語、絵文字など）を正しく処理するために、Base64エンコード前に必ずテキストをUTF-8バイト列に変換してください。

よくある質問

Base64エンコードとは何ですか？

Base64はバイナリデータをASCII文字列に変換するエンコード方式です。入力の3バイトごとに、A-Z、a-z、0-9、+、/ の64種類の印字可能文字から4文字に変換します。入力の長さが3の倍数でない場合は「=」がパディングとして使用されます。Base64はRFC 4648で定義されており、メール（MIME）、データURI、JSON Web Token（JWT）、HTTP認証など、インターネット上で幅広く使われています。

このツールを使うとき、データの安全性は大丈夫ですか？

はい、完全に安全です。すべてのエンコード・デコード処理はブラウザ内でJavaScriptのネイティブAPI（btoa()、atob()、TextEncoder、TextDecoder）を使ってローカルで行われます。データはデバイスの外に出ることは一切ありません。サーバーへの送信、Cookie、入力データの分析、いかなる形式のデータ保存も行いません。

日本語や絵文字などの非ASCII文字はどのように処理されますか？

このツールは、まずTextEncoder APIを使って入力テキストをUTF-8バイト列に変換し、そのバイト列をBase64エンコードします。これにより、ASCII範囲外の文字（中国語の「你好」、日本語の「こんにちは」、アラビア語、絵文字の🎉など）も正しくエンコードされます。デコード時はその逆のプロセスを実行します：Base64 → バイト列 → TextDecoderでUTF-8テキストに変換します。

Base64は暗号化ですか？

いいえ。Base64はエンコーディングであり、暗号化ではありません。セキュリティは一切提供されず、誰でもBase64文字列を即座に元のデータにデコードできます。Base64はデータ転送（バイナリデータをテキスト専用チャネルで安全に送るため）のために設計されたもので、秘密の保護のためではありません。データを保護する必要がある場合は、適切な暗号化（AES、RSA）を使用し、その後オプションでBase64エンコードしてください。

Base64はどのような場面で使われていますか？

Base64は以下の場面で広く使用されています：(1) データURI — 画像をHTML/CSSに「data:image/png;base64,...」として直接埋め込む、(2) メール — 添付ファイルや非ASCIIコンテンツのMIMEエンコーディング、(3) JWT — JSON Web TokenのヘッダーとペイロードをBase64URLでエンコード、(4) HTTP Basic認証 — 資格情報を「ユーザー名:パスワード」のBase64エンコードで送信、(5) API — JSONペイロード内でバイナリデータを送受信、(6) 証明書 — PEM形式でDERエンコードされた証明書をBase64でラップ。

Base64とURL安全なBase64の違いは何ですか？

標準のBase64は「+」と「/」の文字を使用しますが、これらはURLにおいて特別な意味を持ちます。URL安全なBase64（Base64URL、RFC 4648で定義）は、「+」を「-」に、「/」を「_」に置き換えることで、追加のエンコーディングなしにURLやファイル名で安全に使用できるようにしています。このツールは標準のBase64を使用しています。変換するには、出力の「+」を「-」に、「/」を「_」に置き換えるだけです。

Base64エンコードするとデータサイズが大きくなるのはなぜですか？

Base64は入力の3バイトを出力の4文字に変換するため、約33%のサイズ増加になります。これは、Base64が8ビットバイトを表現するのに64種類の印字可能ASCII文字（各6ビット）のみを使用するためです。たとえば、13文字の「Hello, World!」は20文字のBase64文字列「SGVsbG8sIFdvcmxkIQ==」になります。このトレードオフは、エンコードされたデータがテキスト専用プロトコルで安全に送信できるため許容されています。

ファイルをBase64にエンコードするにはどうすればよいですか？

macOSやLinuxでは、コマンドラインで base64 < myfile.png > myfile.b64 と実行します。WindowsではPowerShellで [Convert]::ToBase64String([IO.File]::ReadAllBytes('myfile.png')) を使います。JavaScript（Node.js）では fs.readFileSync('myfile.png').toString('base64')、Pythonでは import base64; base64.b64encode(open('myfile.png','rb').read()) を使います。このブラウザツールはテキスト入力を処理します。大きなバイナリファイルにはコマンドラインツールの方が効率的です。

HTMLやCSSでBase64を使用できますか？

はい。Base64はデータURIで小さなアセットをHTMLやCSSに直接埋め込み、追加のHTTPリクエストを排除するためによく使われます。HTMLでは：。CSSでは：background-image: url('data:image/svg+xml;base64,PHN2Zy...')。これは小さなアイコンやSVG（約5 KB以下）に最適です。大きなファイルの場合は、Base64が33%のサイズオーバーヘッドを追加しブラウザのキャッシュをバイパスするため、別ファイルとして参照する方が効率的です。

最大入力サイズはどれくらいですか？

このブラウザベースのツールは約5 MBまでのテキストを効率的に処理できます。非常に大きなファイルやバイナリデータの場合は、macOSやLinuxで利用可能な「base64」コマンドや「openssl base64」などのコマンドラインツールの使用をご検討ください。Base64規格自体にはサイズ制限はありません。

Base64のアルファベットにはどの文字が含まれますか？

標準Base64アルファベット（RFC 4648）は64文字で構成されています：大文字A-Z（値0-25）、小文字a-z（値26-51）、数字0-9（値52-61）、プラス記号+（値62）、スラッシュ/（値63）です。等号=はパディングに使用されます。URL安全バリアント（Base64URL）は、URLの予約文字との競合を避けるため、+を-に、/を_に置き換えます。

HTMLメールテンプレートに小さな画像を埋め込みたいのですが、Base64データURIと外部ホスティングのどちらを使うべきですか？

HTMLメールの場合、ロゴやアイコンなどの小さな画像にはBase64データURIが推奨される方法です。多くのメールクライアント（Outlook、Gmail）は外部ホスティングの画像をデフォルトで積極的にブロックし、ユーザーが「画像を表示」をクリックしないと表示されません。画像をBase64データURI（data:image/png;base64,...）として埋め込めば、この問題を完全に回避できます。画像がメール自体の一部になるからです。トレードオフはメールのファイルサイズです。Base64は約33%のオーバーヘッドを追加するため、10 KBのPNGはメール内で約13 KBになります。最高の互換性のために、埋め込み画像は20 KB以下に抑えてください。大きな画像や背景画像には外部ホスティングの方が実用的です。

Base64エンコードされた文字列に+や/が含まれていてURLパラメータが壊れるのですが、なぜですか？

標準Base64は64文字のうちの2つとして+と/を使用しますが、両方ともURLで特別な意味を持ちます（+はスペースを意味し、/はパス区切り文字です）。標準のBase64文字列をエンコードせずにURLクエリパラメータに含めると、これらの文字が値を破損させます。解決策はURL安全なBase64（Base64URL、RFC 4648で定義）を使用することで、+を-に、/を_に置き換えます。このバリアントはJWTトークン、OAuthフロー、URL内に現れるBase64値すべてで使用されます。標準Base64からURL安全に変換するには、出力のすべての+を-に、/を_に置き換え、オプションで=パディング文字を削除するだけです。

JWTトークンをデコードしたいのですが、Base64URLデコードはどのように機能し、標準Base64との違いは何ですか？

JWT（JSON Web Token）はドットで区切られた3つの部分で構成されます：header.payload.signature。ヘッダーとペイロードはそれぞれBase64URLでエンコードされています。標準のBase64ではありません。Base64URLは標準Base64と2点で異なります：+の代わりに-を、/の代わりに_を使用し、=パディング文字を省略します。JWTを手動でデコードするには、トークンをドットで分割し、最初または2番目のセグメントを取り出し、-を+に、_を/に戻し、長さが4の倍数になるよう必要に応じて=パディングを追加してから、Base64デコードします。ほとんどのJWTデバッグには専用のJWTデコーダーの方が簡単ですが、Base64URLエンコーディングを理解しておくと、コードでのトークン処理の実装や生のトークン値のデバッグ時に役立ちます。