当前位置:首页 > PHP

php实现上传文件夹

2026-02-28 04:15:02PHP

PHP 实现上传文件夹的方法

PHP 原生支持文件上传,但不直接支持文件夹上传。需要通过前端配合(如 JavaScript)将文件夹内容逐个上传,后端 PHP 处理多个文件。以下是实现步骤:

前端部分(HTML/JavaScript)

使用 <input type="file" webkitdirectory directory multiple> 允许用户选择文件夹,并通过 FormData 将文件逐个上传。

<input type="file" id="folderUpload" webkitdirectory directory multiple>
<button onclick="uploadFolder()">上传文件夹</button>

<script>
function uploadFolder() {
    const files = document.getElementById('folderUpload').files;
    const formData = new FormData();

    for (let i = 0; i < files.length; i++) {
        formData.append('files[]', files[i], files[i].webkitRelativePath);
    }

    fetch('upload.php', {
        method: 'POST',
        body: formData
    }).then(response => response.text())
      .then(data => console.log(data));
}
</script>

后端部分(PHP)

upload.php 中处理上传的文件,并按原始文件夹结构保存。

<?php
if (!empty($_FILES['files'])) {
    $uploadDir = 'uploads/'; // 根目录

    foreach ($_FILES['files']['name'] as $i => $name) {
        if ($_FILES['files']['error'][$i] !== UPLOAD_ERR_OK) {
            continue;
        }

        // 获取前端传递的原始路径(如 "folder/subfolder/file.txt")
        $relativePath = $_FILES['files']['name'][$i]; // 需前端正确传递
        $targetPath = $uploadDir . dirname($relativePath);

        // 创建子目录(如果不存在)
        if (!file_exists($targetPath)) {
            mkdir($targetPath, 0777, true);
        }

        // 移动文件到目标路径
        move_uploaded_file(
            $_FILES['files']['tmp_name'][$i],
            $targetPath . '/' . basename($name)
        );
    }

    echo "上传成功!";
}
?>

注意事项

  1. 路径处理:前端需通过 webkitRelativePath 获取文件的相对路径(部分浏览器支持)。
  2. 大文件限制:修改 php.ini 中的 upload_max_filesizepost_max_size
  3. 安全性:检查文件类型、重命名文件,避免目录遍历攻击。
  4. 兼容性:非所有浏览器支持文件夹上传(Chrome、Edge 支持较好)。

替代方案(ZIP 上传)

若浏览器不支持文件夹上传,可让用户压缩为 ZIP 文件,后端解压:

$zip = new ZipArchive;
if ($zip->open($_FILES['zip']['tmp_name']) === TRUE) {
    $zip->extractTo('uploads/');
    $zip->close();
    echo "解压成功!";
}

通过上述方法可实现文件夹上传功能。

php实现上传文件夹

标签: 文件夹上传
分享给朋友:

相关文章

php实现上传

php实现上传

PHP 文件上传实现 HTML 表单设置 创建一个包含文件上传字段的 HTML 表单,确保表单的 enctype 属性设置为 multipart/form-data,这是文件上传必需的设置。 &l…

vue实现上传进度

vue实现上传进度

Vue 实现文件上传进度 在 Vue 中实现文件上传进度可以通过 XMLHttpRequest 或 axios 的 onUploadProgress 事件来监听上传进度。以下是两种常见实现方式: 使…

vue java实现分片上传

vue java实现分片上传

分片上传的实现原理 分片上传是将大文件分割成多个小块分别上传,最后在服务器合并的技术。这种方式能解决大文件上传超时、网络不稳定等问题,同时支持断点续传。 前端Vue实现 前端需要使用File API…

vue实现列表批量上传

vue实现列表批量上传

批量上传列表的实现方法 前端部分(Vue.js) 使用<input type="file">元素配合multiple属性实现多文件选择 <template> <d…

Vue实现图片批量上传

Vue实现图片批量上传

Vue 图片批量上传实现方法 准备工作 安装必要依赖(如axios、element-ui等),确保项目基于Vue 2/3环境。以Vue 3 + Element Plus为例: npm install…

vue实现上传预览功能

vue实现上传预览功能

Vue实现上传预览功能 基本文件上传组件 使用<input type="file">获取文件,通过FileReader读取文件内容: <template> <di…