og:image不生效主因是标签缺失、路径错误或平台限制；必须用绝对url、放中、配og:title和og:url，微信还需同域备案与cors支持。
为什么 og:image 不生效？
网页分享到微信、QQ、微博或 Slack 时没显示缩略图，大概率是 og:image 元标签缺失、路径错误，或图片不满足平台要求。Open Graph 协议是社交平台抓取缩略图的唯一依据，HTML 中必须显式声明，且不能依赖 JS 动态注入。
-
og:image必须放在内，且在首次 HTML 响应中就存在（SSR 或静态生成） - 图片 URL 必须是绝对路径（如
https://example.com/img/thumb.jpg），相对路径会被忽略 - 推荐尺寸 ≥ 1200×630 像素，最小不得低于 600×315；宽高比建议 1.91:1
- 格式仅支持 JPG、PNG、GIF（部分平台不支持 WebP），文件大小建议 ≤ 5MB
如何正确写 <meta> 标签？
只需在 中添加 3–4 行基础 Open Graph 标签，og:image 是核心，但必须搭配 og:title 和 og:url 才能被多数平台识别。
<meta property="og:title" content="页面标题"><meta property="og:description" content="简短描述，50字内"><meta property="og:url" content="https://example.com/page"><meta property="og:image" content="https://example.com/img/share-thumb.png">
- 不要用
name属性（如name="twitter:image"），那是 Twitter Card 的旧写法，已逐步弃用 - 避免重复声明：同一张图无需同时写
og:image和twitter:image，除非需针对 Twitter 特殊裁剪 - 如果图有多个尺寸，可用
og:image:width和og:image:height显式标注，减少平台解析失败
微信里缩略图还是不显示？检查这几点
微信内置浏览器对 og:image 的校验最严格，常见失效不是代码问题，而是部署侧限制。
- 图片域名必须与当前页面同域，或已在微信公众号后台「JS 接口安全域名」中备案（否则直接拒绝加载）
- 图片服务器需支持
CORS头（Access-Control-Allow-Origin: *），否则微信 WebView 拒绝渲染 - HTTPS 必须有效：自签名证书、过期证书、或混合 HTTP 资源会导致缩略图空白
- 微信缓存极强，更新图片后需用新文件名（如加时间戳参数
?v=20240520）或调用 微信调试工具 强制刷新
要不要加 twitter:card？
Twitter 已于 2023 年停止对新网站的卡片审核，但旧卡片仍可工作；目前绝大多数国内场景（微信、钉钉、飞书）完全不读取 twitter: 前缀标签，加了也没用。
- 除非你明确要适配 Twitter（且账号已通过验证），否则删掉所有
twitter:*标签更干净 - 若保留，必须配
twitter:card（值为summary_large_image）和twitter:image，缺一不可 - 注意：
twitter:image同样要求绝对 URL、HTTPS、CORS，规则和og:image几乎一致
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
