#That s not the best way of going about
narrow hawk
Oh thanks milo I was just having a read through https://nextjs.org/docs/pages/building-your-application/routing/internationalization which looks like its for the old pages which my next app is using currently, havent migrated yet
after some reading I see what you're saying its much easier to let next.js [lang] folder handle the pages instead of me creating them
i'll run through implementation and come back if i need help, thank you!
narrow hawk
module.exports = {
i18n: {
// These are all the locales you want to support in
// your application
locales: ["default", "en", "fr", "zh", "hi"],
// This is the default locale you want to be used when visiting
// a non-locale prefixed path e.g. `/hello`
defaultLocale: "default",
localeDetection: true,
},
console.log("locale is: ", req.nextUrl.locale); //returns default
I went to chrome://settings/languages and changed to french, did a hard restart of the server + browser and still shows as 'default'
Any idea why?
oblique mirage
Try checking the value returned by the negotiator, and also the Accept-Language header on the page request in the network tab of the browser dev tools
narrow hawk
cant seem to see any console logs from my middleware in the terminal I run the server in anymore, was working an hour ago (even reverted my changes to earlier and still no logs are showing)
I'll try the negotiator value and the accept-language header again ty
oblique mirage
Just for context, the negotiator will pick a locale that best fits your Accept-Language header and that's set by your browser based on your in-browser and os preferences. So for example if you have two locales en and it and your header looks like this en,it;q=0.9,fr;q=0.8 then you'll get the english version of the page and you'll also be able to switch to italian and french. But if your header looks something like this en then you won't be able to chose any language other than english.
If you want to avoid this you can skip the negotiator altogether, serve the default locale and let the user chose what's best for them
narrow hawk
If you want to avoid this you can skip the negotiator altogether, serve the defa...
Yea the plan is to default on the browser language
until the user sets a cookie value via a button to change their language on the site to something other than their browser lang, that cookie will take precedence over everything else for setting language
my issue is that right now for some reason I can't get the middleware to run on the root page, every other page is works fine on so im not sure whats going on but i did just upgrade to next13 so that might be it.
oblique mirage
Can you show me the matcher config of your middleware?
narrow hawk
Can you show me the matcher config of your middleware?
I fixed it last night at like 1am lol
I messed around with the matcher a bit and it seemed like it was the issue but the fix seems hacky and im not sure why it worked.
went from
return route.match(new RegExp("/(|.*)"));
to
export const config = {
matcher: (route) => {
console.log("Matching:", route);
return route.match(new RegExp("/(|.*)"));
},
};
Glad it works ✌️
I'm not sure why you're doing it this way instead of how it's shown in the documentation:
export const config = {
matcher: [
'/((?!api|_next/static|_next/image|favicon.ico).*)',
],
}
Its been a while since i wrote that section but i think perhaps it was old documentation that had the way I wrote it? unsure but I handled what the matcher handles at the top level of my middleware now
export const middleware = async (req) => {
//don't check api routes or _next folder
if (
req.nextUrl.pathname.startsWith("/_next") ||
req.nextUrl.pathname.includes("/api/") ||
req.nextUrl.pathname.startsWith("/images/") ||
req.nextUrl.pathname.startsWith("/fonts/") ||
req.nextUrl.pathname.startsWith("/pdf/") ||
req.nextUrl.pathname.startsWith("/textures/") ||
req.nextUrl.pathname.startsWith("/unity/") ||
req.nextUrl.pathname.startsWith("/videos/") ||
req.nextUrl.pathname === "/favicon.ico"
) {
return;
}
was annoying!