How always redirect to browser language page in nuxtjs?

Question

I use nuxt and nuxt-i18n for my multilingual site. By default, if user open my site, they redirected to their language page. After this he can change locale. But if user close browser tab and open it again, he not be redirected. I set in config:

  detectBrowserLanguage: {
    useCookie: true,
    cookieKey: 'i18n_redirected',
    alwaysRedirect: true,  // this changed
  },

In this case user always redirected when open site, but he can't change locale manually.

What I need: When user is coming to site he redirected to his locale page, for example mysite.com/en or mysite.com/ru After this user can change locale. When user close browser tab, and coming to site in new tab, he redirected again.

UPD:

I found simple solution for simple task. Task: on main page redirect to mysite.com/en if browser language is en After this user can manually change language to default mysite.com It only for main page. I did following in index.vue

  beforeMount () {
    const browserLang = (window.navigator ? (window.navigator.language 
            || window.navigator.systemLanguage 
            || window.navigator.userLanguage) : "ru").toLowerCase().substr(0, 2)

    if (browserLang == 'en' && window.location.pathname == '/' 
          && document.referrer.indexOf(window.location.origin) < 0) {
      window.location.pathname = '/en'
    }
  }

It's working good. I hope it will helpful for somebody.

PS: If you know more gracefull solution it will be cool

How always redirect to browser language page in nuxtjs?

0 Answers0