whatsapp 中的子页面不显示元标记 - ReactJS

Question

我的元标签效果很好。然而，当在whatsapp上分享时，只有主页显示

og:image

和

description

。每个子页面都只显示链接。

<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<meta name="theme-color" content="#000000" />
<meta property="og:title" content="My Title">
<meta property="og:site_name" content="Website Name">
<meta property="og:url" content="https://websiteLink.co.il" />
<meta name="og:description" content="description" />
<meta property="og:type" content="website">
<meta property="og:image" content="https://websiteLink.com/websiteLogo.png">

我正在使用 React 和 React router dom。我检查了每个页面，元标记与主页保持相同。

Answer 1

解决方案如下：WhatsApp 通常会在首次共享链接时缓存元标记，后续页面可能不会更新缓存信息。要解决此问题，您可以尝试在共享子页面时向 URL 添加唯一参数，例如时间戳或版本号。这可以提示 WhatsApp 获取并显示每个子页面更新的元标记。

例如，不要分享：

https://websiteLink.co.il/subpage

分享：

https://websiteLink.co.il/subpage?v=1

这可以帮助确保 WhatsApp 获取每个子页面的最新元标记。