PHP实现用户自定义下载文件保存目录的方法

你当前的PHP后端方案只能触发浏览器默认下载流程，是否弹出“另存为”窗口完全由用户的浏览器设置决定，后端无法直接控制这一行为。要实现让用户主动选择保存位置的功能，需要借助前端的File System Access API来实现，以下是两种可行方案：

方案一：前端直接生成Zip并触发“另存为” #

这种方案无需将文件上传到后端，直接在浏览器端完成Zip打包和保存，体验更流畅：

步骤： #

1. 引入jszip库（前端处理Zip的常用工具）
2. 监听文件上传事件，获取用户选择的文件
3. 使用jszip将文件打包成Zip
4. 调用浏览器的showSaveFilePicker()API弹出“另存为”窗口，保存Zip文件

代码示例： #

<input type="file" id="fileOne">
<input type="file" id="fileTwo">
<button onclick="generateAndSaveZip()">生成并保存Zip</button>

<script src="https://cdn.jsdelivr.net/npm/jszip@3.10.1/dist/jszip.min.js"></script>
<script>
async function generateAndSaveZip() {
    const fileOne = document.getElementById('fileOne').files[0];
    const fileTwo = document.getElementById('fileTwo').files[0];
    
    if (!fileOne || !fileTwo) {
        alert('请选择两个文件');
        return;
    }

    // 创建Zip实例并添加文件
    const zip = new JSZip();
    zip.file(fileOne.name, fileOne);
    zip.file(fileTwo.name, fileTwo);

    // 生成Zip的Blob数据
    const zipBlob = await zip.generateAsync({ type: 'blob' });

    // 调用“另存为”对话框
    try {
        const handle = await window.showSaveFilePicker({
            suggestedName: 'myarchive.zip',
            types: [{
                description: 'Zip压缩包',
                accept: { 'application/zip': ['.zip'] }
            }]
        });
        const writable = await handle.createWritable();
        await writable.write(zipBlob);
        await writable.close();
        alert('保存成功');
    } catch (err) {
        console.error('保存失败:', err);
    }
}
</script>

方案二：后端生成Zip返回Blob，前端触发“另存为” #

如果必须在后端完成Zip打包，可以修改后端代码返回Zip的二进制数据，前端接收后调用“另存为”窗口：

后端PHP修改： #

修正原代码中文件路径的错误（需使用上传文件的临时路径），直接输出Zip二进制内容：

<?php
if ($_SERVER['REQUEST_METHOD'] === 'POST') {
    // 获取两个上传文件的临时路径和原始文件名
    $fileInfos = [
        ['tmpPath' => $_FILES["fileone"]["tmp_name"], 'fileName' => $_FILES["fileone"]["name"]],
        ['tmpPath' => $_FILES["filetwo"]["tmp_name"], 'fileName' => $_FILES["filetwo"]["name"]]
    ];

    $zipname = "myarchive.zip";
    $zip = new ZipArchive;
    if ($zip->open($zipname, ZipArchive::CREATE) === TRUE) {
        foreach ($fileInfos as $info) {
            $zip->addFile($info['tmpPath'], $info['fileName']);
        }
        $zip->close();

        // 输出Zip二进制数据
        header('Content-Type: application/zip');
        readfile($zipname);
        unlink($zipname); // 删除服务器上的临时Zip文件
        exit;
    } else {
        http_response_code(500);
        echo '生成Zip失败';
    }
}
?>

前端代码： #

使用fetch发送文件到后端，接收Blob后触发“另存为”窗口：

<form id="uploadForm">
    <input type="file" name="fileone" id="fileOne">
    <input type="file" name="filetwo" id="fileTwo">
    <button type="submit">生成并保存Zip</button>
</form>

<script>
document.getElementById('uploadForm').addEventListener('submit', async (e) => {
    e.preventDefault();
    const formData = new FormData(e.target);
    
    try {
        const response = await fetch('your-backend-script.php', {
            method: 'POST',
            body: formData
        });
        const zipBlob = await response.blob();

        // 触发“另存为”窗口
        const handle = await window.showSaveFilePicker({
            suggestedName: 'myarchive.zip',
            types: [{
                description: 'Zip压缩包',
                accept: { 'application/zip': ['.zip'] }
            }]
        });
        const writable = await handle.createWritable();
        await writable.write(zipBlob);
        await writable.close();
        alert('保存成功');
    } catch (err) {
        console.error('操作失败:', err);
    }
});
</script>

注意事项 #

• showSaveFilePicker()是现代浏览器API，支持Chrome、Edge、Firefox 116+等版本，旧浏览器可能不兼容
• 若需兼容旧浏览器，可退而求其次：后端返回带Content-Disposition: attachment的响应，同时提示用户在浏览器设置中开启“总是询问下载位置”

内容的提问来源于stack exchange，提问作者happyturtleboy