简介

最近因为图片数开始变多,仓库体积太大,部署开始变慢,想做迁移图床的打算,无独有偶,搜到国内的一个开源云上相册 —— 兰空图床,便开始捣鼓……

使用体验

安装

安装要求:

固定 ip 服务器一台 + 连接工具 xshellxftp

兰空图床访问域名(可选)

CDN 访问域名(使用兰空图床访问域名也可以,此访问域名起到 CDN 加速效果,推荐使用)

typora

picgo

因为之前装了好几次的 php 都以失败告终,安装兰空图床不可能再用本地安装了,所以我找到了它的 docker 版本:wbsu2003/lskypro,尝试了下使用还不错,但是 picgo 上传失败了,请教博主 张时贰才知道版本不对, wbsu2003/lskypro 的版本最新只是 v1.6.4 而已,源码都 2.x 了,所以我又找了个 docker 部署的版本:halcyonazure/lsky-pro-docker,这个版本会定时拉取 兰空图床最新源码并构建推送到官方镜像源。

shell
1
docker run -itd --restart=always --name=lskypro -p 9110:80 -v /www/lskypro:/var/www/html halcyonazure/lsky-pro-docker

里面已经有构建好的 php 环境,不用再安装 php,但是还是需要安装数据库,docker 安装可参考我的一篇文章:Docker 搭建 Mysql 环境并允许远程访问,本地安装可以使用我的一键安装脚本: install-mysql-5.7.sh

参数解释
-itd-i 以交互式运行容器,-t 分配一个伪输入终端,-d 后台运行
–restartalways 表示重启 docker 时自动启动容器
-p 指定端口,格式为 主机 (宿主) 端口:容器端口
-v 目录挂载到其他盘,格式主机 (宿主) 目录:容器目录
–name 重命名容器名字

设置 Https 反代

因为 nginx 是安装在服务器的,方便管理,这里也提供一键安装脚本:install-nginx-1.21.3.sh

/usr/local/nginx/conf/nginx.conf 添加以下代码:

nginx
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
#监听kl.shinie.top
server {
listen 80;
server_name kl.shinie.top;
rewrite ^(.*)$ https://${server_name}$1 permanent;
}
server {
listen 443 ssl;
ssl_certificate /etc/ssl/kl.shinie.top/kl.shinie.top.pem; #证书位置
ssl_certificate_key /etc/ssl/kl.shinie.top/kl.shinie.top.key; #证书位置
ssl_session_cache shared:SSL:4m;
ssl_session_timeout 10m;
ssl_ciphers HIGH:!aNULL:!MD5;
ssl_prefer_server_ciphers on;
server_name kl.shinie.top;
location /{
proxy_http_version 1.1;
proxy_set_header Upgrade $http_upgrade;
proxy_set_header Connection "upgrade";
proxy_set_header Host $host:$server_port;#主要这一行添加$server_port
proxy_set_header X-Real-IP $remote_addr;
proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
proxy_set_header X-Forwarded-Host $http_host;
proxy_set_header X-Forwarded-Port $server_port;
proxy_set_header X-Forwarded-Proto $scheme;
proxy_pass http://127.0.0.1:9110/;
client_max_body_size 20000m;
}
}

设置好后我遇到了一个资源无法加载的问题:使用兰空图床时无法加载谷歌字体以及解决方法

访问域名

安装兰空图床

设置数据库和管理员账号密码

设置数据库和管理员账号密码

安装完成

安装完成

获取 token

获取token

首先我们需要获取 token 才能上传图片,可使用 curl 来发送 post 请求获取 token:

shell
1
curl -H "Content-Type: application/json" -X POST -d '{"email": "管理员邮箱", "password":"管理员密码" }' "你的域名/api/v1/tokens"

配置 picgo

需要先安装 picgo 插件

安装picgo插件

Server 填入域名,Auth token 填写上一步获取的 token

配置兰空图床

配置 typora

软件链接:https://pan.baidu.com/s/18ZXyZmf3Oj4avrIf15jZwA?pwd=6666 提取码:6666

在文件 -> 偏好设置设置 picgo 程序:

配置typora

粘贴图片进去时会提示上传图片

粘贴图片

设置 CDN

在源站信息配置图床的 ip 和端口

设置CDN

在储存策略修改访问网址:

修改访问网址

一个简单的图床就配置好了

图床迁移解决方案

原方案

原来使用本地图片,存放在 ButterflyBoot/source/img,每 hexo new 一篇文章出来就在 ButterflyBoot/source/img 新建一个文件夹,文件夹名称使用 hexo-abbrlink 生成的永久链接,链接的时候使用../img/xxxx/xxx.png 格式,既能在 typora 编辑器上看到,也能在部署后看到图片,但是这样有一个缺陷:仓库体积会因为图片而变得很大,于是才有后面的图床迁移方案。

兰空图床迁移方案

首先在 /www/lskypro/storage/app/uploads 上传本地的 img 文件夹

上传本地img文件夹

修改文件夹所有者以及文件权限:

shell
1
2
chown -R 33 /www/lskypro/storage/app/uploads/img/
chmod -R 700 /www/lskypro/storage/app/uploads/img/

创建一个储存策略,其中储存路径是 /var/www/html/storage/app/uploads/imgimg 就是上传服务器的图片文件夹名称

创建储存策略

测试访问

测试访问

在 vscode 一键替换这些图片链接即可

vscode一键替换

新建文章时可在角色组编辑上传路径为文章链接,如果 CDN 没了或者链接失效,可以立即回滚到原方案

角色组编辑

评价

这次适配可以完美替换本地链接,减少仓库体积,而且不用每次处理图片时都要去 tinypng 压缩一遍图片再上传

可以看出,本地图片和图床链接区别不大,vscode 的一键替换就可以完成,容错率高。

本地图片和图床链接区别

总体来说,此次图床迁移方案非常 nice。