Next.js 通过Url路径确定语言

Next.js 通过Url路径确定语言,next.js,react-i18next,next-i18next,i18next-browser-languagedetector,Next.js,React I18next,Next I18next,I18next Browser Languagedetector,我试图通过在next-i18next包中更改站点的子路径来改变语言,我在互联网上(,)搜索这个问题的答案,但没有成功。更改url中的子路径后,它将被复制,并将我重定向到不存在的页面 我的代码: //我的项目路径/i18n.js const NextI18Next=require('next-i18next')。默认值; const i18nextBrowserLanguageDetector=require('i18next-browser-languagedetector')。默认值; co

我试图通过在next-i18next包中更改站点的子路径来改变语言,我在互联网上(,)搜索这个问题的答案,但没有成功。更改url中的子路径后,它将被复制,并将我重定向到不存在的页面

我的代码:

//我的项目路径/i18n.js
const NextI18Next=require('next-i18next')。默认值;
const i18nextBrowserLanguageDetector=require('i18next-browser-languagedetector')。默认值;
const{localesubpath}=require('next/config').default().publicRuntimeConfig;
const path=require('path');
module.exports=new NextI18Next({
其他语言:['ru'],
defaultNS:“常见”,
本地子路径,
localePath:path.resolve('./public/static/locales'),
用法:[i18nextBrowserLanguageDetector],
});
//我的项目路径/pages/\u app.js
导入“../styles/main.scss”;
从“NProgress”导入NProgress;
导入“nprogress/nprogress.css”;
从“下一个/路由器”导入路由器;
从“下一个/应用程序”导入应用程序;
从“../i18n”导入{appWithTranslation};
Router.events.on('routeChangeStart',()=>NProgress.start());
on('routeChangeComplete',()=>NProgress.done());
Router.events.on('routeChangeError',()=>NProgress.done());
常量MyApp=({Component,pageProps})=>(
);
MyApp.getInitialProps=async(appContext)=>({…等待App.getInitialProps(appContext)});
导出默认appWithTranslation(MyApp);

也许我错过了什么,因为这是我在next.js上的第一个项目,所以我请求社区的帮助,如果有任何帮助或提示,我都会非常感激。

默认情况下
next-i18next
将尝试检测要显示的语言

尝试禁用它

const NextI18Next=require('next-i18next')。默认值
const{localesubpath}=require('next/config').default().publicRuntimeConfig
const path=require('路径')
module.exports=new NextI18Next({

browserLanguageDetection:false,//在文件next.config.js中,我有以下设置:

// path/to/project/next.config.js

const { nextI18NextRewrites } = require('next-i18next/rewrites');

const localeSubpaths = {
    ru: 'ru',
};

module.exports = {
    rewrites: async () => nextI18NextRewrites(localeSubpaths),
    publicRuntimeConfig: {
        localeSubpaths,
    },
    devIndicators: {
        autoPrerender: false,
    },
};
但是没有足够的英语本地化配置,所以您只需添加:

// path/to/project/next.config.js

const { nextI18NextRewrites } = require('next-i18next/rewrites');

const localeSubpaths = {
    en: 'en', // <------
    ru: 'ru',
};

module.exports = {
    rewrites: async () => nextI18NextRewrites(localeSubpaths),
    publicRuntimeConfig: {
        localeSubpaths,
    },
    devIndicators: {
        autoPrerender: false,
    },
};

//path/to/project/next.config.js
const{nextI18NextRewrites}=require('next-i18next/rewrites');
常量localesubpath={
en:'en',//nextI18NextRewrites(localesubpath),
publicRuntimeConfig:{
本地子路径,
},
设备指示器:{
自动重排程序:错误,
},
};

但是现在,当通过url更改语言时,服务器返回404,也就是说,当将英语更改为俄语时,一切正常,但当将俄语更改为英语时,返回404,并且在更改语言按钮的帮助下,一切正常。