对象存储与图片 CDN
梳理子比主题站点接入 OSS、图片 CDN、防盗链、CORS、媒体附件、灯箱、海报跨域和迁移排查的边界。
对象存储和图片 CDN 可以减轻源站压力,但它们会改变媒体 URL、回源链路、跨域策略和缓存行为。子比主题的文章图片、用户头像、封面、收款码、商品图、论坛封面、附件下载、分享海报和微信分享都依赖 WordPress attachment 或图片 URL,接入对象存储前要先理解这些边界。
不要把“图片能显示”当作唯一验收标准。还要测试上传、缩略图、灯箱、海报生成、微信分享、付费下载、用户头像、商品图、移动端和迁移后的旧图片。
适用场景
| 场景 | 是否适合 |
|---|---|
| 图片和静态资源访问量大 | 适合接入图片 CDN 或对象存储 |
| 源站带宽小 | 适合把图片分发给 CDN |
| 用户上传很多附件 | 适合对象存储,但要确认同步和权限 |
| 付费资源或私密附件 | 不能只靠对象存储 URL,仍要走 Zibpay 或业务权限 |
| 站点还没跑通 | 先不要接入,先完成源站上传和访问测试 |
对象存储解决文件存储和分发问题,不负责 WordPress 权限判断。付费下载、私密附件、用户资料、订单权限仍然要在服务端校验。
先跑通源站
接入前先在源站完成:
- 上传普通图片。
- 生成缩略图。
- 文章插入图片。
- 用户头像和封面上传。
- 商品图片、论坛封面和前台投稿上传。
- 图片灯箱可以打开。
- 分享海报可以生成。
- 付费附件下载权限正常。
如果源站上传本身失败,先看 媒体上传 和 环境检查,不要直接把问题交给对象存储。
WordPress 附件模型
子比主题大量使用 WordPress attachment:
| 数据 | 说明 |
|---|---|
| 附件 ID | 主题很多字段保存的是 attachment ID |
| 附件 URL | 通过 wp_get_attachment_url() 或 wp_get_attachment_image_src() 读取 |
| 物理文件 | wp-content/uploads 中的真实文件 |
| post meta | 头像、封面、商品图、支付证书、收款码等会保存 ID 或 URL |
接入对象存储后,最好仍然让 WordPress 认为“附件是正常 attachment”。也就是说,上传、入库、生成 attachment metadata、返回 URL 这些步骤不能被绕过。
上传文件名
主题支持上传自动重命名。文件名会在入库前被改掉:
if (_pz('newfilename_type') !== 'random') {
$file['name'] = current_time('YmdHis') . mt_rand(10, 99) . mt_rand(0, 9) . '-' . $file['name'];
} else {
$info = pathinfo($file['name']);
$ext = empty($info['extension']) ? '' : '.' . $info['extension'];
$md5 = md5($file['name']);
$file['name'] = substr($md5, 0, 10) . current_time('YmdHis') . $ext;
}对接对象存储时,不要在上传前用原始文件名拼远程 URL。应以 WordPress 最终 attachment URL 为准。否则自动重命名后,数据库 URL、对象存储文件名和实际附件会对不上。
URL 替换方式
对象存储插件通常有两类模式:
| 模式 | 说明 |
|---|---|
| 上传后同步 | 文件先进入 WordPress,再同步到对象存储 |
| 直接上传远端 | 插件接管上传流程,最终仍应创建 attachment |
无论哪种模式,都要确保:
wp_get_attachment_url()返回可访问 URL。wp_get_attachment_image_src()能返回正确尺寸。- 缩略图也被同步或可回源生成。
attachment_url_to_postid()在关键场景仍可用。- 删除附件时远端文件同步删除或有清理策略。
如果插件只替换前台 HTML,不改变 attachment URL,子比主题的海报、下载、用户资料和后台字段可能仍读取旧地址。
防盗链
开启防盗链前先确认这些来源不会被拦截:
| 来源 | 说明 |
|---|---|
| 正式站点域名 | 前台页面 |
www 和裸域名 | 两个访问入口都要覆盖 |
| CDN 回源域名 | CDN 拉取源图 |
| 后台域名 | WordPress 后台预览和媒体库 |
| 微信内置浏览器 | 微信分享图、公众号场景 |
| 支付或第三方页面 | 回调页、订单页里的图片 |
防盗链误拦截时,常见表现是图片 403、灯箱只显示占位图、海报生成失败、微信分享无图、商品图或头像不显示。
CORS 和海报
分享海报会把图片画进 canvas。如果图片来自 OSS、CDN 或启用了防盗链,浏览器可能认为 canvas 被跨域污染,导致无法导出海报。
主题提供 share_img_compatible_s 兼容开关:
if (_pz('share_img_compatible_s')) {
$data['banner'] = zib_get_img_auto_base64($data['banner']);
$data['banner_default'] = zib_get_img_auto_base64($data['banner_default']);
$data['logo'] = zib_get_img_auto_base64($data['logo']);
}优先配置 OSS/CDN 的 CORS,再考虑开启兼容模式。兼容模式会把图片转 base64,能提升兼容性,但也会增加服务端处理和响应体积。
至少允许:
Origin: 当前站点域名
Methods: GET, HEAD
Headers: *
Expose-Headers: Content-Length, Content-Type具体字段按服务商面板为准。配置后清理 CDN 缓存,再重新生成海报测试。
图片灯箱
图片灯箱依赖最终 HTML 中的 <img>、真实图片 URL、懒加载 data-src 和前端脚本。接入 CDN 后常见异常:
| 现象 | 可能原因 |
|---|---|
| 点击没反应 | JS 合并延迟、灯箱脚本没初始化、图片带 no-imgbox |
| 只显示占位图 | CDN 403/404,data-src 被改写,懒加载脚本没执行 |
| 大图打不开 | 原图没有同步到远端或防盗链拦截 |
| 移动端异常 | CDN 图片优化改写尺寸,移动端脚本延迟 |
灯箱细节见 图片灯箱与媒体。
付费附件和下载
普通附件下载入口会读取 attachment,再根据本地文件或 URL 输出:
$attachment_url = wp_get_attachment_url($attachment->ID);
header('location:' . $attachment_url);但付费下载不是普通附件下载。Zibpay 会校验订单、会员、积分、次数、游客订单 Cookie 和下载日志。对象存储的私有文件不要直接把真实 URL 暴露给前端,应该继续走 Zibpay 权限链路。
如果对象存储插件把文件迁到远端后删除本地文件,要确认:
- 普通附件是否可以跳转到远端 URL。
- 付费下载是否仍能校验权限。
- 本地文件下载逻辑是否会因为
get_attached_file()找不到文件而失败。 - 是否需要签名 URL 或临时 URL。
付费链路见 Zibpay 付费下载与资源权限。
用户头像、封面和收款码
用户头像、封面、微信收款码、支付宝收款码等会保存附件 ID 和 URL。上传成功后主题还会删除旧附件或清理缓存。
对象存储接入后要测试:
| 功能 | 检查 |
|---|---|
| 头像 | 新头像显示、旧附件是否清理 |
| 封面 | 作者页和用户中心封面是否更新 |
| 收款码 | 打赏、提现资料、用户设置是否显示 |
| 认证资料 | 上传文件是否可访问且不泄露隐私 |
如果只替换前台图片 URL,而后台保存的附件 ID 失效,迁移、删除、缓存刷新都会出问题。
商品、论坛和模块图片
子比主题商城、论坛和模块会保存大量附件 ID 或图片 URL:
| 模块 | 常见数据 |
|---|---|
| 商城 | 商品封面、相册、规格图、评价图 |
| 论坛 | 板块图、帖子视频封面、图集封面 |
| 小工具 | 幻灯片、图文封面、广告图 |
| 页面模块 | 背景图、按钮图、图标卡片 |
对象存储迁移后,不要只看文章正文图片。首页模块、商城详情页、论坛板块页、移动端底部入口和用户中心也要逐项打开。
缓存策略
适合 CDN 长缓存:
*.jpg
*.jpeg
*.png
*.webp
*.gif
*.svg
*.woff
*.woff2
*.css
*.js谨慎缓存:
HTML 页面
admin-ajax.php
用户中心
购物车
支付页
验证码接口
上传接口
付费下载入口对象存储和图片 CDN 只应加速静态资源。动态页面排除规则见 伪静态、缓存与 CDN。
迁移和回源
从本地 uploads 迁移到对象存储时:
- 先完整备份
wp-content/uploads。 - 同步历史文件到对象存储。
- 确认缩略图和原图都存在。
- 替换或过滤 attachment URL。
- 清理对象缓存、页面缓存和 CDN。
- 抽查不同年份目录的图片。
- 测试头像、封面、商品图、论坛图、海报和下载。
换域名、换 CDN 域名或换对象存储桶时,继续看 站点迁移与换域名。如果附件 ID 还在但物理文件丢了,数据库替换不能解决问题。
常见问题
| 现象 | 优先检查 |
|---|---|
| 图片 403 | 防盗链、Referer、回源域名、权限策略 |
| 图片 404 | 文件未同步、缩略图缺失、路径大小写 |
| 后台媒体库正常,前台不显示 | CDN 缓存、URL 替换、HTTPS 混合内容 |
| 海报生成失败 | CORS、canvas 跨域污染、share_img_compatible_s |
| 微信分享无图 | JS 安全域名、分享图 URL、HTTPS、CORS |
| 上传成功但远端没有文件 | 同步插件任务失败、队列未运行、权限不足 |
| 删除附件后远端仍存在 | 插件未同步删除,需要定期清理 |
| 付费下载绕过权限 | 直接暴露对象存储真实 URL |
| 移动端图片异常 | CDN 图片处理、WebP 兼容、懒加载延迟 |
开发边界
- 上传仍应走
zib_php_upload()和 WordPress attachment,不要直接把文件丢到对象存储后只保存 URL。 - 读取图片优先用
wp_get_attachment_url()、wp_get_attachment_image_src()或主题封装。 - 对象存储 URL 不等于权限校验,付费下载继续走 Zibpay。
- 防盗链、CORS、HTTPS 和 CDN 缓存要一起测试。
- 海报跨域优先配 CORS,兼容模式作为兜底。
- 迁移时保留附件 ID、缩略图、原图和对象存储路径的一致性。
本页吸收了子比官网阿里云 OSS、图片 CDN、缓存加速相关公开教程线索,并结合 action/media.php、action/user.php、inc/functions/zib-attachment.php、inc/functions/zib-share.php、action/function.php、js/poster-share.js、媒体上传、图片灯箱与媒体 和 分享、海报与微信分享 蒸馏整理。