Is it okay for getsession req to be made for every protected route or I should cache it?

Hey guys I have some routes which needs to be protected so I use this wrapper
export const ProtectedRoute: React.FC<ProtectedRouteProps> = ({ children }) => {
const { data, isPending, error } = authClient.useSession();

if (isPending) {
return (
<div className="flex items-center justify-center min-h-screen">
<div className="animate-spin rounded-full h-8 w-8 border-b-2 border-gray-900" />
</div>
);
}


if (error || !data?.session) {
return <Navigate to="/signin" replace />;
}

if (!data?.session || data.user.emailVerified === false) {
return <Navigate to="/verify-mail" replace state={{ flow: "signin" }} />;
}

return <>{children}</>;
}
export const ProtectedRoute: React.FC<ProtectedRouteProps> = ({ children }) => {
const { data, isPending, error } = authClient.useSession();

if (isPending) {
return (
<div className="flex items-center justify-center min-h-screen">
<div className="animate-spin rounded-full h-8 w-8 border-b-2 border-gray-900" />
</div>
);
}


if (error || !data?.session) {
return <Navigate to="/signin" replace />;
}

if (!data?.session || data.user.emailVerified === false) {
return <Navigate to="/verify-mail" replace state={{ flow: "signin" }} />;
}

return <>{children}</>;
}
so naturally every time I visit a route enclosed by this a api/auth/get-session call is made, I am a beginer and wanted to know is this behaviour okay or will it land a heavy hit on server?
5 Replies
Özgür
Özgür2d ago
It's normal don't worry about that
FalconiZzare
FalconiZzare2d ago
It should be that way. However you can use redis or any other similar approach to mitigate load on your auth server.
phantom3313
phantom3313OP19h ago
Is it a good practice if Use a auth context in and wrap the protected routes in it?? so it will make a initial getsession and the response will be saved in context. Since if I terminate this session remotly then even if the user seems to be logged in he cannot make any calls to server?
FalconiZzare
FalconiZzare18h ago
You can do so using Redux or Zustand, or by using stored cookie, however the session won't be fresh then, so user maybe able to see the UI of your protected route even if the session has ended in server/db. make sure to check session on server side for request. Also look into better-auth getSession and useSession functions, both are different and one probably uses built in cache AFAIK
phantom3313
phantom3313OP18h ago
yeah, using redux or zustand may leave the user hanging in the protected route the session is expired, but no data will be loaded right like we will obviously make sure in the server side that session is present before sending any data. So even if the pages are visible if they make any request, and we receive 401 I can log them out immediately. This was the idea I was having. As for the building case, I think it's the use session it is useful, but the thing is if I only use the protected route as I mentioned in my original post, this will mount unmount the different components each time the path changes so even though we are inside the protected route, it will make a new call to session every time.

Did you find this page helpful?