I18n-module: first time translating does not work using switchLocalePath()

[miteyema]

Version

v6.0.0

Reproduction link

https://github.com/miteyema/nuxt-i18n-demo

Steps to reproduce

• go incognito
• open https://nuxt-i18n-demo.netlify.com
• click Nederlands to change language
• click français to change language
• click English to change language

What is expected ?

• URL changes to /nl
• page is translated in Dutch
• URL changes to /fr
• page is translated in French
• URL changes to /
• page is translated in English

What is actually happening?

• URL changes to /nl
• page is NOT translated in Dutch and stays in English
• URL changes to /fr
• page is translated in French
• URL changes to /
• page is translated in English

Additional comments?

Please see the following GIF below to see the problem in action:

_{This bug report is available on Nuxt community (#c267)}

[rchl]

That seems to be due to not getting set-cookie header in first page response. I don't know netlify, is that something that you have to configure (allow)? It's either netlify blocking the cookie or preventing it from being sent somehow or code of this module doesn't go the right path for some reason...

[miteyema]

@rchl Thanks for the reply.

I have the same problem if I test my project locally.
Steps to reproduce:

• npm run generate
• http-server ./dist/
• go in incognito to http://127.0.0.1:8080

The app behaves the same locally as on Netlify, i.e. the bug described above.
So I guess it's code of the module, do you have any idea what can be the problem?

[rchl]

That would explain it. Statically generated page can't respond with a cookie header. It will only work when running on a node server.

I don't have time to look into it more now, I guess it might be fixable in some way and if not, it should be documented better.

[miteyema]

@rchl Thanks for the reply, it gave me an idea for a quick fix in my case.
The following line seems to solve my problem for npm run generate

detectBrowserLanguage: false

Can you point me to the code regarding the cookie header, maybe I can have a look at the problem?

[rchl]

The very initial load of the page sets the cookie here https://github.com/nuxt-community/nuxt-i18n/blob/5aeab8bd7f4b05ce3b05558eedf1150f58c19514/src/templates/middleware.js#L117

But I think middlewares are only ran on generating pages so the code has no chance of triggering when loading static pages...

[MLDMoritz]

detectBrowserLanguage: false

this fixed a big issue with memory leakage for me too.

[rchl]

This bug is caused by Nuxt not invoking middleware for initial request (see this comment for more info: https://github.com/nuxt/rfcs/issues/28#issuecomment-527939500). It can most likely be worked around by moving some part of the code to the plugin.

[miteyema]

@rchl Thanks again for having looked at the bug I was having!

[JuliaUsanova]

that kind of settings worked for me:

detectBrowserLanguage: {
          // If enabled, a cookie is set once a user has been redirected to his
          // preferred language to prevent subsequent redirections
          // Set to false to redirect every time
          useCookie: true,
          // Cookie name
          cookieKey: 'i18n_redirected',
          // Set to always redirect to value stored in the cookie, not just once
          alwaysRedirect: false,
          // If no locale for the browsers locale is a match, use this one as a fallback
          fallbackLocale: 'en'
        }