『建站笔记#4』可迁移图床

本站迁过几次服务器。最头疼的不是数据库，是图：WordPress 媒体库默认把绝对地址写进正文，形如 wp-content/uploads/2024/06/foo.jpg。换域名、换机器、整站搬家，文章里的图就死一片。批量替换正文又不敢，文章一多容易误伤。

所以我自己做了个很小的东西：article-image。思路就一句话：正文里只写稳定的图片名，图放在哪由配置决定。这样以后搬家，改一行配置就行，文章不用动。

一、用法（就三行）

文章里这样引用（把网址换成你自己的）：

https://你的网站/wp-content/removeable/article_image.php?res=cover-01
#                ^^^^^^^^^^^^ 这段路径固定
#                                              ^^^^^^^ 逻辑名，对应图文件名（不带扩展名）

要指定格式就带扩展名：

https://你的网站/wp-content/removeable/article_image.php?res=cover-01.jpg
#                                                      带扩展名更稳，不会猜错格式

支持 webp / jpg / jpeg / png / gif / avif。

二、怎么装

仓库在这里，先下载或 git clone： https://github.com/Lossalt/article-image

打开服务器（或者宝塔、1Panel 这类面板的文件管理），把两个 PHP 文件放到网站的这个目录（没有 removeable 就新建一个）：

/wp-content/removeable/article_image.php          # 入口，对外就这个
/wp-content/removeable/article_image.config.php   # 配置，以后搬家只改它

图片放到旁边的 article_images 目录：

/wp-content/removeable/article_images/cover-01.jpg   # res=cover-01
/wp-content/removeable/article_images/cover-02.png   # res=cover-02
# 文件名 = 逻辑名，不写扩展名时按 webp→jpg→png… 顺序自动找

三、改配置（重点就一行）

用记事本或编辑器打开 article_image.config.php，找到 base_url，把它换成你自己的图片地址前缀：

// 只动这一行：换成你的域名，末尾不要多斜杠
'base_url' => 'https://你的网站/wp-content/removeable/article_images',

我的配置是这样的，一般只动 base_url 就够：

<?php
return [
    // 图片地址前缀。图搬到别的机器/CDN，也只改这里
    'base_url' => 'https://cjsy.cc/wp-content/removeable/article_images',

    // '' = 用旁边的 article_images；也可写绝对路径
    'local_dir' => '',

    // true = 图不存在就 404（自己站建议 true，缺图好发现）
    // false = 照样跳转（图在远端时常用）
    'check_local' => false,

    // 只放行白名单字符，防任意文件读取
    'key_pattern' => '/^[A-Za-z0-9_-]{1,64}(\.[A-Za-z0-9]{1,8})?$/',

    // 支持的扩展名；不写扩展名时按此顺序找
    'allowed_exts' => ['webp', 'jpg', 'jpeg', 'png', 'gif', 'avif'],

    // 都找不到又没写扩展名时，默认拼这个
    'default_ext' => 'webp',
];

四、为什么要叫 removeable

意思是这个图床是可拆卸的附属件，不必绑死在 wp-content 下面。图也可以放到另一台服务器、对象存储、CDN：

// 图在别的机器上：WordPress 里两个 PHP 不动，只改指向
'base_url' => 'https://img.example.com/article_images',
'check_local' => false,   // 远端图本地查不到，别 404
// 正文里还是 article_image.php?res=cover-01，一个字不用改

整站迁移的时候：

1. 把 article_images 里的图搬走（或传到新图床）；

2. 新环境放好两个 PHP；

3. 改 base_url（需要时再改 local_dir）；

4. 文章正文一个字都不用批量替换。

更细的说明在仓库 README，搜 docs: explain removable image-bed design intent。

五、顺手做的随机图

还有个 random-img，管侧栏、背景随机出图。部署更简单，整仓放到网站根目录：

git clone https://github.com/Lossalt/random-img.git
# 图丢进 pc/、mobile/，脚本自动扫，加图不用改代码

浏览器打开（换成你的域名）：

https://你的域名/pc.php          # 302 跳到一张随机图
https://你的域名/mobile.php

# ?serve 直出图片字节（本地有图时）
# ?json 给程序用，返回 url / 来源 / 张数
https://你的域名/pc.php?serve
https://你的域名/pc.php?json

Nginx 的话，root 指到 random-img 目录即可，具体配置见仓库 README。