代码之家 › 专栏 › 技术社区 › Shiv Shankar Prasad

如何在Next js 14.2.4中将动态url添加到规范标签中

next.js14 seo next.js typescript

Shiv Shankar Prasad · 技术社区 · 1 年前

我正在尝试将动态url添加到我的下一个js动态路由中。

我正在使用服务器呈现的页面来生成元数据

export const metadata: Metadata = {
   title: `InterviewQA |  ItsIndianGuy`,
   description:
      "Explore interview questions in various programming languages such as JavaScript, Python, C++ and more. Enhance your preparation with comprehensive language-specific content.",
   alternates: {
      canonical: "https://itsindianguy.in/interview-qa",
   },
};

我想为其添加seo的动态页面在图片中

现在的问题是,我已经将它添加到静态页面中,但当涉及到动态页面时,我该如何添加它。

因为我不能在服务器渲染的页面中使用钩子来获取路径名。

我被困在这里了。有人能帮我吗?

1 回复 | 直到 1 年前

Besufkad Menji 1 年前

您可以将其添加到动态页面的顶部:

import type { Metadata, ResolvingMetadata } from 'next'

type Props = {
   params: { slug: string }
   searchParams: { [key: string]: string | string[] | undefined }
 }

 export async function generateMetadata(
  { params, searchParams }: Props,
    parent: ResolvingMetadata
   ): Promise<Metadata> {
  // read route params
   const slug = params.slug

 // fetch data or use local json data
 const product = await fetch(`https://.../${slug}`).then((res) => res.json())


return {
   title: product.title,
 }
}

推荐文章

Shiv Shankar Prasad · 如何在Next js 14.2.4中将动态url添加到规范标签中

1 年前

Rodolfo Bagay · NGINX取代的元标签是否与SSR/SSG元标签相同?

2 年前

Shashank Vivek · 从angularJS的url中删除#,用于搜索引擎优化,后端为Django

7 年前

user8073054 · 机器人。txt格式不允许所有子URL,但不允许根URL本身

7 年前

Orange Lux · Angular2路由器:匹配任何url,包括子目录

7 年前

Aravinthan M Rohan Fating · 我在角度上有这样的错误

7 年前

Priyank Dey · 我可以多次使用一个用于桌面,另一个用于移动设备吗?

7 年前

Khadesa · 如何从导航项目的标题属性[关闭]中删除类别描述

7 年前

Kyle Vassella · alt是否与alt=“”相同?

8 年前

Ho Thanh Cyberdelia Nhan · 通过实施RDF和将数据链接到我们的网站,我们能得到什么?[已关闭]

9 年前