如何基于现有PHP图片上传代码实现压缩图同步上传？

嘿，刚好我之前用过VEROT的PHP Image Upload Class解决过类似的需求，完美适配你要的「先展示压缩图，点击加载原图」的场景。下面一步步给你讲怎么整合到你现有的代码里：

首先，你需要把VEROT的class.upload.php文件放到你的项目目录里（比如和上传脚本同目录，或者专门的lib文件夹），然后在PHP脚本顶部引入它：

require_once('class.upload.php');

你原来的代码已经完成了文件类型、大小等校验，现在只需要替换掉move_uploaded_file那部分的逻辑，用VEROT类库同时保存原图和生成压缩图：

下面是修改后的核心代码块（替换你原有代码中else里的上传部分）：

} else {
    // 初始化VEROT上传类
    $handle = new Upload($_FILES["fileToUpload"]);
    
    if ($handle->uploaded) {
        // 1. 保存原图（沿用你原来的命名规则）
        $base_name = md5(session_id().microtime()) . basename($_FILES["fileToUpload"]["name"], "." . $imageFileType);
        $handle->file_new_name_body = $base_name;
        $handle->process('uploads/');
        
        if ($handle->processed) {
            $original_filename = $handle->file_dst_name;
            echo "<br />L'image originale a été importée.";
            
            // 2. 生成压缩图（设置宽度为800px，高度自适应保持比例）
            $handle->file_new_name_body = $base_name . '_thumb'; // 压缩图后缀加_thumb区分
            $handle->image_resize = true;
            $handle->image_x = 800; // 可根据需求调整压缩图宽度
            $handle->image_ratio_y = true; // 按比例自动计算高度
            $handle->image_quality = 80; // 压缩质量（0-100，数值越高质量越好）
            $handle->process('uploads/');
            
            if ($handle->processed) {
                $thumb_filename = $handle->file_dst_name;
                echo "<br />La version compressée a été générée.";
                
                // 3. 存入数据库：建议同时保存原图和压缩图文件名，方便前端调用
                $req = $bdd->prepare('INSERT INTO spots(nom, description, img1, img1_thumb, latitude, longitude, pseudoCreateur, idCreateur) VALUES(?, ?, ?, ?, ?, ?, ?, ?)');
                $req->execute(array($_POST['nom'], $description, $original_filename, $thumb_filename, $_POST['latitude'], $_POST['longitude'], $_SESSION['pseudo'], $_SESSION['id']));
                
                // 积分更新逻辑保持你原来的代码不变
                $req = $bdd->prepare('SELECT points FROM users WHERE id = ?');
                $req->execute(array($_SESSION['id']));
                $points = $req->fetch();
                $bdd->exec('UPDATE users SET points = ' . (string)($points[0] + 3) .' WHERE id = '. $_SESSION['id']);
                
                echo "<br /><br />SPOT PUBLIÉ !";
                
                // 清理类库资源
                $handle->clean();
            } else {
                echo "<br />Erreur lors de la génération de la version compressée : " . $handle->error;
                $handle->clean();
            }
        } else {
            echo "<br />Erreur lors de l'importation de l'image originale : " . $handle->error;
            $handle->clean();
        }
    } else {
        echo "<br />Erreur lors de l'upload : " . $handle->error;
    }
}

前端从数据库取出压缩图和原图的文件名，默认显示压缩图，点击时切换成原图（也可以加切换回压缩图的逻辑）：

<!-- 假设从数据库获取到的文件名分别是$thumb_filename和$original_filename -->
<img 
    src="uploads/<?php echo $thumb_filename; ?>" 
    alt="Spot image" 
    data-original="uploads/<?php echo $original_filename; ?>"
    data-thumb="uploads/<?php echo $thumb_filename; ?>"
    onclick="toggleImage(this)"
    style="cursor: pointer;"
/>

<script>
function toggleImage(img) {
    // 点击切换原图/压缩图
    if (img.src === img.dataset.original) {
        img.src = img.dataset.thumb;
    } else {
        img.src = img.dataset.original;
    }
}
</script>

• 确保uploads/目录有读写权限（可设置为chmod 755，根据服务器配置调整）
• 你可以自定义压缩图参数：比如设置image_y固定高度、image_ratio_crop启用裁剪模式，或者调整image_quality平衡质量和文件大小
• VEROT类库还支持加水印、图片旋转等高级功能，有需要可以按需扩展

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