differentDomains: fails to load through the language switcher (Netlify)

[simonhrogers]

Version

nuxt-i18n: 6.15.4 nuxt: 2.14.7

Nuxt configuration

mode:

• [X] universal
• [] spa

Nuxt-i18n configuration

Reproduction Link

https://github.com/simonhrogers/Amgueddfa-Cymru_Frontend

Steps to reproduce

Hosting on Netlify, no dynamic routes at present – just two static ones (very simple holding page).

<li v-for="locale in $i18n.locales" v-if="locale.code !== $i18n.locale">
  <a :href="switchLocalePath(locale.code)" :key="locale.code">{{ locale.name }}</a>
</li>

What is Expected?

Navigate between https://becomingrichardburton.museum.wales/information and https://bywydrichardburton.amgueddfa.cymru/information with the language switcher.

What is actually happening?

The redirect fails to load. Visiting the same URL directly would work perfectly. Error message in console is:

The FetchEvent for "https://bywydrichardburton.amgueddfa.cymru/information" resulted in a network error response: the promise was rejected.

[simonhrogers]

I’ve solved my initial problem by setting strategy to the following:

strategy: 'no_prefix',

I might have missed this in the docs, but its not something I remember seeing a reference to anywhere in the context of differentDomains. Something seems to go wrong with Netlify’s route generation when i18n add’s prefixes – even static routes do not seem to generate correctly.

Please feel free to close, although I would be interested to know why this is / whether this is a bug.

[rchl]

I think the static deployment and differentDomains option might not be exactly compatible. At least that's what I've stated in https://github.com/nuxt-community/i18n-module/issues/885#issuecomment-689482998 but I don't remember exactly what was the issue.

[divine]

Hello,

I have gone ahead and searched how next handles this, I know this a nuxt module but still it should be pretty similar in handling i18n.

Surprise they don't just handle static generation at all and just added a note:

How does this work with Static Generation? Note that Internationalized Routing does not integrate with next export as next export does not leverage the Next.js routing layer. Hybrid Next.js applications that do not use next export are fully supported.

@rchl I think adding a similar note that different domains don't work well yet with static generation might help?

Anyway, I think it's pretty complicated but still should be possible to do...

Also, another question, maybe we can use ufo for correct hostname detection?

https://github.com/nuxt-contrib/ufo/blob/main/src/parse.ts#L59

Should I prepare a PR with these changes?

Thanks!

[rchl]

I'm fine with adding a note about that in the documentation since I don't have time to investigate if it's possible to handle it in some way. And if it is, it likely wouldn't be trivial.

Also, another question, maybe we can use ufo for correct hostname detection?

https://github.com/nuxt-contrib/ufo/blob/main/src/parse.ts#L59

Do you mean to replace this code?

https://github.com/nuxt-community/i18n-module/blob/97bce079d730a5887456abdbea87dea82d6ed8a1/src/templates/utils-common.js#L93-L97

I honestly can't see much benefit to switching to it. It's just a different way to do it but with the same end-result while including extra dependency.

[rchl]

I'm also confused by the comment above which says that it works with NO_PREFIX+differentDomains.

There is in fact a code that explicitly says it's an invalid combination: https://github.com/nuxt-community/i18n-module/blob/97bce079d730a5887456abdbea87dea82d6ed8a1/src/core/hooks.js#L38-L42

[divine]

I honestly can't see much benefit to switching to it. It's just a different way to do it but with the same end-result while including extra dependency.

@rchl well, it runs decodeURIComponent() on host part.

I thought it would help to detect better the host part. Who knows what type of host user might use...

Thanks!

[Veerpool]

if you use nginx set

    proxy_set_header Host               $host;
    proxy_set_header X-Real-IP          $remote_addr;
    proxy_set_header X-Forwarded-For    $proxy_add_x_forwarded_for;
    proxy_set_header X-Forwarded-Proto  $scheme;

and will work

[stale[bot]]

This issue has been automatically marked as stale because it has not had recent activity. It will be closed if no further activity occurs. Thank you for your contributions.