微信分享卡片内容由页面meta标签预置决定，JS动态修改无效；必须通过服务端渲染或预渲染确保HTML初始响应含正确og:title、og:description、og:image（HTTPS直链）等标签，并用微信开发者工具验证抓取结果。
微信内分享卡片的标题、描述、缩略图完全由页面内的 meta 标签控制，不是靠 JS 动态改就能生效的——微信内置浏览器在页面加载初期就已抓取并缓存这些信息，JS 后续修改无效。
微信分享必须用 meta 标签预置内容
微信客户端（包括微信内置浏览器、微信小程序 WebView）在打开 URL 时，会向服务器发起一次无 Cookie、无 UA 的 GET 请求（类似爬虫），提取 <head> 中的特定 meta。若此时没返回正确标签，后续任何 JS 调用 wx.onMenuShareTimeline 或修改 document.title 都不会影响分享卡片外观。
-
<meta property="og:title" content="自定义标题">—— 必须存在，且不能为空或纯空格 -
<meta property="og:description" content="一句话说明">—— 建议 ≤ 30 字，过长会被截断 -
<meta property="og:image" content="https://xxx.com/share.jpg">—— 必须是 HTTPS 直链，尺寸建议 1200×630，最小 300×300；本地路径（/img/xxx.jpg）、相对路径、data URI 均无效 -
<meta property="og:url" content="https://xxx.com/page?id=123">—— 应与当前页面真实 URL 一致，否则可能被微信判定为作弊
动态模板（如 Vue/React SSR）需服务端注入 meta
前端框架的 CSR（客户端渲染）模式下，meta 标签在 JS 执行后才插入 DOM，但微信爬虫早已完成抓取。所以：单页应用（SPA）必须走 SSR 或预渲染（Prerender），让 HTML 初始响应中就包含正确的 meta。
- Next.js 用户：用
Head组件 +getServerSideProps注入动态值 - Nuxt 用户：在
asyncData或fetch中拼装head()返回对象 - 纯 Node.js 模板（EJS/Pug）：从路由参数或数据库查出分享文案，直接写进模板
<meta> - 静态站点（如 Hugo/Jekyll）：无法按 URL 动态生成，只能为每个页面手动配一套
meta
调试微信分享前先用官方工具验真
别靠“发给自己看”来验证，微信对未认证公众号 / 未绑定域名的页面有缓存和降权策略，导致你改了半天还是旧卡片。必须用 微信开发者工具 → 网页调试 → “网页分享”功能 实时查看抓取结果。
文章转信息图。将文章/笔记转化为手机可读的 HTML 信息图，自动匹配视觉风格。触发场景：文章转图、笔记转图、信息图、转小红书图、做张图、可视化这篇文章、文生图。
立即学习“前端免费学习笔记（深入）”；
- 输入 URL 后点击“抓取”，看返回的 title/description/image 是否匹配预期
- 如果 image 显示“图片获取失败”，检查是否跨域（CORS）、是否 404、是否非 HTTPS、是否被 CDN 拦截（某些 CDN 默认屏蔽爬虫 UA）
- 微信会缓存结果约 24 小时，强制刷新需调用
https://api.weixin.qq.com/cgi-bin/ticket/getticket?access_token=ACCESS_TOKEN&type=jsapi并清空 JS-SDK 缓存（实际更简单：换一个带时间戳的 URL 参数再试）
JS-SDK 分享接口只是补充，不是替代
wx.onMenuShareTimeline 和 wx.updateAppMessageShareData 这类接口，只在用户点击右上角「…」→「发送给朋友」或「分享到朋友圈」的瞬间起作用，且仅影响该次分享行为。它无法覆盖 meta 抓取阶段决定的基础卡片信息。
- 适合做 A/B 测试：同一页面，不同用户看到不同分享文案（前提是
meta已预留占位，JS 再填值） - 必须配合签名：调用前要后端生成
jsapi_ticket和签名，前端传url必须与当前页面location.href.split('#')[0]完全一致（含 query，不含 hash） - 新版 JS-SDK（v1.6+）已废弃
onMenuShare*，统一用updateAppMessageShareData和updateTimelineShareData，注意兼容性
最常被忽略的一点：微信对非备案域名、HTTP 协议、无 og:image 的页面，会自动 fallback 到页面首张图片或公众号头像，效果不可控。哪怕只是临时测试，也务必确保域名已备案、HTTPS 可用、og:image 是可直访的 JPG/PNG 且尺寸合规。
