用途
SEO Metadata 是一个面向 Next.js 应用的元数据生成技能，用于按语言区域（locale）动态生成页面元数据。它帮助开发者在多语言站点中统一管理 canonical 规范链接、Open Graph 标签、Twitter 卡片以及 hreflang 语言替代链接，从而改善搜索引擎与社交平台的展示效果。
主要能力
- 基础元数据配置：在
app/layout.tsx中通过metadataBase、标题模板（title.template与title.default）、描述以及robots规则（含googleBot的max-video-preview、max-image-preview、max-snippet）设置站点级默认元数据。 - 逐页动态元数据：在页面组件中导出
generateMetadata异步函数，结合next-intl/server的getTranslations按 locale 与命名空间读取标题和描述，并生成alternates（canonical 与 languages）、openGraph和twitter字段。 - 元数据辅助函数：提供
generatePageMetadata工具函数，接收 locale、path、title、description、image、noIndex 等参数，统一拼装完整 URL、图片 URL、canonical、hreflang 语言映射、Open Graph 与 Twitter 卡片，并支持通过noIndex控制是否禁止索引。 - 动态路由元数据：在
app/[locale]/programmes/[slug]/page.tsx等动态路由中，根据 slug 获取数据后调用辅助函数生成元数据；当数据不存在时返回{ title: 'Not Found' }。 - hreflang 自动输出：通过
alternates.languages自动在 HTML head 中渲染 canonical 链接与各语言的alternatehreflang 链接，并包含x-default默认语言项。 - 翻译键结构：示例展示
messages/en.json中按meta.home、meta.services、meta.about等命名空间组织 title 与 description 的键结构。
使用方式
- 在
app/layout.tsx中定义基础metadata，设置metadataBase、标题模板、默认标题、描述与 robots 规则。 - 在需要独立元数据的页面中导出
generateMetadata，通过getTranslations读取对应命名空间的翻译文本。 - 可选地创建
lib/metadata.ts辅助函数generatePageMetadata，集中处理 URL 拼接、图片处理、canonical、hreflang、Open Graph 与 Twitter 字段。 - 在动态路由页面中先获取数据，再调用辅助函数生成元数据。
- 在翻译文件中按命名空间维护各语言的 title 与 description。
适用场景
- 需要多语言 SEO 的 Next.js 站点，例如服务页、关于页。
- 需要为动态内容（如 programmes 详情页）生成独立元数据的场景。
- 需要同时输出 canonical、Open Graph、Twitter 卡片与 hreflang 替代链接的页面。
限制
资料中未提供该技能的安装命令、依赖版本要求、收费或价格信息、平台支持范围以及实际效果数据，这些内容暂未提供。示例代码基于 Next.js 的 Metadata API 与 next-intl，具体项目需根据自身环境调整。