[ガイド]
8分読了
[ガイド] Base64完全リファレンス
Base64エンコーディングについて知っておくべきすべて:理論、実装、ベストプラクティス。
2025年1月
|
fundamentals
// BASE64とは?
Base64は、64個のASCII文字を使用してバイナリデータを表現するバイナリ-テキストエンコーディングスキームです。テキストデータ用に設計されたメディア上で保存および転送する必要があるバイナリデータをエンコードするために設計されています。
Base64文字セットには、A-Z、a-z、0-9、および2つの追加文字(通常は+と/)、さらにパディング用の=が含まれます。
// BASE64の仕組み
Base64エンコーディングは、バイナリデータを取得してASCII文字の文字列に変換することで動作します。プロセスには以下が含まれます:
1. 入力を6ビットのチャンクに分割する(Base64は1文字あたり6ビットを使用) 2. 各6ビット値をBase64アルファベットの文字にマッピングする 3. 必要に応じて'='文字でパディングを追加する
// 例:'Man'をBase64にエンコード
// 'M' = 01001101、'a' = 01100001、'n' = 01101110
// 結合:010011010110000101101110
// 6ビットグループに分割:010011 010110 000101 101110
// 10進値:19、22、5、46
// Base64文字:T、W、F、u
// 結果:'TWFu'
// 一般的な使用例
- > HTML/CSSへの画像の埋め込み(データURI)
- > JSON API用のバイナリデータエンコーディング
- > メールの添付ファイル(MIMEエンコーディング)
- > データベースでのバイナリデータの保存
- > 認証トークンとAPIキー
- > URLセーフなデータ転送
// JAVASCRIPT実装
モダンブラウザは組み込みのBase64エンコード・デコード関数を提供しています:
テキストをBase64にエンコードするにはbtoa()(binary to ASCII)を使用します。Base64をテキストにデコードするにはatob()(ASCII to binary)を使用します。
// テキストをBase64にエンコード
const text = 'こんにちは、世界!';
const encoded = btoa(text);
console.log(encoded); // 44GT44KT44Gr44Gh44Gv44CB5LiW55WMIQ==
// Base64をテキストにデコード
const decoded = atob(encoded);
console.log(decoded); // こんにちは、世界!
// Unicode文字列の場合は、TextEncoder/TextDecoderを使用
const encoder = new TextEncoder();
const decoder = new TextDecoder();
const unicodeText = 'こんにちは、世界!';
const bytes = encoder.encode(unicodeText);
const base64 = btoa(String.fromCharCode(...bytes));
console.log(base64);
// セキュリティ上の考慮事項
Base64は暗号化やセキュリティではありません。単にデータ表現のためのエンコーディングです。重要なセキュリティ注意事項:
機密データの保護にBase64単体を使用しないでください。インジェクション攻撃を防ぐため、Base64入力を常に検証してください。Base64がデータサイズを約33%増加させることを認識してください。
- > Base64は簡単に可逆的 - セキュリティを提供しません
- > Base64入力を常に検証・サニタイズしてください
- > 機密データには適切な暗号化を使用してください
- > WebアプリケーションではURLセーフなBase64バリアントを検討してください
- > 一部のコンテキストでパディングオラクル攻撃に注意してください
// ベストプラクティス
- > WebアプリケーションでURLセーフなBase64を使用(+を-に、/を_に置換)
- > パディングを常に正しく処理する
- > 入力の長さと文字を検証する
- > 大きなデータの場合、エンコード前に圧縮を検討する
- > 非常に大きなデータセットにはストリーミングを使用する
- > 無効な入力に対する適切なエラーハンドリングを実装する