无法通过在客户端获取数据来更新Next.js中客户端的元数据

Question

我正在使用

NextSeo

，但无法通过在客户端获取数据来更新元数据。

useEffect(()=>{
 fetch(assetURL)
  .then((res) => res.json())
  .then((data) => {
    console.log(data); 
  })
  .catch((error) => {
    console.error("Error fetching data:", error);
  });

使用 NextSEO

   <NextSeo
          {...defaultSeoProp}
          title={data?.name ?? 'Asset Name'  }
          description={data?.description ?? ''}
          openGraph={{
            title: data?.name ?? '',
            description: data?.description ?? '',
            images: [{ url: data?.thumbnail ?? '', width: 270, height: 270 }],
          }}
        />

当我共享特定资产的 URL 时，爬虫仅获取默认元数据而不是更新的元数据

Answer 1

实际上，根据Next.js文档，您应该在服务器组件中使用元数据，因为元数据是服务器的责任，而不是客户端的责任。

我相信这些链接会有帮助：

服务器和客户端组合模式

元数据