PHP 多檔案上傳完整實作指南：前端與後端整合

PHP 多檔案上傳完整實作指南

在 Web 開發中，實現多檔案上傳是常見需求。本文將完整示範從前端 HTML 表單、jQuery 非同步提交，到 PHP 後端處理的完整流程，並說明關鍵注意事項。

前端 HTML 表單設計

建立支援多檔案選擇的表單時，有兩個關鍵點：

• 輸入框命名：所有 file 型 input 的 name 屬性必須使用陣列語法 name="imagesUpload[]"，確保 PHP 能以陣列形式接收多個檔案。
• 表單編碼類型：form 標籤必須設定 enctype="multipart/form-data"，否則檔案資料無法正確傳輸。

<form id="uploadForm" action="upload.php" method="post" enctype="multipart/form-data">
    <input type="file" name="imagesUpload[]" multiple />
    <button type="submit">上傳</button>
</form>

jQuery 非同步提交表單

使用 jQuery Form Plugin 或原生 AJAX 實現無刷新上傳，核心代碼如下：

$('#uploadForm').ajaxForm({
    url: 'upload.php',
    dataType: 'json',
    success: function(response) {
        if (response.flag === 1) {
            console.log('上傳成功，檔案列表：', response.names);
        } else {
            alert('上傳失敗：' + response.flagmsg);
        }
    },
    error: function() {
        alert('請求異常，請稍後再試');
    }
});

PHP 後端處理邏輯

後端需遍歷 $_FILES['imagesUpload'] 陣列，逐一驗證、移動並記錄檔案。以下是完整處理範例：

<?php
$fileArray = $_FILES['imagesUpload'];
$uploadDir = __DIR__ . '/upload/carPic/';
$userID = $_SESSION['userID'] ?? 'guest';
$nowTime = date('YmdHis');
$i = 0;
$successNames = [];

foreach ($fileArray['error'] as $key => $error) {
    if ($error === UPLOAD_ERR_OK) {
        $tmpName = $fileArray['tmp_name'][$key];
        $origName = $fileArray['name'][$key];
        $newName = $userID . '-' . $nowTime . $i . '_' . $origName;
        
        if (move_uploaded_file($tmpName, $uploadDir . $newName)) {
            $successNames[] = $newName;
        } else {
            echo json_encode(['flag' => 0, 'flagmsg' => "檔案 {$origName} 移動失敗"]);
            exit;
        }
    } else {
        echo json_encode(['flag' => 0, 'flagmsg' => "檔案索引 {$key} 上傳錯誤代碼：{$error}"]);
        exit;
    }
    $i++;
}

echo json_encode([
    'flag' => 1,
    'flagmsg' => '所有檔案上傳成功',
    'names' => $successNames
]);

關鍵安全與優化建議

1. 檔案類型驗證：勿僅信任 $_FILES['type']，應使用 finfo_file() 檢測真實 MIME 類型。
2. 檔案大小限制：在 php.ini 設定 upload_max_filesize 與 post_max_size，並在代碼中二次驗證。
3. 儲存路徑安全：上傳目錄應置於 Web 根目錄外，或透過 .htaccess 禁止腳本執行。
4. 檔案命名策略：使用 UUID 或雜湊值避免檔名衝突，防止覆蓋與路徑遍歷攻擊。

掌握這套流程，即可輕鬆實現穩健、安全的多檔案上傳功能。