为什么动态元开放图标签不起作用？

Question

我使用 Strapi 作为我的项目和 Nextjs 的 cms，我应该动态地制作元开放图标签内容，部署后我尝试将我的网站链接复制并粘贴到社交媒体（FB、WhatsApp 等） ）但是标题和描述没有出现，这是我的代码：

<meta
 property="og:title"
 content={(data.SEO.metaTitle) || ""}
/>
<meta
  property="og:description"
  content={(data.SEO.metaDescription) || ""}
/>

只有当我对内容进行硬编码时才有效，有什么解决方案吗？

Answer 1

经过一番研究，meta og标签不显示的原因是因为我仍然使用客户端渲染（通过使用useState和useEffect），这就是为什么标签的meta不会出现。解决方案是使用

getServerSideProps

这样它将在服务器上渲染

参考：https://www.techomoro.com/render-dynamic-title-and-meta-tags-in-a-next-js-app/