Estoy creando un servicio multilingüe usando next-i18next. Quería que algunas de mis rutas también se tradujeran, por ejemplo:
ES : /contact
=> idioma por defecto
IT : /fa/ارتباط-با-ما
=> segundo idioma
Para este propósito, utilicé rutas de URL traducidas mediante reescrituras en mi archivo next.config.js
.
/** @type {import('next').NextConfig} */ const { i18n } = require('./next-i18next.config'); const nextConfig = { i18n, async rewrites() { return [ { source: '/ارتباط-با-ما', destination: '/contact-us', }, ]; }, }; module.exports = nextConfig;
Creé mi navegación con esta guía: ¿Cómo configurar rutas URL traducidas i18n en Next.js?
puedes consultar mi código allí https://stackblitz.com/edit/nextjs-thwgak
Problema : Vaya a la página de inicio, luego cambie el idioma a Farsi, luego vaya a la página de contacto que ve hasta ahora, todo bien, pero cuando vuelve a cargar la página en la página de contacto, obtiene un error 404.
¿Es esto un error o estoy equivocado? ¿Qué hice mal? ¿Alguna idea?
pd pregunta: ¿qué afectan las reescrituras al SEO?
La palabra ارتباط-با-ما
se codifica como URL cuando llega al servidor Next.js, por lo que también debe codificar su valor de source
para que coincida con la regla de reescritura.
const nextConfig = { async rewrites() { return [ { source: `/fa/${encodeURIComponent('ارتباط-با-ما')}`, destination: '/fa/contact-us', locale: false } ]; } };