原本博客的图片都是放在微博图床的,为此我还专门买了一个微博小号。结果坚挺了好多年的微博图床,突然限制外链,导致博客的所有图片都挂了。

最近一直想自建图床,但是没找到适合的程序。最基本的需求就是能够配合 ShareX 上传。

无意间发现了一个还不错的图床程序PicUploader,搭建比较简单,这里记录一下。

简介

Github 项目:https://github.com/xiebruce/PicUploader

作者编写的详细使用文档:https://www.xiebruce.top/17.html

作者编写的文档非常详细,但是有点太复杂了,我只是想在 VPS 上搭建一个自用。所以本文记录的是在 VPS 上配合宝塔面板,简单搭建 PicUploader,然后配合 ShareX 一键截图上传、返回 Markdown 链接。

注意,此程序在使用过程中发现有些许问题。自行考虑是否使用,大家可以尝鲜

准备工作

  • 一台 VPS
  • 基础的 VPS 使用能力
  • 一个域名

新手可以先看下之前的文章:

安装 PicUploader

安装宝塔面板

作者提供的教程很详细,但是偏偏没有介绍如何在 VPS 上搭建。这里使用适合新手使用的宝塔面板部署LNMP,详细的宝塔安装教程可以看之前的文章:

这里就不再赘述。

假设你已经安装好宝塔面板,安装好Nginx、MySQL、PHP,然后继续看下文。

其实 PicUploader 只需要安装 Nginx 和 PHP 即可。

添加站点

如下图,在宝塔面板点击 网站 - 添加站点

uud.me-1557734373.jpg

在弹出的窗口中,如下图设置:

uud.me-1557734505.jpg

点击提交后,就会显示你刚刚添加的站点,点击根目录就会进入网站目录:

uud.me-1557735385.jpg

下载 PicUploader 程序

之后,回到 Xshell 对话窗口,即你的 VPS 的会话窗口,进入你刚添加的站点根目录。

比如我刚添加的站点根目录是 /www/wwwroot/pic.uud.me,那么就在 VPS 会话窗口中输入如下命令,然后回车:

cd /www/wwwroot/pic.uud.me

然后输入如下命令,然后回车:

git clone https://github.com/xiebruce/PicUploader

如下图,即为下载完成:

uud.me-1557735673.jpg

之后回到宝塔面板的站点根目录,刷新页面,就会看到一个新的文件夹 PicUploader

uud.me-1557735788.jpg

配置站点

在宝塔面板左侧菜单栏,点击 网站,找到你添加的站点,点击该站点右侧的 设置

uud.me-1557736243.jpg

运行目录

在弹出的窗口中,选择网站目录,设置 运行目录/PicUploader,选择后保存即可:

uud.me-1557736302.jpg

设置SSL

这个是可选,不过建议设置。如下图选择 SSL- Let’s Encrypt,填写管理员邮箱,勾选你的域名,然后点击申请即可:

uud.me-1557736607.jpg

注意:申请 SSL 前需要确保你的域名已经解析至 VPS 的IP,并且没有开启 CDN

申请成功后,打开 强制Https 即可

设置配置文件

最关键的步骤是这个

点击 配置文件 进行修改,这里贴出我的配置,需要注意你的配置文件跟我的并不一样:

server
{
    listen 80;
    listen 443 ssl http2;
    server_name pic.uud.me;
    root /www/wwwroot/pic.uud.me/PicUploader;
    
    #SSL-START SSL相关配置,请勿删除或修改下一行带注释的404规则
    #error_page 404/404.html;
    #AUTH_START
    auth_basic "Authorization";
    auth_basic_user_file /www/server/pass/pic.uud.me.pass;
    #AUTH_END
    #HTTP_TO_HTTPS_START
    if ($server_port !~ 443){
        rewrite ^(/.*)$ https://$host$1 permanent;
    }
    #HTTP_TO_HTTPS_END
    ssl_certificate    /www/server/panel/vhost/cert/pic.uud.me/fullchain.pem;
    ssl_certificate_key    /www/server/panel/vhost/cert/pic.uud.me/privkey.pem;
    ssl_protocols TLSv1 TLSv1.1 TLSv1.2 TLSv1.3;
    ssl_ciphers ECDHE-RSA-AES128-GCM-SHA256:HIGH:!aNULL:!MD5:!RC4:!DHE;
    ssl_prefer_server_ciphers on;
    ssl_session_cache shared:SSL:10m;
    ssl_session_timeout 10m;
    error_page 497  https://$host$request_uri;

    #SSL-END
    
    #ERROR-PAGE-START  错误页配置,可以注释、删除或修改
    error_page 404 /404.html;
    error_page 502 /502.html;
    #ERROR-PAGE-END
    
    #PHP-INFO-START  PHP引用配置,可以注释或修改
    include enable-php-73.conf;
    #PHP-INFO-END
    
    #REWRITE-START URL重写规则引用,修改后将导致面板设置的伪静态规则失效
    include /www/server/panel/vhost/rewrite/pic.uud.me.conf;
    #REWRITE-END
    
    #禁止访问的文件或目录
    location ~ ^/(\.user.ini|\.htaccess|\.git|\.svn|\.project|LICENSE|README.md)
    {
        return 404;
    }
    
    #一键申请SSL证书验证目录相关设置
    location ~ \.well-known{
        allow all;
    }
    
     location ~ .*\.(gif|jpg|jpeg|png|bmp|swf)$
    {
        expires      30d;
        error_log off;
        access_log /dev/null;
    }
    
    location ~ .*\.(js|css)?$
    {
        expires      12h;
        error_log off;
        access_log /dev/null; 
    }
    
    location / {
        index dashboard.php;
        try_files $uri $uri/ index.php$is_args$args;
    }

    location ~ \.php$ {
        fastcgi_pass 127.0.0.1:9000;
        fastcgi_index index.php;
        include fastcgi.conf;
    }
    
    access_log  /www/wwwlogs/pic.uud.me.log;
    error_log  /www/wwwlogs/pic.uud.me.error.log;
}

重点需要添加的内容:

location / {
        index dashboard.php;
        try_files $uri $uri/ index.php$is_args$args;
    }

    location ~ \.php$ {
        fastcgi_pass 127.0.0.1:9000;
        fastcgi_index index.php;
        include fastcgi.conf;
    }

这个步骤需要细心对比自行添加,添加完成后保存即可。

设置权限

这一步比较关键,不过很简单。

在宝塔面板,你添加的站点的根目录,找到文件夹 PicUploader,点击右侧的 权限,将该文件夹的所有者更改为www

之后就可以打开你的域名,如无意外即可使用

更详细的使用设置文档,可以参考作者的文档:https://www.xiebruce.top/17.html

配合ShareX上传

看作者的文档就行,非常详细了

直达链接:https://www.xiebruce.top/17.html#ShareX

后话

写到最后,在使用过程中发现了些问题,会导致在上传界面一直显示“上传中“,无法获得返回的链接

但是在上传历史那里却又看到已经上传成功,并且链接能够打开

总的来说,就是使用上有毛病,要等作者解决。

所以写到最后两个步骤就有点马虎

Last modification:March 17th, 2020 at 12:12 pm
如果觉得我的文章对你有用,请随意赞赏