Serv00上搭建一个 PixPro 若梦图床 + 接入Cloudflare R2

jinx2024

Serv00上搭建一个PixPro图床,内存太小,我们可以接入到CFR2 足够个人使用。自己有VPS的也可在宝塔上面部署

---

面板页

后台页

友情提示 使用Serv00搭建的好像不支持PNG格式上传 上传后会显示空白不显示图片

Serv00图床 PNG上传空白 解决办法  复制以下代码 替换到 config/image_processing.php

<?php
/**
 * 将JPEG图片转换为WebP格式
 */
function convertToWebp($source, $destination, $quality = 60) {
    $info = getimagesize($source);

    if ($info['mime'] == 'image/jpeg') {
        $image = imagecreatefromjpeg($source);
    } elseif ($info['mime'] == 'image/gif') {
        return false;
    } else {
        return false;
    }
    $width = imagesx($image);
    $height = imagesy($image);
    $maxWidth = 2500;
    $maxHeight = 1600;
    if ($width > $maxWidth || $height > $maxHeight) {
        $ratio = min($maxWidth / $width, $maxHeight / $height);
        $newWidth = round($width * $ratio);
        $newHeight = round($height * $ratio);
        $newImage = imagecreatetruecolor($newWidth, $newHeight);
        imagecopyresampled($newImage, $image, 0, 0, 0, 0, $newWidth, $newHeight, $width, $height);
        imagedestroy($image);
        $image = $newImage;
    }
    $result = imagewebp($image, $destination, $quality);
    imagedestroy($image);
    gc_collect_cycles();
    return $result;
}

/**
 * 使用Imagick将PNG图片转换为WebP格式
 */
function convertPngWithImagick($source, $destination, $quality = 60) {
    try {
        $image = new Imagick($source);

        // 检查是否包含透明通道
        if ($image->getImageAlphaChannel()) {
            // 设置背景颜色为透明
            $image->setImageBackgroundColor(new ImagickPixel('transparent'));
            $image->setImageAlphaChannel(Imagick::ALPHACHANNEL_ACTIVATE);
            $image = $image->mergeImageLayers(Imagick::LAYERMETHOD_FLATTEN);
        }

        $image->setImageFormat('webp');
        $image->setImageCompressionQuality($quality);

        $width = $image->getImageWidth();
        $height = $image->getImageHeight();
        $maxWidth = 2500;
        $maxHeight = 1600;

        if ($width > $maxWidth || $height > $maxHeight) {
            $ratio = min($maxWidth / $width, $maxHeight / $height);
            $newWidth = round($width * $ratio);
            $newHeight = round($height * $ratio);
            $image->resizeImage($newWidth, $newHeight, Imagick::FILTER_LANCZOS, 1);
        }

        $result = $image->writeImage($destination);
        $image->clear();
        $image->destroy();
        return $result;
    } catch (Exception $e) {
        logMessage('Imagick转换PNG失败: ' . $e->getMessage());
        return false;
    }
}

/**
 * 使用Imagick将GIF图片转换为WebP格式
 */
function convertGifToWebp($source, $destination, $quality = 60) {
    try {
        $image = new Imagick();
        $image->readImage($source);
        $image = $image->coalesceImages();
        foreach ($image as $frame) {
            $frame->setImageFormat('webp');
            $frame->setImageCompressionQuality($quality);
        }
        $image = $image->optimizeImageLayers();
        $result = $image->writeImages($destination, true);
        $image->clear();
        $image->destroy();
        return $result;
    } catch (Exception $e) {
        logMessage('GIF转换WebP失败: ' . $e->getMessage());
        return false;
    }
}

/**
 * 处理图片压缩
 */
function processImageCompression($fileMimeType, $newFilePath, $newFilePathWithoutExt, $quality) {
    $convertSuccess = true;
    $finalFilePath = $newFilePath;

    if ($fileMimeType === 'image/png') {
        $convertSuccess = convertPngWithImagick($newFilePath, $newFilePathWithoutExt . '.webp', $quality);
        if ($convertSuccess) {
            $finalFilePath = $newFilePathWithoutExt . '.webp';
            unlink($newFilePath);
        }
    } elseif ($fileMimeType === 'image/gif') {
        $convertSuccess = convertGifToWebp($newFilePath, $newFilePathWithoutExt . '.webp', $quality);
        if ($convertSuccess) {
            $finalFilePath = $newFilePathWithoutExt . '.webp';
            unlink($newFilePath);
        }
    } elseif ($fileMimeType !== 'image/webp' && $fileMimeType !== 'image/svg+xml') {
        $convertSuccess = convertToWebp($newFilePath, $newFilePathWithoutExt . '.webp', $quality);
        if ($convertSuccess) {
            $finalFilePath = $newFilePathWithoutExt . '.webp';
            unlink($newFilePath);
        }
    }

    return [$convertSuccess, $finalFilePath];
}
?>

也可下载 PixPin  截图软件试试

安装前准备

Serv00账号注册

Github,PixPro项目地址

安装步骤

1. 注册好Serv00账号打开网页进入到面板端添加域名或者用自己的域名都行，这里我用别的网站注册的二级域名。如下图添加
   !([img]https://assets.vviptuangou.com/65b5e8853269dc1517f0c29312f405ec4ff93aac.jpg)

2. 把里面的A记录解析你托管到CF的域名或者别的地方申请的
   !([img]https://assets.vviptuangou.com/89fad1033d1bc063cc48549c59ccc86f90fc45b7.jpg)
   

3. 按照下图打开域名的权限
   
   
   点击Save等待成功

4. 创建MySQL数据库（保存账号及地址）
   
   

5.下载ZIP文件

6. 上传安装包并解压进入文件管理器
   

7. 进入public_html文件夹删除其下所有文件
   

8. 上传安装包到你添加的域名或者Serv00自带域名下
   
   

9. 选择你们下载文件的路径上传好如下图
   
   
   

和上一步一样

10. 进去后如下图所以我们Shift建一直按着然后点击鼠标左键全选
    

11. 移动到我们开始创建域名目录下的public_html
    

12. 修改PHP版本 在域名目录下创建一个文本，名为：.htaccess
    
    

13. 添加PHP版本
    

选择Text Editor 添加以下代码

AddType application/x-httpd-php81 .php

14. 访问你的域名开始安装系统，管理员账户和密码自己设置 ，如果要接入CFR2我们存储选择 S3 下面我会写S3安装方式
    
    
    

15. 点击回到首页就可以上传图片了
    

---

接入R2 前提 已开通 Cloudflare R2

进入到 Cloudflare 面板 找到 R2 右边有一个管理 R2API 令牌点击创建 API令牌 ，创建好后里面有我们需要的访问密钥和机密访问密钥

1. 进入到 Cloudflare 面板 找到 R2 点击创建存储桶

2. 进入后名称随便写。位置选择亚太地区后点击创建存储桶

3. 创建好后点击设置拉到下面看到 R2.dev 子域点击后面的允许访问 ， 连接域需要添加你托管到CF上面域名

4. 14 步我们安装选择S3后看到下图

参数	值
S3 Region	auto
S3 Bucket	你的存储桶名称
S3 Endpoint	你的S3API 后面不要加你的存储桶名称
S3 Access Key ID	R2API令牌访问密钥
S3 Access Key Secret	R2API令牌机密访问密钥
S3 自定义域名	R2.dev 添加的自定义域 或 R2 分配的域名

5. 点击完成安装即可。这是我们上传好的图片 我下面的域名就是我们 R2 分配的域名

6. 我们回到 Cloudflare R2 就会看到刚刚上传的图片