NextJS多域名场景下/pages目录路由站点地图生成方案咨询

核心思路 #

基于单架构多域名（对应不同语言）的场景，需要为/pages下的每个路由生成对应各语言域名的站点地图条目，并可添加多语言交替链接（alternateRefs）以符合SEO规范，可通过修改next-sitemap.config.js的配置和自定义转换逻辑实现。

具体实现步骤 #

1. 引入语言-域名映射表
   在配置文件中复用你在server-sitemap.xml中使用的语言-域名映射，确保前后端逻辑一致：

// next-sitemap.config.js
const languageToDomains = {
  en: 'example.com',
  cs: 'example.cz',
  de: 'example.de',
  ua: 'example.ua',
  pl: 'example.pl',
  'de-AT': 'example.at'
  // 替换为你的实际域名
};
const i18nLocales = ['en', 'cs', 'de', 'ua', 'pl', 'de-AT'];

2. 修改配置生成多域名站点地图条目
   通过自定义transform函数，为每个/pages路由生成所有语言域名对应的条目，并附带交替链接：

module.exports = {
  siteUrl: "http://localhost:3000", // 保留默认值，生成时会被实际域名覆盖
  exclude: ['/server-sitemap.xml'],
  generateRobotsTxt: true,
  robotsTxtOptions: {
    // 更新额外站点地图指向，对应每个域名的server-sitemap.xml
    additionalSitemaps: Object.values(languageToDomains).map(domain => `https://${domain}/server-sitemap.xml`)
  },
  transform: async (config, path) => {
    const entries = [];
    // 遍历所有语言，生成对应域名的站点地图条目
    for (const locale of i18nLocales) {
      const domain = languageToDomains[locale];
      const loc = `https://${domain}${path}`;
      // 生成当前条目的其他语言交替链接
      const alternateRefs = i18nLocales
        .filter(l => l !== locale)
        .map(altLocale => ({
          href: `https://${languageToDomains[altLocale]}${path}`,
          hreflang: altLocale
        }));

      entries.push({
        loc,
        lastmod: new Date().toISOString(),
        alternateRefs
      });
    }
    return entries;
  }
};

3. 处理带语言前缀的路由（可选）
   如果你的/pages路由带语言前缀（如/en/about），需要先解析路径中的语言标识，再匹配对应域名：

// 在transform函数中添加路径解析逻辑
const [, locale, ...restPath] = path.split('/');
const actualPath = restPath.length ? `/${restPath.join('/')}` : '/';
// 后续用actualPath拼接域名生成loc

4. 生成站点地图
   确保使用最新版next-sitemap，运行生成命令：

npx next-sitemap

进阶优化：生成独立域名站点地图 #

如果需要为每个域名生成单独的站点地图文件（如en-sitemap.xml），可使用generateSitemap钩子实现：

module.exports = {
  siteUrl: "http://localhost:3000",
  exclude: ['/server-sitemap.xml'],
  generateRobotsTxt: true,
  async generateSitemap(config) {
    const { paths } = await config.getPaths();

    // 为每个语言生成独立站点地图
    for (const locale of i18nLocales) {
      const domain = languageToDomains[locale];
      const sitemapEntries = paths.map(path => ({
        loc: `https://${domain}${path}`,
        lastmod: new Date().toISOString(),
        alternateRefs: i18nLocales
          .filter(l => l !== locale)
          .map(altLocale => ({
            href: `https://${languageToDomains[altLocale]}${path}`,
            hreflang: altLocale
          }))
      }));

      await config.generateSitemap({
        filename: `${locale}-sitemap.xml`,
        entries: sitemapEntries,
        siteUrl: `https://${domain}`
      });
    }

    // 生成索引站点地图，汇总所有语言站点地图
    await config.generateIndexSitemap({
      filename: 'sitemap.xml',
      sitemaps: i18nLocales.map(locale => ({
        loc: `https://${languageToDomains[locale]}/${locale}-sitemap.xml`,
        lastmod: new Date().toISOString()
      }))
    });
  }
};

内容的提问来源于stack exchange，提问作者Daniel Bílek