[php]base64から画像に変換するWebサイトを簡単に作成してみた

前回、画像からbase64文字列に変換する処理をphpで書いてみたので、今回はbase64から画像に変換してダウンロードする処理を書いてみました。
base64_decodeの使い方の記載と、実際に変換して画像をダウンロードできるサイトのサンプルコードを載せています。

base64_decodeの使い方
base64から画像変換してダウンロードする
1. html
  1. タグ
  2. 解説
2. php
  1. コード
  2. 解説
動作確認

base64_decodeの使い方

第１引数にbase64エンコードされた文字列を渡すと、データが返ってきます。
簡単ですね…😆

$image = base64_decode($_POST['base64_image']);

php docはこちら

base64から画像変換してダウンロードする

phpとhtmlに分けて記載してみました。実際のファイルは１つです。
動作する環境がこちらにあります。

html

<!DOCTYPE html>
<html lang="ja">
    <head>
        <title>base64 to image | codelike web tool</title>
        <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.5.0/css/bootstrap.min.css" integrity="sha384-9aIt2nRpC12Uk9gS9baDl411NQApFmC26EwAOH8WgZl5MYYxFfc+NcPb1dKGj7Sk" crossorigin="anonymous">
    </head>
    <body>
        <nav class="navbar navbar-dark bg-dark text-white">
            base64 to image
        </nav>
        <div class="container mt-3">
            <form method="post" action="./index.php">
                <div class="card">
                    <div class="card-header">
                        base64から画像変換してダウンロード
                    </div>
                    <div class="card-body">
                        <div class="form-group">
                            <input type="hidden" name="mode" value="decode" />
                            <textarea name="base64_image" class="form-control" rows="20"></textarea>
                            <input type="submit" class="mt-2 form-control btn btn-primary" value="送信" />
                        </div>
                    </div>
                </div>
            </form>
        </div>
    </body>
</html>

解説

画面はbootstrap4.5を読み込んで使って、作成しています。（5行目）
12行目で、formタグを書いて、methodはpostで、actionは”./index.php”を指定して同じファイルで処理するようにしています。

formで飛ばして処理をするデータとして、下記を用意しています。
・mode => 初期表示時など、意図してないところで動かないように用意しました。formからpostした時だけ、decodeが送信されます。(19行目)
・base64_image => テキストエリアに入力した、base64エンコードした画像の情報です。(20行目)

送信ボタン(21行目)を押すと、formのデータが送信されて処理が実行されます。

php

コード

<?php
function getExtension ($mime_type){
    $extensions = [
                    'image/jpeg' => 'jpeg',
                    'image/png' => 'png',
                    'image/gif' => 'gif',
                    'image/bmp' => 'bmp',
                  ];
    return $extensions[$mime_type];
}

if (isset($_POST["mode"]) && $_POST["mode"] == "decode" && $_POST['base64_image']) {
    // base64からimageに
    $image = base64_decode($_POST['base64_image']);

    // fileのmimeタイプ取得
    $finfo = new finfo(FILEINFO_MIME_TYPE);
    $mime_type = $finfo->buffer($image);

    // fileの拡張子取得
    $extension = getExtension($mime_type);

    // ファイルの一時保存
    $file_name = date('YmdHis')."_image.{$extension}";
    file_put_contents($file_name, $image);

    // ファイルをブラウザでダウンロード
    header('Content-Type: application/octet-stream');
    header('Content-Length: '.filesize($file_name));
    header('Content-disposition: attachment; filename="'.$file_name.'"');
    readfile($file_name);

    // ファイルの削除
    unlink($file_name);
}
?>