【初心者向け】$_FILESで画像をアップロードする方法

こんにちは、

最近は紅茶にはまっているサトウです。
さて、本題に入りたいと思います。

phpの学習を進めていくと、「画像(ファイル)アップロード機能」を初めて学んだ際に一気に難易度が高くなったと感じる方も多いのではないでしょうか。
今回は画像アップロード時に使用する変数である$_FILESの使い方や画像アップロード機能の作り方等分かりやすく説明していきます。

phpを学び始めた方や、$_FIELS関数の使い方 について分からない方は、是非読んでみてくださいね。

$_FILESとは

php言語ではファイルアップロード処理をする際、$_FILESというスーパーグローバル変数を使います。この$_FILESの中にはファイルアップロードする際に必要な以下のファイル情報が格納されています。

name – アップロードされたファイルのファイル名
type – アップロードされたファイルの形式(MIMEタイプ)※1
tmp_name – サーバーへ仮アップロードされたディレクトリとファイル名
error – エラー情報
size – ファイルサイズ(単位はバイト)
※1 MIMEタイプとはファイルの種類の情報を表すもので「png」「jpeg」等を指します。

実際にサンプルコードで$_FILESの中の情報を確認してみましょう。

サンプルコード

実行結果(画像がアップロードされる前)

こちらの例はファイルをアップロードすると「$_FILESの中身」部分の下にファイルの中の情報が表示されるようになっています。ファイル情報はvar_dumpで中身を表示するので、画像登録前はarray(0){}と表示されています。

この状態で画像を登録してみます。

登録するファイル

ファイルを選択して、「送信」ボタンを押してみます。

実行結果(画像がアップロードされた後)

$_FILESの中の情報が取得できました。アップロードしたファイルのファイル名やMIMEタイプが表示されているのが確認できましたね。
画像アップロード機能を実装する時はこの$_FILESの情報を活用していく必要があります。

画像アップロード機能を実装してみよう!

$_FILESについて理解が深まったところで、$_FILESを使った簡易な画像アップロード機能の実装方法について解説していきます。
今回は特に$_FILESの情報がどのように使われているか、に絞って中身に説明します。

今回は以下の機能を実装します。

画像アップロード機能の仕様

「ファイル選択」から画像ファイルを選択する。
送信ボタンを選択すると、画像とアップロードしたファイル名が表示される。

・完成イメージ

完成後のサンプルコードは以下のとおりです。

・サンプルコード

実装する処理手順は以下のとおり進めていきます。

処理手順

(1)form タグからpost送信する
(2)$_FILEに情報があれば(formタグからpost送信されていれば)以下の処理を実行する
(3)$_FILESからファイル名を取得する
(4)$_FILESから保存先を取得して、images_after(ローカルフォルダ)に移す
(5)ローカルフォルダに移動した画像を画面に表示する

以下、順に解説していきます。

form タグからpost送信する

formタグには以下のように記述します。fileアップロードする際は忘れずに記述しましょう。

enctype=”multipart/form-data”
$_FILEに関する情報を送ったと認識されます。
input type=”file”
このように書くと「ファイルを選択」というボタンが表示されます。

サンプルコード だと以下の部分が該当します。

サンプルコード(該当部分)

formタグ内からpost送信されたら、以下の処理に移ります。

$_FILEに情報があれば(formタグからpost送信されていれば)以下の処理を実行する

 $_FILESの中に情報があるかどうか(formタグからpost送信されているか)を!emptyで判定します。
サンプルコード(該当部分)
$_FILESの中に情報があれば以下の処理に移ります。

$_FILESからファイル名を取得する

$_FILESに送信された情報は[‘upload_image’]をキーにした配列の中にさらに[‘name’][‘tmp_name’]といった文字列をキーにした配列が入っています。(2次元配列といいます。)$_FILESからファイル名を取り出す時には$_FILES[‘upload_image’][‘name’]と記載します。

サンプルコード(該当部分)
これでファイル名を取得することができます。

$_FILESから保存先を取得して、images_after(ローカルフォルダ)に移す

アップロードされたファイルはサーバの一時的な格納場所(テンポラリ)に格納されています。それが$_FILES[‘upload_image’][‘tmp_name’]です。フォルダの格納先を移動する場合はmove_uploaded_fileを使います。

move_uploaded_file(第1引数:移動前フォルダ,第2引数:移動後の新フォルダ)
第1引数:移動前フォルダ:$_FILES[‘upload_image’][‘tmp_name’]が該当します。
第2引数:移動後の新フォルダ:images_afterというフォルダを作成しています。新フォルダと参照する画像ファイル名が必要なため、フォルダ名+ファイル名を結合した文字列を作って$uploaded_pathに格納しています。

サンプルコード(該当部分)

ローカルフォルダに移動した画像を画面に表示する

move_uploaded_fileの結果をimg_pathに格納して、その中身があれば画像表示される処理をHTMLの中に組み込んでいます。

サンプルコード(該当部分)

コードの解説は以上となります。少しややこしい部分がありますが、是非処理の流れを確認しながら実装してみてください。
全体のコードを再度以下にも記載しておきます。

サンプルコード全体(再掲)

今回は$_FILESの使い方を確認するための簡易な画像アップロード機能を実装しました。
実際にはバリデーションという画像アップロード前のチェックを必ず行う必要があります。主に以下のような情報を事前チェックする必要があるので、興味がある方は調べてみてください。

・MIMEタイプが画像形式(jpegやpng)になっているか。
・画像のファイルサイズは適切か。

まとめ

いかがでしたか?今回は、$_FILESを使って画像アップロード機能を作成する方法について説明しました。

プログラミングを学び始めた頃は、「画像アップロード」はややこしく感じることあると思います。ですが量をこなしていくと簡単に使えることができる日が来ると思うので、焦らずにゆっくりと理解を深めていってくださいね

この記事が、phpの学習に役立つと嬉しいです。

BLOGコンテンツをパーソナライズします

あなたは現在「プログラミング学習者」ですか?