NextAuth with Spring Backend
Unanswered
Siamese Crocodile posted this in #help-forum
Siamese CrocodileOP
I have implemented a session-cookie based authentication on my spring backend and it all works flawlessly with all the needed API routes protected by spring and was just wondering how I can access the user's authenticated status (and some of their info like username, email, etc) on my NextJS frontend. Can I somehow use NextAuth on the frontend nextjs app to work with my spring backend? Or am I asking the wrong question? I'm not really sure how it works. I still want my spring backend to be the central authentication and authorization handler
22 Replies
Toyger
you can use rewrites
https://nextjs.org/docs/pages/api-reference/next-config-js/rewrites to have direct access to your api on frontend
https://nextjs.org/docs/pages/api-reference/next-config-js/rewrites to have direct access to your api on frontend
Siamese CrocodileOP
But isn't that something like a proxy to my backend? Unless I've understood it wrong?@Toyger
@Siamese Crocodile But isn't that something like a proxy to my backend? Unless I've understood it wrong?<@536484914221285376>
Toyger
yeah it is, some kind of reverse proxy like that is most easiest way to query your backend without configuring cors and messing with cookie policies.
and just send it every request, thats what we do
@Toyger yeah it is, some kind of reverse proxy like that is most easiest way to query your backend without configuring cors and messing with cookie policies.
Siamese CrocodileOP
I've already configured csrf and cookie policies on my spring backend. I'm just looking for a way to access the authenticated user and their auth status and other details like username, email, etc on the front-end to restrict access to protected pages and redirect them to login page if they aren't logged in
@Marble gall you can do bearer token instead
Siamese CrocodileOP
You mean use jwt instead of sessions? Or use a combination of jwt and session?
Marble gall
just jwt token, if it expires or 401s just redirect to login
what we have in the backend are api, we just made a frontend out of it, the same api used by mobile app
@Siamese Crocodile I've already configured csrf and cookie policies on my spring backend. I'm just looking for a way to access the authenticated user and their auth status and other details like username, email, etc on the front-end to restrict access to protected pages and redirect them to login page if they aren't logged in
Toyger
then you need to query your backend at server side of nextjs, where you prehydrate your ssr, and do actions based on data you have, and still rewrite is better because you'll have access to your auth cookies directly inside nextjs
@Marble gall just jwt token, if it expires or 401s just redirect to login
Siamese CrocodileOP
I have something similar working with session and cookie. When i login, a session cookie is created and i can make calls to protected api routes. If the cookie isn't present, I get a 401 error. But this was only on postman and I'm trying to look for a way to implement on the front-end
@Siamese Crocodile I have something similar working with session and cookie. When i login, a session cookie is created and i can make calls to protected api routes. If the cookie isn't present, I get a 401 error. But this was only on postman and I'm trying to look for a way to implement on the front-end
Marble gall
in the middleware add the Authorization Bearer header with the token
the middleware must send this every request
@Toyger then you need to query your backend at server side of nextjs, where you prehydrate your ssr, and do actions based on data you have, and still rewrite is better because you'll have access to your auth cookies directly inside nextjs
Siamese CrocodileOP
You query the backend to get the user's auth status and based on what response is sent back i should perform the redirection on the front-end? Also i thought session cookies are httpOnly, so how can I check for it's existence on the front-end?
Marble gall
we didnt use cookies, we just used local storage
@Marble gall we didnt use cookies, we just used local storage
Siamese CrocodileOP
You were storing the jwt token on local storage?
@Siamese Crocodile You were storing the jwt token on local storage?
Marble gall
wait its local storage i think
@Marble gall wait its local storage i think
Siamese CrocodileOP
Do you have a repo i can take a look at on github?
Cuz I'm not able to understand what you meant
@Siamese Crocodile You query the backend to get the user's auth status and based on what response is sent back i should perform the redirection on the front-end? Also i thought session cookies are httpOnly, so how can I check for it's existence on the front-end?
Toyger
you check them not on frontend, on backend, and prehydrate page accordignly, yeah having access to cookies is not a lot benefit, it only will allow to reject request if cookies are not presented, if they are presented you still need to query your java backend to verify session, and only after that prehydrate page for user.
@Toyger you check them not on frontend, on backend, and prehydrate page accordignly, yeah having access to cookies is not a lot benefit, it only will allow to reject request if cookies are not presented, if they are presented you still need to query your java backend to verify session, and only after that prehydrate page for user.
Siamese CrocodileOP
So on every protected page i visit, I need to query the backend for auth status and then decide based on response?
@Siamese Crocodile So on every protected page i visit, I need to query the backend for auth status and then decide based on response?
Toyger
yeah, you have "3rd party" auth, you can check any other alternative like supabase,auth0,clerk which doing basically same thing, and check how they implemented in nextjs.