前回C#でやってみたbase64の画像変換処理を、phpでもbase64_encode, base64_decode関数を使って試してみました。
この記事ではencode(base64_encode)の方だけ記載しています。
encodeする
base64_encode関数の使い方
第１引数に値を渡すと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);
動作確認
実行できる環境を、こちらに作成しました。
ファイルアップロードで画像を選択して、アップロードすると…
変換されて表示されました！
コメント