Next.js 15.3.1 版本中引入了一个性能优化功能——"流式元数据"（ streaming metadata ），但这个优化带来了严重的 SEO 问题。元数据标签（如 <title>, <meta>, <link>）被渲染在 <body> 中而不是 <head> 中。
社区中对这个改动意见很大，但是官方暂时没有修复的打算。
影响范围
- Lighthouse SEO 评分：直接检测失败，因为 Lighthouse 明确检查
<head>中的元数据 - Google Search Console：报告 "Duplicate without user-selected canonical" 错误
- 搜索引擎爬虫：可能无法正确识别页面元数据
- 社交媒体分享：Open Graph 标签可能无法正常工作
临时解决方法：
在 next.config.ts 中添加以下配置：
const nextConfig = {
// 强制所有用户代理接收阻塞式元数据
htmlLimitedBots: /.*/, // 这个正则表达式匹配所有用户代理
// 其他配置...
};
- 或者可以针对特定爬虫进行配置：
/googlebot|bingbot|baiduspider/
相关讨论在： https://github.com/vercel/next.js/issues/79313#issuecomment-2892288965
官方文档相关说明： https://nextjs.org/docs/app/api-reference/functions/generate-metadata#streaming-metadata
--
实际案例
在我的佛经项目中，添加此配置后：
- Lighthouse SEO 评分从 80+ 提升到 100
- Google Search Console 中的重复规范错误消失
PS. 分享一个 Lighthouse 全满分的小彩蛋
PS 2. 最近用 Next.js 在做一个 AI 阅读佛经的网站，欢迎大家体验：
Select Language