URL encoded characters when use 'prefix_and_default'

[szwenni]

Environment

• Operating System: Darwin
• Node Version: v16.16.0
• Nuxt Version: 3.0.0
• Nitro Version: 1.0.0
• Package Manager: [email protected]
• Builder: vite
• User Config: -
• Runtime Modules: -
• Build Modules: -

latest i18n nuxtjs module

Reproduction

Create a project with nuxtjs/i18n and create a page like [name].vue,
Strategy must be 'prefix_and_default' and at least two locales should be created

Now call the url with /äütest123

You will end up in a endless redirect loop

Describe the bug

A endless redirect loop when the URL contains special characters

Related code path:

i18n/src/runtime/utils.ts

Line 309 in 81e2956

if (isString(routePath) && routePath && routePath !== fullPath && !routePath.startsWith('//')) {

As you can see from the log, routePath and fullPath are different but if encode/decode both they result in being the same

Right now they are different which leads to redirect loops

Additional context

No response

Logs

detectRedirect: route ->  {                                                                                                   12:57:43
  fullPath: '/news/hoffnungsschimmer-kriegen-ftx-glaeubiger-ihr-geld-zurueck%C3%A4',
  hash: '',
  query: {},
  name: 'news-name___de___default',
  path: '/news/hoffnungsschimmer-kriegen-ftx-glaeubiger-ihr-geld-zurueck%C3%A4',
  params: {
    name: 'hoffnungsschimmer-kriegen-ftx-glaeubiger-ihr-geld-zurueckä'
  },
  matched: [
    {
      path: '/news/:name',
      redirect: undefined,
      name: 'news-name___de___default',
      meta: {},
      aliasOf: undefined,
      beforeEnter: undefined,
      props: [Object],
      children: [],
      instances: {},
      leaveGuards: Set(0) {},
      updateGuards: Set(0) {},
      enterCallbacks: {},
      components: [Object]
    }
  ],
  meta: {},
  redirectedFrom: undefined,
  href: '/news/hoffnungsschimmer-kriegen-ftx-glaeubiger-ihr-geld-zurueck%C3%A4'
}
detectRedirect: calculate routePath ->  /news/hoffnungsschimmer-kriegen-ftx-glaeubiger-ihr-geld-zurueckä /news/hoffnungsschimmer-kriegen-ftx-glaeubiger-ihr-geld-zurueck%C3%A4

[ineshbose]

Hi, thanks for opening an issue and providing the steps for reproduction. It would be a great help if you could provide a StackBlitz link (using https://stackblitz.com/github/nuxt/starter/tree/v3-stackblitz) with the same steps if possible to immediately get on debugging please!

[szwenni]

Hi,

I triggered the same error in stackblitz here.

https://stackblitz.com/edit/github-kvhg77?file=pages/[name].vue

The links on home are on purpose a a tag to force i18n to initialize again.

BR,
Sven

[szwenni]

Any updates here ? If it is easier I can try to create a pull rewuest with how I would imagine it to work.

[kazupon]

@szwenni
Thank you for your reproting!
Sorry, late my reply.

Of course we welcome any PR from community!

[szwenni]

Hi,
just for completness:
This happens with every character in the URL which is encoded by the browser. So whitespaces or any UTF-8 character.
I'm trying to write a fix but that is quite a big impact. I know it is just with this strategy but from my point of view this could potential affect a lot of pages, especially news pages where whitespaces in URLs are daily business. Or languages which use UTF-8 signs more heavily than the german language.

[szwenni]

Pull request created