简单演示:

需要配合的工具: PicGo
设置上传路径: blog/2024/

腾讯云部分:

图片直接上传至腾讯云对象存储, 并设置:超过30天 自动转为低频存储。
腾讯云数据万象,创建宽高最大为1024px的缩略图,原图地址加上!1 即可。
腾讯云CDN 全球加速。
创建子用户,赋予COS权限,获取密钥对。

Cloudflare部分:

Workers:

若请求路径以!1结尾:则从R2的/blog1024路径下取图片,若缩略图不存在, 则从腾讯云!1取缩略图,并转存至R2的/blog1024路径下,读取R2中的缩略图并返回。
若请求路径没有!1: 则从R2 /blog中取图片,若不存在,则从腾讯云获取,并转存至R2 /blog路径下,读取R2中的图片并返回。
绑定域名为: cf2.x.com

R2部分:

创建存储桶bucket,名称为pub。
设置生命周期策略,blog/ 与 blog1024/ 开头, 且超过120天的旧文件,删除。
上传的碎片文件,超过7天,删除。
绑定域名为: pub.x.com

博客站点 图片路径与JS

博客站点的img标签直接写/blog/2024/xxxx.png这种的相对路径。

JS转换为R2的域名:
如果以!1结尾,则使用R2/blog1024的缩略图。
如果没有!1结尾,则使用R2/blog的图片。

如果on error事件触发,则使用Cloudflare Workers的域名。

(下次再有人访问同一个文件时,会从R2中读取。)