You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
But I've seen very few explanations of this problem below, and I'm not sure if it's just my way of setting things up that's wrong, or if everyone else has figured out a way to solve this problem.
Here is my problem:
I am using Next-Auth with next-intl (App Router (Server Components))
The folder structure is src/app/[locale]
src/app/[locale]/api
If we put app/api into app/[locale]/api, then the general API will work e.g. fetch('/api/test') .
But it will cause next-auth's authentication api /app/[locale]/api/auth/[...nextauth].ts failed.
You will not be able to use the signin or signout function.
src/app/api
If we use app/api, then next-auth's authentication api /app/api/auth/[...nextauth].ts works fine,
But normal api requests fetch('/api/test') may fail due to a change in language that causes the URL to change fetch('/api/[locale]/test').
Of course, I can fix it by doing the following, but I doubt if this is a good way.
Has anyone else had this problem? How did you solve it?
I'd like to find a solution where the folder structure looks like the following and both Next-Auth and Fetch work properly. src/app/[locale] src/app/api
reacted with thumbs up emoji reacted with thumbs down emoji reacted with laugh emoji reacted with hooray emoji reacted with confused emoji reacted with heart emoji reacted with rocket emoji reacted with eyes emoji
-
I am using Next.js 13.
When using Next-Auth with Next.js 13, we will need a Route Handlers at the following paths
/app/api/auth/[.... .nextauth]/route.ts
At the same time, we also need to set the middleware.ts
When we use both Next-Auth and next-intl, the setup becomes more complicated, but there is an official tutorial and example that shows us how to do it.
Next.js 13 middleware for i18n routing
Sample from amannn
But I've seen very few explanations of this problem below, and I'm not sure if it's just my way of setting things up that's wrong, or if everyone else has figured out a way to solve this problem.
Here is my problem:
I am using Next-Auth with next-intl (App Router (Server Components))
The folder structure is
src/app/[locale]
src/app/[locale]/api
If we put
app/api
intoapp/[locale]/api
, then the general API will work e.g.fetch('/api/test')
.But it will cause next-auth's authentication api
/app/[locale]/api/auth/[...nextauth].ts
failed.You will not be able to use the signin or signout function.
src/app/api
If we use
app/api
, then next-auth's authentication api/app/api/auth/[...nextauth].ts
works fine,But normal api requests
fetch('/api/test')
may fail due to a change in language that causes the URL to changefetch('/api/[locale]/test')
.Of course, I can fix it by doing the following, but I doubt if this is a good way.
Has anyone else had this problem? How did you solve it?
I'd like to find a solution where the folder structure looks like the following and both Next-Auth and Fetch work properly.
src/app/[locale]
src/app/api
Beta Was this translation helpful? Give feedback.
All reactions