如何修复Nuxt 3网站站点地图中的3XX重定向错误？

问题描述 #

站点地图中的部分URL访问时会自动重定向到末尾带斜杠的版本（例如https://www.example.com/blog/post-1 → https://www.example.com/blog/post-1/），导致搜索引擎抓取时出现重复内容识别问题，影响SEO表现。已尝试设置trailingSlash: true、自定义中间件重定向、使用nuxt-simple-sitemap模块等方案，均未解决。

核心问题分析 #

1. 站点地图生成的URL格式与实际可访问URL不一致：手动编写的sitemap.xml输出不带末尾斜杠的路径，但Nuxt静态生成的页面是以带斜杠的目录形式存在，服务器会自动重定向不带斜杠的请求。
2. 预渲染路由与站点地图路径不匹配：预渲染时添加的路由不带斜杠，进一步加剧了URL格式混乱。

解决方案步骤 #

1. 统一站点地图URL格式（添加末尾斜杠） #

修改server/routes/sitemap.xml.ts，确保所有写入站点地图的URL都带有末尾斜杠：

const sitemap = new SitemapStream({ hostname: process.env.SITEMAP });

const postRoutesList = await getPostRoutes();

// 根页面（已带斜杠，无需修改）
sitemap.write({ url: '/' });

// 分类页面添加末尾斜杠
sitemap.write({ url: '/quote/category/love/' });
sitemap.write({ url: '/quote/category/life/' });
sitemap.write({ url: '/quote/category/birthday/' });
sitemap.write({ url: '/quote/category/motivational/' });
sitemap.write({ url: '/quote/category/funny/' });
sitemap.write({ url: '/quote/category/inspirational/' });
sitemap.write({ url: '/quote/category/family/' });
sitemap.write({ url: '/quote/category/movie/' });

// 文章页面添加末尾斜杠
postRoutesList.forEach((route) => sitemap.write({ url: `${route}/`, changefreq: 'monthly' }));
sitemap.end();

return (await streamToPromise(sitemap));

同时修改getPostRoutes函数，生成带斜杠的路由：

const getPostRoutes = async () => {
  const response = await axios.get(
    process.env.API_URL + "/get-quotes?page=1&limit=400"
  );
  const routes = response?.data?.data.map(
    (quote: any) => `/quote/${quote.slug}/` // 此处添加末尾斜杠
  );
  if (routes) {
    return routes;
  }
};

2. 同步预渲染路由格式 #

修改nuxt.config.ts中的nitro:config钩子，确保预渲染的路由与站点地图一致：

hooks: {
  async "nitro:config"(nitroConfig) {
    const slugs = await getPostRoutes(); // 现在slugs已带末尾斜杠
    nitroConfig.prerender.routes.push(...slugs);
  },
},

3. 服务器层面强制统一斜杠规则 #

在.htaccess中添加规则，确保所有非文件请求都重定向到带末尾斜杠的版本，避免服务器默认行为导致的重定向：

RewriteEngine on

# 强制所有非文件URL添加末尾斜杠
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_URI} !/$
RewriteRule ^(.*)$ /$1/ [L,R=301]

# cPanel默认PHP配置（保留）
<IfModule mime_module>
  AddHandler application/x-httpd-ea-php81 .php .php8 .phtml
</IfModule>

4. 配置nuxt-simple-sitemap模块遵循斜杠规则 #

在nuxt.config.ts中显式设置模块的trailingSlash选项，确保模块生成的站点地图与手动编写的格式统一：

sitemap: {
  sources: ["/api/sitemap"],
  trailingSlash: true, // 强制模块输出带末尾斜杠的URL
},

5. 验证结果 #

1. 执行npm run generate重新生成静态文件和站点地图
2. 访问sitemap.xml确认所有URL都带有末尾斜杠
3. 使用浏览器或curl命令测试站点地图中的URL，确认不再触发3XX重定向

内容的提问来源于stack exchange，提问作者Younoch