好物推荐 - EasyImage

背景

我们平常写作时，一般都是先在本地把文字码好，把图片配好，然后再发布到博客和各个平台之上。这个过程就涉及到本地的图片如何上传的问题。

如果是使用Hugo自建的静态博客还好，直接在本地仓库编辑、编译、同步所有文件，包括图片等资源。

如果是如头条号等平台，那就麻烦了，需要先将本地图片都上传到平台之上，再手动更新一下插入的图片链接。

如果使用某个公共的图床服务呢，事先将图片上传到图床，本地编辑时直接使用图床链接。这就对公共图床的稳定性提出了要求，一旦公共图床挂了，本地原始文章也挂了。

下面我们就介绍如何使用自建图床来优化写作发布过程。

准备工作

自建图床，由于涉及到文章的发布，所以我们需要一个公网ip和一个服务器。但是这里，我们更推荐大家购买一个云服务器，比如阿里或华为的ECS，最低配的1核1G的主机就足够我们使用了，还自带公网ip（哈哈有点打广告的嫌疑）。

如果家庭宽带的话，可以向运营商申请。但是家庭宽带没有开发 80/443 端口，这虽然不影响我们自建图床的使用，但无法使用默认端口，多少有些不方便。但使用家庭宽带和家庭服务器的好处就是，带宽是足够的，存储空间也是足够的，同时图床还兼顾了备份的功能。

软件安装

这里替作者打个小广告: EasyImage - 演示 - 打赏。我们要尊重开源作者，打赏一下是可以的😄

EasyImage是作者icret以 html5 和 php 为基础编写的一个图床软件，特点/功能包括：

支持 API
支持仅登录后上传
支持设置图片质量
支持压缩图片大小
支持文字/图片水印
支持设置图片指定宽/高
支持上传图片转换为指定格式
支持限制最低宽度/高度上传
支持上传其他文件格式
在线管理图片
支持网站统计
支持设置广告
支持图片鉴黄
……

我们将使用Docker来安装EasyImage，compose.yaml文件内容如下：

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
version: '3.3'
services:
  easyimage:
    image: ddsderek/easyimage:latest
    container_name: easyimage
    ports:
      - '3000:80'
    environment:
      - TZ=Asia/Shanghai
      - PUID=1000
      - PGID=1000
      - DEBUG=false
    volumes:
      - './config:/app/web/config'
      - './i:/app/web/i'
    restart: unless-stopped

这里我们只需要注意两个挂载点：config是图床的配置文件，i是上传的图片保存点。

1
2
3
mkdir -p easyimage/{config,i}
cd easyimage 
docker compose up -d

现在，我们的自建图床就跑起来了，看起来是不是很简洁？

反向代理

为了方便访问我们的图床服务，设置反向代理是必不可少的。另外，如果你像我一样使用家庭服务器自建图床，没有固定的公网IP，还需要配合DDNS来动态更新域名对应的IP，这个就不在这里详述了。

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
server {
    listen 443 ssl;
    listen [::]:443 ssl;
    server_name <your domain>;

    # ssl设置
    ...

    location / {
        proxy_pass          http://127.0.0.1:3000;
        
        proxy_http_version  1.1;
        proxy_set_header    Upgrade             $http_upgrade;
        proxy_set_header    Connection          "upgrade";
        
        proxy_set_header    Host                $host:$server_port;
        proxy_set_header    X-Real-IP           $remote_addr;
        proxy_set_header    X-Real-PORT         $remote_port;
        
        proxy_set_header    X-Forwarded-Host    $http_host;
        proxy_set_header    X-Forwarded-Proto   $scheme;
        proxy_set_header    X-Forwarded-For     $proxy_add_x_forwarded_for;
    }
}

当然我们也可以使用NginxProxyManager来设置反向代理，更方便快捷。

图床使用

手动使用图床

如图一所示，我们可以直接使用网页上传图片至图床。这个方法适用于一些固定的图片资源，或者是某些我们预先准备好的素材，如照片等。然后我们写作时，直接插入已经上传好的图片链接。

自动使用图床

EasyImage支持使用API的方式使用图床服务。在开始之前，我们需要在图床后台设置好token，这是我们上传图片时凭证。

接下来就是在写作软件中配置好上传接口。这里以MWeb例，在偏好设置中添加自定义上传服务：

图床优化

EasyImage支持上下行接口分离，即使用两个域名，分别对接图片的上传与下载，这样就能够保证图床只有我们自己能够使用，同时也能够保证对图床服务升级换代时不会影响图片的下载。

首先，我们需要进入EasyImage的网站设置，分别设置网站域名与图片域名：

由于我的家庭宽带没有开放80/443端口，这里只需要简单的在网站域名后面去除端口号就可以保证外网无法访问图床后台。

其次，定义一个Nginx服务提供图片下载功能：

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
server {
    listen 8088;
    server_name <your domain>;

    root    /path/to/easyimage/;
    index   index.html;
    location / {
        try_files $uri $uri/ =404;
    }
}

这样一来，通过 url 下载图片只依赖于Nginx，而不需要EasyImage服务。即使是EasyImage服务挂了也不会影响图片的下载。另外，上下行分离之后，下载服务可以无须使用 https 协议。

文章编辑

现在我们进行写作时就有了两种选择：

先预先将素材手动上传至图床，写作时直接插入图床链接。这种方法适合于照片等事先准备好的素材，一个操作即保存了素材，又可通过浏览图片拿到url插入文章中；其次这种方法对写作软件没有要求，不需要 url 替换功能，适用于Wiki.js和Wordpress这一类没有该功能的软件。
直接将图片粘贴进文章，发布时再上传至图床。这种方法适用于像我这样边写作边截图的情况，直接截图粘贴进文章，不用过多的操心其他事情。使用这种方法对写作软件提出了一个要求，就是发布时必须有 url 替换的功能。

文章发布

为了保证本地原始文章的可靠性，也为了方便，我写作时一直都是使用本地图片，终于到了要发布的时候了，是时候让大家看看怎么自动上传图片至图床。仍是以我个人使用的MWeb为例，点击发布 - 把本地图片传至图床 - 上传本地图片：

这里图片就分为本地和远程链接两部分，再点击复制 Markdown或复制 HTML就可以将文章内容粘贴到头条号、知乎等平台。

看到这里，有人就会问，使用自建图床的稳定性怎么解决：

以头条号和知乎为例，我亲自测试过，在发布文章时，将复制的HTML内容粘贴过去之后，平台会马上从我的自建图床拉取文章里面的图片并替换 url。所以说，只要我们在发布文章时自建图床是可用的就行。换句话说，只要我们服务器上的图片文件不丢，图床就是稳定的。

结束语

其实这整个过程的实现，最重要的部分还是依赖于写作软件自动化上传与替换url的功能，而自建图床则是保证这个过程顺利可靠的完成。如果您缺少必要的资源（公网IP和服务器），退而求其次的选择公共图床也是可以的。但需要注意的就是本地原始文章不要使用公共图床的资源，也就是写作时不要使用第一种方法，而且你的写作软件还必须支持 url 替换功能。