Can't access translations in edge api route

[wottpal]

Description

I'm having a simple app/api/route.ts api route like:

import { getTranslations } from 'next-intl/server'

export const runtime = 'edge' // works only, if i comment this out

export async function GET() {
  const t = await getTranslations('Metadata')
  return new Response(t('name'), {
    status: 200,
    headers: { 'Content-Type': 'text/plain' },
  })
}

And this actually throws:

Error: `getTranslations` is not supported in Client Components.

…which is a bit randomly worded in the first place. And if i comment export const runtime = 'edge' out it works seemlessly.

How to use next-intl in an edge runtime? Also, I'm happy to pass the locale manually if that's the problem (which i do have at hand in this case in the edge environment).

Thanks in advance! :)

Verifications

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

Mandatory reproduction URL

https://example-is-simple.com

Reproduction description

Provided above ⬆️

Expected behaviour

getTranslations should work in edge runtime environments.

[wottpal]

Interestingly, the same error occurs when trying to use unstable_setRequestLocale ("[…] not supported in Client Components")

[amannn]

Hmm, that error is quite odd.

I've tried this out in a local example in this repo that uses a Route Handler:

https://github.com/amannn/next-intl/blob/ed4681fa70b8f67a97e1364deaabf58df302d80c/examples/example-app-router-playground/src/app/%5Blocale%5D/api/route.ts#L10-L18

For me this works in the edge environment. I've also tried not providing the locale (await getTranslations('ApiRoute')) and it seems to work regardless. You might want to consider passing the locale to getTranslations in the Route Handler when in doubt (this enables static rendering, if relevant).

If you're still running into an issue that you can trace back to next-intl, please provide a reproduction.

[github-actions[bot]]

Thank you for your report!

Unfortunately, the reproduction is missing or incomplete, and as such we cannot investigate this issue. Please add a reproduction to the issue, otherwise it will be closed automatically.

Templates:

• App Router
• Pages Router

Creating a good bug report takes time.

To help us resolve the issue quickly, please simplify the reproduction as much as possible by removing any unnecessary code, files, and dependencies that are not directly related to the problem. The easier it is for us to see the issue, the faster we can help you.

Apart from the reproduction, make sure to include the precise steps on how to reproduce the issue, e.g.:

1. Open reproduction
2. Click on …
3. See error: …

Thank you for your understanding!

FAQ

**"I've included a reproduction, what is missing?"** This comment might have been added because your reproduction doesn't point to a destination where the issue can be reproduced. Please make sure that the latest changes were saved in the reproduction and that the link is correct.

[wottpal]

Thanks for your investigation @amannn. I still have that issue. I'll see if i can provide a reproduction for this issue next week :)

[cjxe]

@wottpal did you manage to reproduce it or fix it? I have the same issue

[riccardolardi]

Same issue

[patoinguai]

Same issue

[amannn]

A reproduction would be important to be able to look into this. If someone is interested in getting this solved, you can help by providing one.

As a side note, you can probably use the core library as a workaround. I'd still be interested in getting to the bottom of this, so a reproduction would be appreciated.

[github-actions[bot]]

This issue has been automatically closed because it is currently not actionable and has become stale. If the problem persists, please create a new issue.