og标签未生效主因是og:url、og:type错误或缓存问题；社交平台仅读取静态meta且需og:title、og:description、og:image三者齐全，og:image须为绝对url、尺寸≥1200×630px；spa需服务端注入og标签，验证须用平台调试工具并主动刷新缓存。
OG 标签没生效，大概率不是漏写了 meta，而是 og:url、og:type 或缓存机制出了问题。
为什么分享到微信/微博/钉钉后显示空白或默认标题？
社交平台抓取页面时，只读取 HTML 静态 meta 标签（不执行 JS），且严格依赖 og:title、og:description、og:image 三者齐全。缺任意一个，多数平台会降级为展示 <title></title> + 页面首段文本 + 网站 favicon，甚至直接失败。
-
og:image必须是绝对 URL（如https://example.com/img/share.jpg），相对路径、本地路径、带 query 参数的动态图（如?v=123）常被拒绝 -
og:image尺寸建议 ≥ 1200×630 px，否则微信可能压缩成模糊小图；微博要求宽高比 1:1 或 2:1 - 微信内置浏览器（特别是旧版）不识别
og:video和og:audio，纯当普通页面处理 - 部分平台（如钉钉）会校验
og:url是否与当前分享链接完全一致（含 trailing slash、大小写、协议），不一致则忽略全部 OG 信息
Next.js / Vue SPA 如何确保服务端吐出正确 OG 标签？
单页应用在首屏由 JS 渲染，但爬虫不等 JS 执行，必须让服务端（或 SSR/SSG）在 HTML 响应中直接注入最终值。客户端改 document.head 无效。
- Next.js：用
getStaticProps或getServerSideProps获取数据，通过Head组件写入；动态路由需确保参数能映射到真实内容（如/post/[id]→og:title取自 id 对应文章） - Vue + Nuxt：优先用
head()函数返回对象，避免在mounted中操作 DOM - 若用纯 CSR（如 Vite + vanilla JS），只能靠预渲染（prerender-spa-plugin）或边缘函数（Cloudflare Workers / Vercel Edge Functions）动态生成 HTML
- 务必验证响应头：
curl -I https://yoursite.com/post/123确认返回的是完整 HTML，而非重定向或 404
如何快速验证 OG 标签是否被正确识别？
别信浏览器开发者工具里看到的 meta——那是你本地渲染的结果。要用平台官方调试工具看真实抓取效果。
- 微信：用「微信公众平台 → 工具 → 网页调试」，输入 URL 后点“检测”，它会模拟微信内置浏览器抓取并显示解析结果
- Facebook：用
https://developers.facebook.com/tools/debug/，支持强制重新抓取（Fetch new scrape information） - LinkedIn：用
https://www.linkedin.com/post-inspector/，对og:image的 HTTPS 和 CORS 要求极严 - 注意：所有平台都会缓存 OG 数据（微信约 24h，Facebook 默认 7d），改完标签后必须主动触发刷新，否则看不到变化
最常被忽略的一点：CDN 或反向代理（如 Nginx）可能缓存了旧 HTML 响应，导致你改了代码但爬虫始终拿到过期版本。检查 Cache-Control 响应头，对含 og: 的页面禁用 HTML 缓存，或加 cache busting 参数（如 ?ogv=2）。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
