nextjs-auth0
nextjs-auth0 copied to clipboard
Improve App Router DX/documentation
Checklist
- [X] I have looked into the Readme, Examples, and FAQ and have not found a suitable solution or answer.
- [X] I have looked into the API documentation and have not found a suitable solution or answer.
- [X] I have searched the issues and have not found a suitable solution or answer.
- [X] I have searched the Auth0 Community forums and have not found a suitable solution or answer.
- [X] I agree to the terms within the Auth0 Code of Conduct.
Describe the problem you'd like to have solved
Using nextjs-auth0 with the App Router results in a bunch of noisy warnings:
nextjs-auth0 is attempting to set cookies from a server component,see https://github.com/auth0/nextjs-auth0#using-this-sdk-with-react-server-components
The advice given isn't particularly clear, but the only issue by default seems to be the first one:
If you have a rolling session (the default for this SDK), the expiry will not be updated when the user visits your site. So the session may expire sooner than you would expect (you can use withMiddlewareAuthRequired to mitigate this).
However, enabling withMiddlewareAuthRequired
isn't an option for this project; logging in is optional. And even when using it, the warning is still printed constantly!
Digging through the source, I found that this middleware might do something similar while keeping auth optional, but the touchSession
function isn't even officially documented!
import { touchSession } from '@auth0/nextjs-auth0/edge';
export async function middleware() {
await touchSession();
}
A fresh project immediately after following the official setup guide should not be printing unavoidable warnings.
Describe the ideal solution
Only show the warning if there's an actual problem, that is, if userland code tries to set a cookie, or if there is no middleware configured to touch the session.
Document touchSession
as an alternative to withMiddlewareAuthRequired
.
Alternatives and current workarounds
I suppose you could configure autoSave: false
in initAuth0
- I'm not sure if this would help. Maybe it should be set by default? At the very least, it should be documented if it helps!
Additional context
No response
How can I find out which RSC is trying to set cookies? In my code, I can't find any RSC that imports auth0 and retrieves session. It's always a client component. So IDK how or why this warning shows. It doesn't have any information about the exact location of the RSC.
Only show the warning if there's an actual problem, that is, if userland code tries to set a cookie.
So right now I get this warning even if I'm not doing anything wrong?
I'm getting this warning just by adding <UserProvider>
to my component tree in a server component layout. I'm not calling any other Auth0 SDK stuff, just rendering that component. I'm also using the middleware.
Not sure why the warning applies in this case
I found a comment in the source code for the <UserProvider/>
that provides some more context around this error message.
https://github.com/auth0/nextjs-auth0/blob/951a24864c61eec98702f91eb7784555d54916da/src/client/use-user.tsx#L97-L115
@mscottford Any chance of looking at the source code of getSession()
and finding out where, how and why it emits the warning?
I'm also confused by this. When are you emitting these warnings? I added getSession to every call in middleware per @adamjmcgrath 's advice and I'm still getting it: https://github.com/auth0/nextjs-auth0/issues/1552#issuecomment-1808521687
Also, my recent PR applies to this issue https://github.com/auth0/nextjs-auth0/pull/1750