Next js 的元标记问题

问题描述

我是 Next js 的新手，并尝试在我的项目中编写一些动态开放图元标记关于社交媒体。问题是，我能够在检查器中看到所有元标记，但是当我试图在我的源代码或 Facebook 共享调试器中找到它们时，我只能看到几个元标记，并且它们与开放图无关

我在源代码或共享调试器中看到的元标记：

<head>
       <Meta charSet="utf-8"/>
       <Meta name="viewport" content="width=device-width"/>
       <Meta name="next-head-count" content="2"/>
</head>

我创建了一个带有 next/head 的自定义 Head，我在布局中找到了这个自定义 Head，而不是在 _app.js 文件中（但我尝试添加它在那里，没有好的结果）。我没有 getServerSideProps 函数，我不知道在我的代码中在哪里实现这个函数。知道可能是什么吗？

解决方法

我没有没有 getServerSideProps 函数，我不知道在我的代码中在哪里实现这个函数。

您只能在页面组件上（在 pages 目录下）定义 getServerSideProps。

https://nextjs.org/docs/basic-features/data-fetching#getserversideprops-server-side-rendering

有个问题，怎么获取meta标签的动态值？如果您在客户端使用 useEffect 获取它们，则元标记的值在初始呈现时未定义。

如果你需要从外部数据源获取值，你应该在 getStaticProps 或 getServerSideProps 中获取它们并将它们传递给页面 props。

meta-tags social-media