微信不识别og:image,优先读取meta name="description"和首张<img>;Twitter忽略og:description,只认twitter:description;og:url必须与分享URL完全一致;调试时需检查HTTP响应头和状态码。

og:image 为什么在微信里不显示
微信根本不用 og:image,它优先读 meta name="description" 和页面第一个 <img>,除非你额外加 mp:wx:preview_image(仅限公众号)。静态页面想让微信显示指定图,最稳的做法是:确保首张 <img src="https://..."> 可公开访问、HTTPS、尺寸 ≥ 300×300,且没有 loading="lazy" 或 CSS 隐藏。
- 别指望
og:image对微信生效——它只在 Facebook、LinkedIn、Twitter 等平台起作用 - 微信 iOS 客户端对 HTTP 协议极其敏感,哪怕页面是 HTTPS,
<img>的src写成http://也会白屏 - 如果用了 CDN,确认其响应头含
Access-Control-Allow-Origin: *,否则微信安卓可能拒绝加载
Twitter 为什么不认 og:description
Twitter 完全忽略 og:description,只认 twitter:description。即使你写了 og:description,它也不会 fallback 过去——没写 twitter:description 就等于没描述。
-
twitter:description必须和twitter:title、twitter:card一起出现,否则 Twitter 可能降级为纯文本卡片 -
twitter:card值必须是summary或summary_large_image;填错(比如大小写或拼写)会导致整张卡片失效 - 长度建议 ≤ 200 字符,超长会被截断,且不支持换行——所有空格都算字符,别用
或\n
og:url 写错会导致卡片被当成不同页面
og:url 不只是“看起来像链接”,它必须和用户实际分享的 URL 完全一致:协议、大小写、尾部斜杠、查询参数一个都不能多也不能少。Facebook 和 LinkedIn 会严格比对,稍有出入就缓存两份元数据,结果改完标签后新旧卡片混着显示。
- 动态路由页(如
/post/123)务必服务端渲染出真实 URL,别用window.location.href拼接 - 带 UTM 参数的分享链接(如
?utm_source=wechat)不能作为og:url值——应剥离参数,指向规范地址 - 推荐同时加
<link rel="canonical" href="...">,且值与og:url完全相同,强化归一性
调试时 Scrape Again 不生效的真正原因
点了 Facebook Sharing Debugger 的 Scrape Again 却没更新,大概率不是按钮失灵,而是你的服务器返回了 304、302 或缓存头干扰了重抓。社交平台爬虫不会绕过 HTTP 缓存策略。
立即学习“前端免费学习笔记(深入)”;
- 检查响应头:
Cache-Control: public, max-age=3600是安全的;no-cache或must-revalidate反而会让部分平台跳过更新 - 确保 HTML 响应状态码是
200,不是200 OK (from disk cache)这类伪 200 - 用
curl -I https://yourdomain.com/page直接看原始响应头,比浏览器开发者工具更可信



















