Internationalization with App Router
Answered
Brown bear posted this in #help-forum
Brown bearOP
Hello, what is best way to handle internationalization in api routes, should I put the /api inside [lang]?
Also in navigation, when using Link from next/link if I am not on default locale when I am clicking on a link it sends to the default locale instead, am I supposed to create my own Link on top of Next/link and provide the locale={currentLocale} as prop? I thought in docs it says that it will use the current locale by default
Also in navigation, when using Link from next/link if I am not on default locale when I am clicking on a link it sends to the default locale instead, am I supposed to create my own Link on top of Next/link and provide the locale={currentLocale} as prop? I thought in docs it says that it will use the current locale by default
Answered by B33fb0n3
I should update the cookie in the middleware only if it is not set and update it when using the language switcher manuallyyes.
And if the user does not have any (i.e. first time visitor) your middleware set it to the default locale or browser locale
7 Replies
@Brown bear Hello, what is best way to handle internationalization in api routes, should I put the /api inside [lang]?
Also in navigation, when using Link from next/link if I am not on default locale when I am clicking on a link it sends to the default locale instead, am I supposed to create my own Link on top of Next/link and provide the locale={currentLocale} as prop? I thought in docs it says that it will use the current locale by default
you can read the header
Where did you read the specific thing with the default locale? Can you link me the exact phrase?
Accept-Language. If you are using i18n or followed this guide ([click me](https://nextjs.org/docs/app/building-your-application/routing/internationalization)) then it will be automatically set to the correct value. That header can be read by your route handlerWhere did you read the specific thing with the default locale? Can you link me the exact phrase?
@B33fb0n3 you can read the header `Accept-Language`. If you are using i18n or followed this guide ([click me](https://nextjs.org/docs/app/building-your-application/routing/internationalization)) then it will be automatically set to the correct value. That header can be read by your route handler
Where did you read the specific thing with the default locale? Can you link me the exact phrase?
Brown bearOP
My bad, it was on the pages router not app router, for the app router I need to handle it myself?
@Brown bear My bad, it was on the pages router not app router, for the app router I need to handle it myself?
yea, your middleware should handle the whole routing stuff. Either let your middleware redirect to the default locale/read from the browser locale or save a cookie to load the same locale again while redirecting.
Like that all your links in your app can be without any locale
Like that all your links in your app can be without any locale
@B33fb0n3 yea, your middleware should handle the whole routing stuff. Either let your middleware redirect to the default locale/read from the browser locale or save a cookie to load the same locale again while redirecting.
Like that all your links in your app can be without any locale
Brown bearOP
I should update the cookie in the middleware only if it is not set and update it when using the language switcher manually, or should I set the cookie always in middleware with locale coming from request/default?
@Brown bear I should update the cookie in the middleware only if it is not set and update it when using the language switcher manually, or should I set the cookie always in middleware with locale coming from request/default?
I should update the cookie in the middleware only if it is not set and update it when using the language switcher manuallyyes.
And if the user does not have any (i.e. first time visitor) your middleware set it to the default locale or browser locale
Answer
happy to help