Base64 を画像に。プレビューしてそのままダウンロード。

HTML、CSS、JSON、メールに埋め込まれた画像は、たいてい data:image/png;base64,iVBORw0KGgo… のような data: URI の形をしています。カンマより前はラベルで、 画像本体はその後ろの Base64 です。ここではどちらの形でも貼り付けられます。接頭辞があれば取り除かれますが、 デコーダーはファイルのシグネチャ自体も確認するため、image/png と書かれていても実は JPEG だった という画像も正しく判別・保存されます。

画像を別の場所に埋め込むだけなら、デコードする必要はありません。data: URI はそのまま <img src> や CSS の url() に使えます。デコードが必要になるのは、画像を編集したい、 中身を調べたい、API が実際に何を返したかを確認したいなど、ファイルそのものが必要なときです。

Base64 は同じバイト列を常に同じ文字に変換するため、ファイル形式ごとに特徴的な書き出しがあります。 デコードする前から、Base64 文字列の中身を推測できます：

/9j/ で始まれば JPEG、iVBORw0KGgo で始まれば PNG です。ログの 1 行やデータベースの 列以外に手がかりがないときに役立ちます。

• 文字列が途中で切れている。長い Base64 は、ログビューア、チャットアプリ、スプレッドシートの セル（Excel は 32,767 文字まで）で切れることがよくあります。ヘッダーはデコードできても画像データが欠けています。 元のデータから値をコピーし直してください。
• 画像ではない。出力の下にある「種類」を確認してください。PDF、ZIP、バイナリデータと表示されて いれば、Base64 の中身は別の種類のファイルです。ダウンロードしてください。
• 表示できない形式。ブラウザは HEIC や TIFF を表示できないため、デコード自体は正しくても プレビューはできません。ダウンロードして画像ビューアで開いてください。
• 2 回エンコードされている。出力がまた Base64（多くは「iVBORw」を再エンコードした aVZCT1J3 で始まる）なら、「入力へ送る」を押してもう一度デコードしてください。

# Python
import base64
with open("image.png", "wb") as f:
    f.write(base64.b64decode(b64_string))

// Node.js
fs.writeFileSync("image.png", Buffer.from(b64String, "base64"));

# Linux / macOS shell
base64 --decode image.b64 > image.png

コードでデコードする前に、data:image/…;base64, の接頭辞は取り除いてください。ほとんどの デコーダーは接頭辞を不正な入力として扱います。そのほかの言語は Base64 デコードのコード例で紹介しています。