一文多发到公众号、知乎、掘金:图片为什么总裂?聊聊防盗链和外链配图

37 阅读7分钟

最近我习惯把同一篇技术文章同时发到公众号、知乎、掘金和自己的博客。本以为是复制粘贴的事,结果最容易翻车的不是排版,而是图片:在知乎里好好的图,搬到公众号裂了一片;从公众号复制出去的图,到了掘金又全是占位符;自己博客上能看,发给海外的朋友却说全是叉。

来回折腾几次后,我把"一文多发的配图"这件事彻底理顺了。这篇不讲某个工具,而是把图为什么裂、怎么定位、几种方案的取舍,以及一套平台无关的外链配图工作流一次讲清。

一、先搞清楚:图为什么会"裂"

网页里一张图能不能显示,本质是浏览器拿着 <img src> 里的 URL 去请求,能不能顺利拿到图片数据。拿不到,就裂。常见原因就两类:链接失效,或者被防盗链拦截。

各个内容平台的图床,其实都是"围墙里的花园":

  • 公众号的图片托管在 mmbiz.qpic.cn,带 Referer 防盗链,被外站直接引用时经常返回 403;你把外链图贴进公众号,后台还会把它转存成微信自己的链接——这篇在微信里能看了,但这个链接你拿不到、也没法稳定外发到别处。
  • 知乎的图在 *.zhimg.com,同样有防盗链策略,直接把 zhimg 链接贴到别的平台,时好时坏。
  • 反过来,任意外链图贴进公众号正文,微信也不保证长期保留外链,最终几乎都要落到它自己的图床上。

简单说一下 Referer 原理(点到为止):浏览器请求图片时,会带上"当前页面是哪个域名"的信息,图床服务器一看引用方不在白名单里,就返回 403 或一张占位图。所以同一张图在 A 平台能看、在 B 平台裂开,往往不是图床挂了,而是防盗链在拦。

那到底是链接没了,还是被防盗链拦了?我一般用三步自查,比反复刷新靠谱:

  1. 看状态码。 打开开发者工具的 Network,过滤 Img,刷新文章,点开那张裂图:404 基本是链接失效或被删;403 多半是防盗链;状态码 200 却不显示,再看是不是被重定向到了占位图,或者命中了 mixed content(https 页面里引用 http 的图,被浏览器直接拦掉)。

  2. 用 curl 对比 Referer。 把图片地址复制出来,分别在终端请求两次,一次不带来源、一次带上目标站点:

    curl -I "https://example.com/pic.jpg"
    curl -I -e "https://juejin.cn/" "https://example.com/pic.jpg"
    

    一次返回 200、一次返回 403,基本就坐实是 Referer 防盗链,而不是图本身丢了。

  3. 无痕窗口直接打开图片 URL。 图片地址单独能打开、嵌进文章里就裂,也说明图没挂,是引用方被拦。

这就引出一个关键结论:平台自家的图床,是为"在它自己页面里展示"服务的,不适合当跨平台的统一图源。 你在 A 平台上传的图,天然不属于 B 平台。

二、几种做法,我都试过

做法操作方式优点主要问题
每个平台后台分别重传发文时逐张手动上传最稳,不依赖外链一篇发 5 个平台就传 5 遍图;改图要重来一遍;本地素材越堆越乱
直接引用某平台图床链接复制 zhimg / mmbiz 链接最省事防盗链 403,几乎必裂
图丢 Git 仓库走 jsDelivr借 CDN 分发上手简单、能版本管理国内访问不稳、仓库体积膨胀、有热链政策风险
自建对象存储 OSS + CDN完全自己掌控稳定、可控要配存储桶、CDN、域名、缓存,还要长期盯着,精力成本高
统一一个允许外链的图床一次上传、多处复用同一份链接一份 Markdown 走天下,改图不换链得选一个不乱做防盗链、国内外都能稳定打开的图床

其中"图丢 Git 仓库"这条我踩得比较实,jsDelivr 在国内时快时慢,README 里的图说裂就裂。我之前专门写过一篇 GitHub README 图片托管方案的对比,把传仓库、jsDelivr、自建 OSS 这几条路都走过一遍:juejin.cn/post/768640… ,这里就不重复了。

比下来,对个人作者性价比最高的,是最后一种:把图片从各个平台里抽出来,放到一个独立、允许外链的图床上,正文里只写一份图链。 注意核心不是用哪个产品,而是"图源独立"这件事。

三、一套平台无关的外链配图工作流

确定了"图源要独立",具体怎么落地?我把它固化成了下面几步,全程不绑定某个平台,换任何一个允许外链的图床都适用。

  1. 写作阶段统一外链化。 本地用 Markdown 写(Typora、Obsidian、VS Code 都行),图片不塞进文章目录、不丢进同步盘,而是统一传到图床,正文里只放外链。这样稿件目录本身始终是纯文本,随便同步、随便换设备。
  2. 优先复制 Markdown 链接。 图床一般同时给 URL 和 Markdown 两种格式,直接复制 ![](...) 粘进正文,不用自己拼标签,也避免手写时漏掉 ! 导致链接不显示图。
  3. 分发时区别对待:
    • Markdown 类平台(知乎、掘金、博客园、CSDN、Hexo/Hugo):直接粘贴同一份 Markdown,外链图都能加载,不用重传一张图;
    • 公众号是唯一的特例:它最终都要把图落到微信自己的图床,所以在公众号后台最后一步逐张补传(或用支持"图片自动转存到微信"的排版工具代劳)。也就是"一份图链走 80% 的平台,公众号单独处理"。
  4. 两个省心的小习惯: 一是按文章建多级目录,比如按年份/主题分文件夹,后期找图、批量管理都清楚;二是坚持同名覆盖上传,架构图要改就用原文件名覆盖传一次,所有平台引用的图同时更新,不用逐篇替换链接。
  5. 老文章裂图抢救。 已经散落在各家图床、开始裂的图,没必要一张张强。我会先用正则把正文里的图片链接批量抽出来,比如 VS Code 里用 !\[.*?\]\((https?://[^)]+)\) 匹配,再用图床常见的"按 URL 批量抓取转存"功能一次性迁过去,最后全文替换旧域名即可,比手动重传快一个数量级。

四、我固定用的那一层

这一层我自己用的是图床小镇。说实话走到第三步,选任何一个允许外链、国内外打开都稳定的图床都可以;我最终留下它,主要是两点正好对上前面的习惯:不做 Referer 防盗链拦截,以及同名覆盖上传后链接不变、改图不用逐篇换链。它对我而言就是把图片变成一份独立、稳定、到处能引用的资产,而不是锁死在某个平台里。

五、发文前的配图检查清单

每次一文多发前,我会顺手过一遍:

  • 图源是否统一放在"允许外链、不乱做 Referer 拦截"的地方,而不是直接引用某平台自家图床;
  • https 页面里的图是否也都是 https,避免 mixed content 被浏览器拦;
  • 发布前在目标平台预览,并在 Network 里确认图片请求都是 200,而不是 403/404;
  • 有没有海外读者,要不要提前确认图片在境外网络下的打开速度;
  • 公众号是否已经在后台单独把图转存了一遍;
  • 需要更新的图是不是走了"同名覆盖",避免逐篇换链;
  • 老文章的裂图是否已经批量转存、替换。

写在最后

一文多发真正省事的关键,是把图片和平台解耦:Markdown 文本本来就能到处复制,图片其实也应该如此。当你不再把图绑死在任何一个平台上,"同一篇文章发五个地方"才真的是复制粘贴,而不是一次次重传和救图。

官网:imgbed.cn