false NEXT_LOCALE cookie value when entring route directly

[islamBelabbes]

Description

Hey, there is a weird behavior when entering the route directly.

I have encountered this issue when working with NextJs and Express, as in my Express app, I get the wrong locale. 
Let's say we are now on : http://localhost:3000/ar,
If I typed http://localhost:3000/en in the search bar and entered it, 

NEXT_LOCALE value in the cookie is not the expected value it always returns the old local (http://localhost:3000/.
This video may show the issue more clearly.

Desktop.2024.04.27.-.15.31.05.06.mp4

Verifications

• I've verified that the problem I'm experiencing isn't covered in the docs.
• I've searched for similar, existing issues on GitHub and Stack Overflow.
• I've compared my app to a working example to look for differences.

Mandatory reproduction URL

https://github.com/islamBelabbes/next-intl-bug-repro-app-router

Reproduction description

Steps to reproduce:

1. Open reproduction
2. npm i
3. visit home page and try to change locale from the URL and enter it

Expected behaviour

NEXT_LOCALE as the current locale value

[amannn]

When a route like /en is visited, the next-intl middleware will return a response header set-cookie: NEXT_LOCALE=en. Once the browser receives this response, all subsequent requests will have the new cookie value set. If you want to read the locale of the current request, then please use useLocale()/await getLoacle().

Hope this helps!

[islamBelabbes]

Thank you for your response.

I think in order to send the current locale to my server, I need to set the a custom header manually with getLocale() instead of getting the cookie with the nextjs cookie function and inserting it in the header as it is .

[amannn]

Yep, that sounds correct to me. E.g.:

const locale = await getLocale();

fetch('http://localhost:3000/api/read', {
  method: 'GET',
  headers: { Cookie: 'NEXT_LOCALE=' + locale },
  cache: 'no-store'
})

You might want to consider if your API endpoint should really receive the locale via a cookie, or if another method of transport might be more appropriate (e.g. the accept-language header, a search param, etc.).