webp能将原图压缩30%左右还能保持清楚。所以正在被越来越多的人喜欢。
pb要增这个功能,第一步:找到ueditor中的Uploader.class.php,任意处添加函数。
/** * 将图片转换为WebP格式 */ private function convertToWebP() { $originalFilePath = $this->filePath; // 保存原始文件路径 $webpFilePath = preg_replace('/\.(jpg|jpeg|png)$/i', '.webp', $this->filePath); $webpFullName = preg_replace('/\.(jpg|jpeg|png)$/i', '.webp', $this->fullName); $webpFileName = preg_replace('/\.(jpg|jpeg|png)$/i', '.webp', $this->fileName); if ($this->fileType === '.jpg' || $this->fileType === '.jpeg') { $image = imagecreatefromjpeg($this->filePath); } elseif ($this->fileType === '.png') { $image = imagecreatefrompng($this->filePath); } else { return false; } if ($image) { if (imagewebp($image, $webpFilePath)) { $this->filePath = $webpFilePath; $this->fullName = $webpFullName; $this->fileName = $webpFileName; $this->fileType = '.webp'; $this->fileSize = filesize($webpFilePath); imagedestroy($image); unlink($originalFilePath); // 删除原始文件而不是WebP文件 return true; } imagedestroy($image); } return false; } /** * 转换上传的图片为 WebP 格式(不影响原始文件) */
第二步:请找到如下代码(大概率出现在函数 handleFile()
或 saveFile()
中):
找到:
$this->stateInfo = $this->stateMap[0];
后添加:
$this->convertToWebP(); // 上传成功后生成 .webp 副本
效果如:
$this->stateInfo = $this->stateMap[0]; $this->convertToWebP(); // 上传成功后生成 .webp 副本
第三步:funtion中的file.php中添加一个函数
// 添加一个新的函数用于转换图片为WebP格式 function convert_to_webp($src, $dest, $quality = 80) { $info = getimagesize($src); $is_converted = false; switch ($info['mime']) { case 'image/jpeg': $image = imagecreatefromjpeg($src); $is_converted = imagewebp($image, $dest, $quality); imagedestroy($image); break; case 'image/gif': // 对于GIF文件,直接返回false,不进行WebP转换 return false; break; case 'image/png': $image = imagecreatefrompng($src); $is_converted = imagewebp($image, $dest, $quality); imagedestroy($image); break; default: return false; } return $is_converted; }
第四步:在// 处理并移动上传文件function handle_upload中的末尾找到并修改,
// 如果是图片 if (is_image($file_path)) { // 进行等比例缩放 if (($reset = resize_img($file_path, $file_path, $max_width, $max_height)) !== true) { return $reset; } // 图片打水印 if ($watermark) { watermark_img($file_path); } } return $save_file;
改成:
// 如果是图片 if (is_image($file_path)) { // 进行等比例缩放 if (($reset = resize_img($file_path, $file_path, $max_width, $max_height)) !== true) { return $reset; } // 图片打水印 if ($watermark) { watermark_img($file_path); } // 转换为WebP格式 $webp_path = preg_replace('/\.\w+$/', '.webp', $file_path); if (!convert_to_webp($file_path, $webp_path)) { // 如果转换失败,保留原始文件格式 $webp_path = $file_path; } else { // 删除原始格式的图片文件 if (file_exists($file_path)) { unlink($file_path); } $file_path = $webp_path; } } // 返回WebP格式的文件路径 $save_file = str_replace(ROOT_PATH, '', $file_path); // 获取文件站点路径 return $save_file;
Ok了,我们现在来测试一下上传图片。下面的图片是我修改后上传的,点右键,查看源代码,可以看到图片已经转换成webp格式了。原图为1.07M,压缩后为:629KB