部署 Nextjs 应用程序后，vercel 上出现 ERR_TOO_MANY_REDIRECTS

Question

我将我的 nextjs 应用程序部署到 Vercel，并且成功了。

我可以看到网站的预览，甚至可以看到表明其运行良好的日志。

但我尝试通过默认的 Vercel 域访问该网站：

https://tly-nextjs.vercel.app/

我收到一个 ERR_TOO_MANY_REDIRECTS。

我本地没有这个问题。

我试过了：

• 禁用我使用的语言重定向（/en 对于英国人，/对于法国人）。
• 禁用i18next的语言检测器。

但这些解决方案都没有改变任何事情。 有什么想法吗？

i18n.js 文件

import i18n from 'i18next';
import { initReactI18next } from 'react-i18next';
import Cache from 'i18next-localstorage-cache';
import LanguageDetector from 'i18next-browser-languagedetector';



const fallbackLng = ['fr']; 
const availableLanguages = ['fr', 'en'];

const en = require('./locales/en/common.json');
const fr = require('./locales/fr/common.json');

const options = {
  order: ['querystring', 'navigator'],
  lookupQuerystring: 'lng'
}

const cacheOptions = {
  // turn on or off
  enabled: true,

  // prefix for stored languages
  prefix: 'i18next_res_',

  // expiration
  expirationTime: 365*24*60*60*1000,

  // language versions
  //versions: {}
}

i18n
  .use(Cache)
  .use(initReactI18next)
  .use(LanguageDetector)
  .init({
    cache: cacheOptions,
    fallbackLng: fallbackLng,
    debug: true,
    detection: options,
    supportedLngs: availableLanguages,
    nonExplicitSupportedLngs: true,
    resources: {
      en: {translation: en},
      fr: {translation: fr},
    },
    interpolation: {
      escapeValue: false,
    },
    react: {
      wait: true,
      useSuspense: true,
    },
  });


export default i18n;

我的改变语言功能：

const changeLanguageInHouse = (lang, bool) => {
    setLoading(true);

    i18next.changeLanguage(lang).then((t) => {
      setLanguage(lang);
      bake_cookie("langChoice", lang);
      setLoading(false);

      if (bool === true) {
        var newUrl2 = (lang === "fr" ? "" : "/en") + asPath;

        window.location.replace(newUrl2);
      }
    });
  };

Answer 1

您的服务器发生的情况如下：

您输入 https://tly-nextjs.vercel.app/，它会被重定向到 /en，HTTP 状态代码 307（临时重定向）。

/en 使用 301（永久重定向）重定向到 /。

您可以通过打开浏览器-开发工具并查看

Network

选项卡来重现此内容。

您的服务器可能激活了某种 url 重写功能，它将所有内容重定向到您的域根目录。

Answer 2

有可用的公共仓库吗？这就是它对我的作用。

尝试更改区域设置和默认区域设置的顺序（不确定这是否有帮助，但它对我来说改变了一些东西。如果是这种情况，则未记录！） 因此，我将默认语言环境放在

locales

数组和

domains

数组中的第一个位置（对我来说是 nl）。

如果有帮助请告诉我！

module.exports = {
  i18n: {
    localeDetection: false,
    // These are all the locales you want to support in
    // your application
    locales: ['nl', 'en'],
    // This is the default locale you want to be used when visiting
    // a non-locale prefixed path e.g. `/hello`
    defaultLocale: 'nl',
    // This is a list of locale domains and the default locale they
    // should handle (these are only required when setting up domain routing)
    domains: [
      {
        domain: 'example.be',
        defaultLocale: 'nl',
      },
      {
        domain: 'example.com',
        defaultLocale: 'en',
      },
    ],
  },
  trailingSlash: true,
};

Answer 3

我将所有 getInitialProps 更改为 getServerSideProps

并意识到我正在对响应进行重定向：

res.writeHead(301, { Location: "/" })

我直接删除了。 现在我没有这种无休止的重定向了。

Answer 4

这样做对我有用...... https://vercel.com/guides/resolve-err-too-many-redirects-when-using-cloudflare-proxy-with-vercel

我认为这是解决问题原因的实际方法，而不是绷带！