gpt4 book ai didi

Unable to update metadata on the client side in Next.js by fetching data on the client side(无法通过在客户端获取数据来更新Next.js中客户端的元数据)

转载 作者:bug小助手 更新时间:2023-10-28 10:50:03 25 4
gpt4 key购买 nike



I am using NextSeo but unable to update metadata by fetching data on client side.

我正在使用NextSeo,但无法通过在客户端获取数据来更新元数据。


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

With NextSEO

关于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 }],
}}
/>

When I share the URL of a particular asset, crawlers only fetching default metadata not the updated one

当我共享特定资产的URL时,爬虫程序只获取默认元数据,而不获取更新的元数据


更多回答
优秀答案推荐

Actually, based on the Next.js documentation, you should use Metadata in Server Components because Metadata is the server's responsibility, not the client's.

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


I believe these links would be helpful:

我相信这些链接将会有所帮助:


Server and Client Composition Patterns

服务器和客户端组合模式


Metadata

元数据


更多回答

Yea, but the project is built with next 12.1.6. We also tried with getInitialProps and getServerSideProps but we experienced very slowness that took more time to render the page.

是的,但是这个项目是用下一个12.1.6构建的。我们还尝试了getInitialProps和getServerSideProps,但我们遇到了非常慢的情况,需要更多的时间来呈现页面。

In this case, if you want to have dynamic metadata, I believe you should use getServerSideProps and avoid fetching data on the client side. Regarding the part where you mentioned slowness, is this slowness also present in production?

在这种情况下,如果您希望拥有动态元数据,我认为您应该使用getServerSideProps,并避免在客户端获取数据。关于你提到的慢的部分,这种慢是不是也存在于生产中?

Yea both in production and development

在生产和开发方面都是如此

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com