[php]画像をbase64_encodeする

php

前回C#でやってみたbase64の画像変換処理を、phpでもbase64_encode, base64_decode関数を使って試してみました。
この記事ではencode(base64_encode)の方だけ記載しています。

encodeする

base64_encode関数の使い方

第1引数に値を渡すとbase64のテキストの形になって返ってきます。

公式はこちら

サンプル

base64に変換したい画像をアップロードして、結果をテキストエリアに表示するサンプルを作成しました。

<?php
if (isset($_POST["mode"]) && $_POST["mode"] == "encode" && $_FILES['image']['name']) {
    $uploadFile = "./" . basename($_FILES['image']['name']);

    if (move_uploaded_file($_FILES['image']['tmp_name'], $uploadFile)) {
        $image = file_get_contents($uploadFile);
        unlink($uploadFile);
    } else {
        echo "upload error.";
    }
    $base64Text = base64_encode($image);
}
?>
<!DOCTYPE html>
<html lang="ja">
    <head>
        <title>image to base64 | 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">
            image to base64
        </nav>
        <div class="container mt-3">
            <form method="post" action="/base64_encode.php" enctype="multipart/form-data">
                <div class="card">
                    <div class="card-header">
                        画像からbase64テキスト変換
                    </div>
                    <div class="card-body">
                        <div class="form-group">
                            <input type="hidden" name="mode" value="encode" />
                            <input type="file" name="image" class="form-control" />
                            <input type="submit" class="mt-2 form-control btn btn-primary" value="送信" />
                        </div>
                    </div>
                </div>
            </form>
            <div class="card mt-3">
                <div class="card-header">
                    結果
                </div>
                <div class="card-body">
                    <label class="w-100">
                        <textarea class="form-control" style="height:20em;"><?php echo empty($base64Text) ? "" : $base64Text; ?></textarea>
                    </label>
                </div>
            </div>
        </div>
    </body>
</html>

解説

htmlタグ

head タグ内でbootstrap4を読み込んで使うようにしています。
body タグの中は、navでナビバーを作って、フォームと結果を表示するカードを作っています。

・フォームについて
フォーム作成時のポイントは画像アップロードの時にformの属性に enctype=”multipart/form-data” をつけておきます。

<form method="post" action="/base64_encode.php" enctype="multipart/form-data">

あとは、初期読み込み時にアップロード&変換処理が走らないように、hiddenでmodeを持っているのと
アップロードフォームと送信ボタンを用意しています。

<input type="hidden" name="mode" value="encode" />
<input type="file" name="image" class="form-control" />
<input type="submit" class="mt-2 form-control btn btn-primary" value="送信" />

phpプログラム

ファイルをプログラムと同じフォルダの箇所にアップロードして、
アップロードした画像を開いて変数($image)に入れています。(6行目)

変数に入れたあとはファイルは不要なので、削除しています。(7行目)
あとは、変数をbase64_encodeに渡して、変換した結果をテキストエリアに表示しています。

$base64Text = base64_encode($image);

動作確認

実行できる環境を、こちらに作成しました。

ファイルアップロードで画像を選択して、アップロードすると…

変換されて表示されました!

コメント

タイトルとURLをコピーしました