2

Next.js を使用しており、ブラウザーのAccept-Languageヘッダーに基づいて、すべてのパス (ルートだけでなく) をロケールベースのパスにルーティングしたいと考えています。ただし、ユーザーが地域を設定した場合は、ユーザー設定を尊重するために最初に確認する必要がある Cookie を設定します。

そのため、Cookie を確認する必要があります。Cookie が存在しない場合は、代わりにブラウザの言語ヘッダーに基づいてリダイレクトしてみてください。ISG を使用しているため、サーバー側の next.config.js リダイレクトに限定されます。

ドキュメントによると、これは機能するはずですが、ISG を使用しているため、next.config.jsリダイレクト機能でこれを行う必要があります。

この解決策を試してみましたが、うまくいきません (Cookie とヘッダーの両方が一致するため、無限のリダイレクトが発生します)。

const { i18n } = require('./next-i18next.config');
const withTM = require('next-transpile-modules')(['fitty', 'react-svg']); // pass the modules you would like to see transpiled

const handleLocaleRedirects = (path) => {
  const result = [];
  i18n.locales.forEach((locale) => {
    i18n.locales.forEach((loc) => {
      if (loc !== locale) {
        result.push({
          source: `/${locale}${path}`,
          has: [
            {
              type: 'header',
              key: 'accept-language',
              value: `^${loc}(.*)`,
            },
          ],
          permanent: false,
          locale: false,
          destination: `/${loc}${path}`,
        });
        result.push({
          source: `/${locale}${path}`,
          has: [
            {
              type: 'cookie',
              key: 'NEXT_LOCALE',
              value: loc,
            },
          ],
          permanent: true,
          locale: false,
          destination: `/${loc}${path}`,
        });
      }
    });
  });
  return result;
};

module.exports = withTM({
  i18n,
  reactStrictMode: true,
  images: {
    domains: [
      'dxjnh2froe2ec.cloudfront.net',
      'starsona-stb-usea1.s3.amazonaws.com',
    ],
  },
  eslint: {
    // Warning: Dangerously allow production builds to successfully complete even if
    // your project has ESLint errors.
    ignoreDuringBuilds: true,
  },
  async redirects() {
    return [...handleLocaleRedirects('/:celebrityId')];
  },
});
4

1 に答える 1