PHPで画像ファイルをアップロードする方法を初心者向けに徹底解説！わかりやすい画像処理入門

PHP で画像ファイルのアップロード処理を実装する方法

先生と生徒の会話形式で理解しよう

生徒

「PHPで、写真や画像をアップロードする機能を作りたいんですが、どうやってやるんですか？」

先生

「PHPでは、$_FILESという特別な変数を使って画像ファイルを受け取ることができます。HTMLのフォームと連携することで簡単にアップロード処理ができますよ。」

生徒

「フォームって何ですか？あと、アップロードってどこに画像を保存するんですか？」

先生

「フォームとは、ホームページ上で情報を入力するための枠のことです。画像はサーバー上のフォルダに保存します。では、初心者でも分かるように、順を追って説明していきましょう！」

1. PHPで画像アップロードを実現する仕組み

PHPで画像ファイルをアップロードする仕組みは、大きく分けて「ユーザーが画像を選ぶ」「サーバーへ送信する」「指定した場所に保存する」という3つのステップで成り立っています。プログラミング未経験の方でも、SNSで写真を投稿する際の流れをイメージすると分かりやすいでしょう。

仕組みの全体像：

ブラウザ（あなた）： HTMLのフォームを使って、パソコン内の画像を選択し「送信」ボタンを押す。
ネットワーク： 画像データがインターネットを通って、Webサーバー（PHP）へ送られる。
サーバー（PHP）： 送られてきた画像を受け取り、サーバー内の特定のフォルダに名前を付けて保存する。

技術的には、HTMLの<input type="file">というタグで選択画面を作り、PHPの$_FILESという「魔法の変数」を使って、届いたデータの中身（ファイル名やファイルサイズなど）をチェックしていきます。この一連の流れをマスターすれば、自分専用のフォトアルバムサイトや、アイコン設定機能なども作れるようになりますよ。

2. HTMLフォームで画像を選べるようにする（input type="file"）

PHPで画像を扱う第一歩は、ユーザーが自分のパソコンやスマホから画像を選択できる「窓口」を作ることです。これにはHTMLの「フォーム機能」を使用します。初心者の方が特につまずきやすいポイントを含めて、シンプルなコードで解説します。


<form action="upload.php" method="post" enctype="multipart/form-data">
    <div style="margin-bottom: 15px;">
        <label>【STEP 1】画像ファイルを選択してください：</label><br>
        <input type="file" name="image" accept="image/*">
    </div>
    <div style="margin-bottom: 15px;">
        <input type="submit" value="サーバーへアップロードする">
    </div>
</form>

このコードの中で、絶対に忘れてはいけない「3つの重要ルール」があります。SEOや保守性の観点からも、これらはセットで覚えておきましょう。

method="post"： 画像のような大容量データを送る際は、URLにデータが表示されない「POST（ポスト）形式」を使うのが決まりです。
enctype="multipart/form-data"： これが魔法の合言葉です。この記述がないと、ファイルの中身ではなく「ファイル名」というテキストだけが送られてしまい、画像処理ができません。
input type="file"： これを書くだけで、ブラウザに「ファイルを選択」というボタンが自動で表示されます。

ちなみに、accept="image/*"という属性を追加しておくと、スマホで開いた時にカメラが起動しやすくなったり、画像以外のファイルを選択しにくくしたりできるので、ユーザーに優しい親切な設計になりますよ。

3. PHPでアップロードされた画像をサーバーに保存する具体的な手順

フォームから送信された画像データは、サーバー上の「一時的な場所」に仮保存されます。そのままでは消えてしまうため、PHPのプログラムを使って、私たちが用意した専用フォルダへ正式に保存（移動）させる必要があります。プログラミングが初めての方でも扱いやすい、最も標準的な書き方を見ていきましょう。


<?php
// 1. フォームから「image」という名前でデータが届いているか、エラーがないか確認
if (isset($_FILES["image"]) && $_FILES["image"]["error"] === 0) {
    
    // 2. 送られてきたファイル名を取得（例: "shiba-inu.jpg"）
    $fileName = $_FILES["image"]["name"];
    
    // 3. サーバーに一時的に置かれている場所（仮の名前）を取得
    $tmpName = $_FILES["image"]["tmp_name"];
    
    // 4. 画像を保存したいフォルダを指定（あらかじめ作成しておく必要があります）
    $uploadDir = "uploads/";
    
    // 5. 保存先のフルパス（フォルダ名 + ファイル名）を作成
    $targetPath = $uploadDir . basename($fileName);
    
    // 6. 一時保存場所から、指定したフォルダへファイルを移動させる
    if (move_uploaded_file($tmpName, $targetPath)) {
        echo "おめでとうございます！画像のアップロードに成功しました。";
    } else {
        echo "残念ながら、フォルダへの保存に失敗しました。権限などを確認してください。";
    }

} else {
    echo "画像が正しく選択されていないか、送信中にエラーが発生しました。";
}
?>

このコードの主役は move_uploaded_file() という関数です。これは「荷物（画像）を一時預かり所から、自分の部屋（uploadsフォルダ）へ運び入れる」という役割を持っています。この処理を記述することで、初めてWebブラウザ上に画像を表示したり、後から見返したりすることが可能になります。まずはこの「受け取って、動かす」という基本の流れをしっかり押さえましょう。

4. アップロード先のフォルダ準備と「パーミッション」の基本

PHPプログラムが完成しても、画像を保存する「箱」がなければエラーになってしまいます。まずはプロジェクトのメインファイル（index.phpなど）と同じ場所に、「uploads」という名前のフォルダを新規作成しましょう。

未経験者向けのフォルダ構成イメージ：

my-project/
- upload.php（プログラムファイル）
- uploads/（ここを空で作っておく！）

ここで初心者が最もハマりやすいのが「パーミッション（権限）」の問題です。サーバーには「このフォルダにファイルを書き込んでもいいですよ」という許可設定が必要です。XAMPPなどのローカル環境では最初から許可されていることが多いですが、実際のWebサーバー（レンタルサーバーなど）では、フォルダの権限を「707」や「777」といった書き込み可能な数値に変更する必要があります。

もし、プログラムが正しいのに「failed to open stream: Permission denied」というエラーが出たら、この「書き込み許可」が出ていないサインです。FTPソフトなどでフォルダを右クリックし、「属性変更」からチェックを入れてみてください。この「場所を作り、許可を与える」という作業は、Web開発において非常に重要なステップです。

5. アップロードできる画像の種類を制限（バリデーション）しよう

Webサイトの安全性を守るために、画像以外のファイル（例えばコンピューターウイルスを含むプログラムなど）がアップロードされないよう制限をかけることが非常に重要です。この作業を「バリデーション」と呼びます。初心者の方でも取り入れやすい、MIMEタイプ（ファイルの種類）を使った判定方法を紹介します。


// 1. 許可する画像形式（MIMEタイプ）をリストにする
$allowedTypes = ["image/jpeg", "image/png", "image/gif"];

// 2. 送られてきたファイルの「種類（type）」を取り出す
$fileType = $_FILES["image"]["type"];

// 3. リストの中に、送られてきた種類が含まれているかチェック
if (!in_array($fileType, $allowedTypes)) {
    // リストにない形式だった場合の処理
    echo "【エラー】JPEG・PNG・GIF以外の画像形式はアップロードできません。";
    exit; // ここでプログラムを終了させる
}

このコードでは in_array() という関数を使い、送信されたデータが「許可リスト」に入っているかを照合しています。もしPDFやZipファイルなどが送られてきても、この一文があるだけでサーバーへの保存を未然に防ぐことができます。また、最近のWeb制作では軽量な「WebP（ウェッピー）」形式も普及しているため、必要に応じて "image/webp" をリストに追加するなど、時代の流れに合わせてカスタマイズするのも良いでしょう。

知っておくと役立つ豆知識：
「.jpg」という拡張子を書き換えただけの偽装ファイルを見抜くには、より高度な finfo_file() 関数を使う方法もありますが、まずはこの基本のチェック方法をマスターして、確実に動作させることから始めましょう！

6. アップロード後に画像を表示してみよう

アップロードが成功したあと、画像をその場で表示するには、HTMLで画像を読み込むタグ<img>を使います。


<img src="uploads/ファイル名.jpg" alt="アップロードされた画像">

PHPで保存したファイル名を使えば、アップロードされた画像をそのままホームページ上に表示できます。

7. セキュリティ上の注意点

画像アップロードは便利ですが、ウイルスなどをアップロードされる危険もあります。以下のような対策をしておくことをおすすめします。

画像の拡張子やファイルタイプをチェックする
保存時にファイル名をランダムな名前に変更する
PHPファイルなどの実行ファイルをアップロードできないようにする

初心者のうちは、JPEGやPNG画像のみ受け付けるようにするだけでも安心度は高まります。

8. ローカル環境で試すならXAMPPがおすすめ

パソコンにサーバーの機能を入れてテストするには、「XAMPP（ザンプ）」という無料のツールを使うのが簡単です。インストールして「htdocs」というフォルダの中に上記のファイルを配置すれば、実際に画像アップロードの仕組みを体験できます。

まとめ

PHPで画像ファイルをアップロードする仕組みは、初心者が最初に触れる場面も多く、Web開発において欠かせない重要な技術です。今回の記事では、画像アップロードの基本となるHTMLフォームの作り方から、PHPで受け取ったファイルを処理して保存する流れ、さらに画像の種類を制限する安全な実装方法までを段階的に学びました。フォームで指定するenctype="multipart/form-data"の重要性、$_FILES変数で取得できる情報の意味、画像の保存先フォルダの準備とパーミッション設定など、正しく理解しておくとトラブルなく扱える知識も多く含まれています。

特に、画像ファイルのアップロード処理は、ユーザーが入力する情報を受け取り、適切にサーバー上へ保存するための基本的な仕組みが凝縮されているため、Webアプリケーション全体の仕組みを理解するうえでも非常に良い練習になります。さらに、セキュリティ対策として実際の現場でも必ず実装されるファイル形式チェック、拡張子制限、保存時のファイル名変更なども学ぶ機会となり、これらを身につけることでより安全なアップロードシステムを構築できるようになります。

以下では、今回学んだ内容をひとつにまとめたサンプルプログラムを掲載しています。画像のアップロード、タイプチェック、保存、表示までの流れを確認できるため、学習の振り返りとしても最適です。

サンプルプログラムまとめ


<?php
if (isset($_FILES["image"]) && $_FILES["image"]["error"] === 0) {
    $allowed = ["image/jpeg", "image/png", "image/gif"];
    $type = $_FILES["image"]["type"];

    if (!in_array($type, $allowed)) {
        echo "対応している画像形式はJPEG・PNG・GIFのみです。";
        exit;
    }

    $fileName = uniqid() . "_" . basename($_FILES["image"]["name"]);
    $tmp = $_FILES["image"]["tmp_name"];
    $dir = "uploads/";
    $path = $dir . $fileName;

    if (move_uploaded_file($tmp, $path)) {
        echo "アップロード成功！<br>";
        echo "<img src='" . $path . "' alt='アップロード画像' style='max-width:300px;'>";
    } else {
        echo "アップロードに失敗しました。";
    }
} else {
    echo "画像が正しく選択されていません。";
}
?>

このサンプルでは、画像形式のチェック、保存時のファイル名変更、アップロード後にサムネイルとして表示するところまでをシンプルなコードで実現しています。実際の開発では、画像サイズの制限や不正なファイルの検出など、より多くのチェックが必要になりますが、まずは今回のような基礎的な流れを確実に理解することが大切です。画像アップロードは、プロフィール画像登録、商品写真の投稿、ギャラリー機能など、多くのサービスに必要とされる処理であり、習得することでWeb制作の幅が広がるでしょう。画像処理の基礎を身につけた後は、GDライブラリやImagickなどを使ったサムネイル生成やリサイズ処理にも挑戦すると、さらに高度な画像管理システムを作れるようになります。

先生と生徒の振り返り会話

生徒
「PHPで画像をアップロードする仕組みが、一つずつ確認すると意外とシンプルだと感じました。特に$_FILESを使って情報を取得するところが重要だとわかりました！」

先生
「その通りですね。画像アップロードはフォームとPHPが連携する典型的な処理で、Webアプリケーションの基礎理解にもつながりますよ。ファイル名の扱い方や保存場所の指定も丁寧に行うことが大切です。」

生徒
「画像の種類を制限する方法も勉強になりました！JPEGやPNGだけ受け付けるようにするだけでも安心感が違いますね。」

先生
「そうですね。セキュリティ面を意識するのはとても良いことです。Web開発では必ず必要になる部分なので、今日の学びは実務でも役立ちますよ。」

生徒
「ありがとうございます！次はアップロード後に画像を加工したりサイズ変更をしたり、もう少し発展的な処理にも挑戦してみたいです。」

ハローワーク講師による直接指導【PHP実務設計実践セミナー】