Wasp•12mo ago

Authentication check every click

Why that always that i click on screen the 'me' request is being done?

kapa.ai•1/8/25, 9:41 PM

Hi @Kbral. I'm kapa.ai, your friendly support bot. I will try to answer your question by searching through the knowledge base.

kapa.ai•1/8/25, 9:41 PM

----------------------
Based on the knowledge sources provided, it appears that Wasp's authentication system frequently checks the user's authentication status by making requests to the /auth/me/auth/me endpoint. This behavior is part of Wasp's built-in authentication flow, but the exact reason for checking on every click is not explicitly stated in the given information.

However, we can infer a few things:

The /auth/me/auth/me endpoint is used to retrieve the user's profile and check if they are authenticated Github Issue.
Wasp uses a JWT (JSON Web Token) for authentication, which is stateless. This means the server needs to validate the token on each request to ensure the user is still authenticated Github Issue.
The frequent checks might be a way to ensure that the user's authentication status is always up-to-date, preventing scenarios where a user's session has expired but they can still access protected resources.

It's worth noting that this frequent checking behavior might not be ideal in all scenarios, as it can lead to unnecessary network requests and potential performance issues. If this behavior is causing problems in your application, you might want to consider optimizing it or discussing it with the Wasp development team.

Unfortunately, the knowledge sources don't provide enough information to definitively explain why the /auth/me/auth/me request is made on every click. For a more detailed explanation or to discuss potential optimizations, you may want to reach out to the Wasp community or create an issue on their GitHub repository.
----------------------
Note: you can ask me a follow up question by @ mentioning me again

----------------------

kapa.ai•1/8/25, 9:41 PM

Sorry @Kbral, I seem to be having a bit of trouble. Don't worry though, I've pinged my support and they will try to fix me up! :technologist:

Perhaps try again in 15mins?

KbralOP•1/8/25, 9:42 PM

Is possible to set a timing to check this?

MEE6•1/8/25, 9:42 PM

Wohooo @Kbral, you just became a Waspeteer level 1!

KbralOP•1/8/25, 9:43 PM

Is possible to set a timing to check this??

miho•1/10/25, 9:38 AM

This is related to this React Query option: https://tanstack.com/query/v4/docs/framework/react/guides/window-focus-refetching

And you can configure React Query with https://wasp-lang.dev/docs/project/client-config#overriding-default-behaviour-for-queries

Window Focus Refetching | TanStack Query React Docs

If a user leaves your application and returns and the query data is stale, TanStack Query automatically requests fresh data for you in the background. You can disable this globally or per-query using...

Client Config | Wasp

You can configure the client using the client field inside the app declaration:

Mmiho This is related to this React Query option: https://tanstack.com/query/v4/docs/f...

sachdva•1/10/25, 9:40 AM

The amount of stuff I learn from you is amazing, thought this was a problem I couldn't fix!! Awesome wasp has support for everything!

KbralOP•1/10/25, 1:58 PM

It solved a lot of things, thank you @miho

MEE6•1/10/25, 1:58 PM

Wohooo @Kbral, you just became a Waspeteer level 3!

sachdva•1/16/25, 2:56 PM

I have to admit defeat how do you fix this?
Here is my answer from cursor

export default function App() {
  const location = useLocation();
  const navigate = useNavigate();
  const excludedPaths = useMemo(() => ({
    exact: ['/', '/login',  ],
    prefixes: ['/blog', ]
  }), []);

  const isPublicRoute = useMemo(() => {
    return excludedPaths.exact.includes(location.pathname) ||
           excludedPaths.prefixes.some(prefix => location.pathname.startsWith(prefix));
  }, [location.pathname, excludedPaths]);

  // Always call useAuth, but ignore its data for public routes
  const { data: user } = useAuth();
  const effectiveUser = isPublicRoute ? null : user;

export default function App() {
  const location = useLocation();
  const navigate = useNavigate();
  const excludedPaths = useMemo(() => ({
    exact: ['/', '/login',  ],
    prefixes: ['/blog', ]
  }), []);

  const isPublicRoute = useMemo(() => {
    return excludedPaths.exact.includes(location.pathname) ||
           excludedPaths.prefixes.some(prefix => location.pathname.startsWith(prefix));
  }, [location.pathname, excludedPaths]);

  // Always call useAuth, but ignore its data for public routes
  const { data: user } = useAuth();
  const effectiveUser = isPublicRoute ? null : user;

|
The issue was that we can't conditionally call hooks in React (even with a ternary operator). Instead, we'll:
Always call useAuth()
But ignore its data when we're on a public route by using effectiveUser
This should prevent the React hooks error while still maintaining the desired behavior. The auth check will still happen, but it won't affect your other sessions because we're not using its result on public routes.
If you want to completely prevent the auth check, you'll need to modify this at a deeper level in your Wasp configuration or create separate route handlers for public and private routes.

My splash page gives a 401 which logs me out of my other pages.
I assume this will happen rarely, who is looking at the splash page of website AND logged in and working? but how do you all fix this error?

matijash•1/16/25, 3:36 PM

@AAA what is the exact issue you're tyring to fix? You get 401 when you try to visit a landing/splash page as a logged in user?

sachdva•1/16/25, 3:37 PM

Yes!
So you have two pages. The landing page and you didn't login and a new page that in a new tab and you logged in.

You go back ot the landing page and it gives you a 401 which logs you out of the new tab as well

I've noticed I've had this problem quite a long time but ignored it and can't solve it!

matijash•1/16/25, 3:41 PM

hm interesting. @Vinny (@Wasp) when you get a chance - is this a reproducible issue with Open SaaS?

miho•1/16/25, 3:41 PM

This is a known issue in Wasp, sadly I'm not sure you'll be able to solve it without us updating Wasp's auth implementation. Luckily... we'll prioritise this for our next planning meeting so you have something to look forward to

https://github.com/wasp-lang/wasp/issues/1227

GitHub

Revisit auth token clearing behavior on 401 responses · Issue #1227...

Currently, when we get a 401 response, we clear the auth token: wasp/waspc/data/Generator/templates/react-app/src/api.ts Lines 36 to 41 in 226ec39 api.interceptors.response.use(undefined, (error) =...

sachdva•1/16/25, 3:42 PM

Ah!! Thank you miho!!!!

export default function App() { const location = useLocation(); const navigate = useNavigate(); const excludedPaths = useMemo(() => ({ exact: ['/', '/login', ], prefixes: ['/blog', ] }), []); const isPublicRoute = useMemo(() => { return excludedPaths.exact.includes(location.pathname) || excludedPaths.prefixes.some(prefix => location.pathname.startsWith(prefix)); }, [location.pathname, excludedPaths]); // Always call useAuth, but ignore its data for public routes const { data: user } = useAuth(); const effectiveUser = isPublicRoute ? null : user;