Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Can't get Auto Redirect to work #139

Open
iDVB opened this issue Jun 15, 2022 · 3 comments
Open

Can't get Auto Redirect to work #139

iDVB opened this issue Jun 15, 2022 · 3 comments

Comments

@iDVB
Copy link

iDVB commented Jun 15, 2022

We have dynamic language routes working...
image
and we only have a single page /pages/index.js

When we manually browse to /en-US or /fr-FR it works and is translating.
However, I would think that when browsing to / that it should detect that we have our browser settings to 'fr-FR` and redirect us to the language specific route. no?

image

plugin settings:

{
  resolve: `gatsby-plugin-react-i18next`,
  options: {
    localeJsonSourceName: `locale`, // name given to `gatsby-source-filesystem` plugin.
    languages,
    defaultLanguage,
    redirect: true,
    // if you are using Helmet, you must include siteUrl, and make sure you add http:https
    siteUrl: siteMetadata.siteUrl,
    generateDefaultLanguagePage: true,
    // you can pass any i18next options
    i18nextOptions: {
      debug: true,
      saveMissing: false,
      interpolation: {
        escapeValue: false, // not needed for react as it escapes by default
      },
      keySeparator: false,
      nsSeparator: false,
      detection: {
        order: ['navigator', 'browser'],
        caches: ['localStorage'],
      },
    },
  },
},
@m5kr1pka
Copy link

+1

@warmshadow
Copy link

warmshadow commented Oct 12, 2022

Hey, @iDVB @m5kr1pka
I will try to guess where your problem could be.
Looking at the source code for this plugin we can see that on every page navigation, language for redirecting is detected like this:
let detected = window.localStorage.getItem(LANGUAGE_KEY) || browserLang({ languages, fallback: fallbackLanguage || language });

Basically if in your local storage there is already gatsby-i18next-language key with some language value it will take priority, no matter what is your browser's language. If this is a case, you can test it by removing that item from local storage, changing the browser's language and then refreshing that root page. Then the plugin should get the language from navigator, set that value to local storage and redirect. And from then on it should get that language on every page because it will retrieve the right value from the storage. Let me know if this helps.

P.S. to me it seems as a pretty weird implementation, because it would make sense to check for browser language first. Because even if you get redirected correctly when first landing on the website, if you then later navigate to the page that isn't translated to that language (unless every one of your page is translated to same set of languages), value in local storage will get set to default language again and from that point when navigating you will always get default language even if you go to the page which is translated to your browser's language. Unless I'm wrong and I'm missing the reason why it's done like this.

Edit: I think I realized why gatsby-i18next-language could be prioritized. It's most probably because when you use changeLanguage function to let the user change the language with language picker for example, that changing of language changes the gatsby-i18next-language value, so a user from that point on gets the language he chose himself instead of what comes from the browser settings.

@m5kr1pka
Copy link

The issue is somewhere deeper within, probably related to browser-lang library mentioned in issue #89. As it works, though I found out that it works on domains with www.*** and doesn't without. Kinda problem solved, though should be tested by someone who has more knowledge about the plugin.

The issue for me was: When you enter the site for the first time it always went to "EN" and was ignoring my browser was set to other locale. Later, I was switched domain to www.domain and it started working, figured it is browserLang issue (not sure that it is related).

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

3 participants