NextJs网站Facebook Messenger分享时Open Graph元数据不显示求助

针对你遇到的「自己聊天框/动态/Sharing Debugger正常，但发送给他人时Messenger不显示OG数据」的问题，可按以下步骤排查：

• 强制刷新Messenger缓存
  Meta的Feed和Messenger采用独立缓存策略，即便Debugger显示正常，Messenger可能仍保留旧缓存。测试时给URL加随机参数（如https://www.casadebambu.ph/?refresh=123），若能正常显示OG数据，说明是缓存问题。可通过Sharing Debugger的「Scrape Again」按钮强制触发全局缓存刷新，等待一段时间后再测试原URL。

• 校验OG标签的完整性与正确性
  确保核心OG标签无重复、无冲突：

  • 检查og:type（建议设为website）、og:title、og:image、og:url是否唯一且完整
  • og:image需满足1200x630像素、文件≤8MB，且为绝对路径（不能用相对路径）
  • 用view-source:查看页面源码，确认OG标签在初始HTML中存在，而非客户端JS动态添加（Messenger爬虫不执行JS）

• 验证Next.js渲染逻辑

  • 若用SSG：确认构建时OG标签已正确生成，没有动态数据延迟渲染的问题
  • 若用SSR：用curl https://www.casadebambu.ph/命令抓取页面，检查返回的HTML头部是否包含完整OG标签
  • 避免next/head重复渲染相同OG标签，可在组件中用key属性区分或统一管理头部标签

• 排查账号与设置限制

  • 让接收方检查Messenger设置：「设置→隐私→链接预览」，确保已开启链接预览功能
  • 测试发送给不同地区、不同隐私设置的账号，排除地域或账号权限过滤的可能

• 检查Meta应用状态
  若站点关联了Meta开发者应用，确认应用状态：

  • 若处于开发模式，需添加测试用户（但你换账号测试仍有问题，这条优先级较低）
  • 确保应用已通过Meta审核，未被限制内容解析权限

内容的提问来源于stack exchange，提问作者boringdeveloper