Handling authorization expiration in client-side, without passing the refresh token to client?

[realsuayip]

I'm currently handling authentication this way:

1. I'm using a server-side login page to login the user. After I validate credentials, I set an encrypted session cookie which contains refresh and access tokens.
2. I have written a server hook that checks the cookie in question. If it contains the tokens, I fetch the current user via upstream API. I also rotate the refresh token in case the upstream API returns 401 (i.e., the access token is expired).
3. I have the relevant layout files so that I can pass down user object to client (with access token, so that clients-side requests can be performed).

Everything works fine in server-side. However, if the access-token expires in client-side, I need to somehow force page reload so that backend server can refresh the token.

I don't want to rotate the token in client-side since I would have to pass-down the long-living refresh token to client, which is not optimal.

Notice at this point, I'm using universal page.js file with load() function.

A similar case, when I update the user object, how would I update the data (that was passed via layout) in client side?

[CaptainCodeman]

use invalidate / invalidateAll to trigger a refresh of data

https://kit.svelte.dev/docs/modules#$app-navigation-invalidate

[realsuayip]

Taking @CaptainCodeman's advice, I tried a lot of things with invalidation but could not get the behavior I wanted. Right now, the problem has evolved to this:

How would I invalidate in the context of universal load function, also re-triggering the current load itself in that context?

Invalidating in +page.svelte works, however it does not do for me since the page initially loads with empty data because of the 401 status.

In order to handle that, I would need to implement a function in client side that would handle 401 responses. This is not optimal since load() functions not always return API responses.

Calling invalidation functions in load context seems to be undefined behavior since I could not find any documentation about it or any examples. I think it should not matter, since load() runs in client side, provided browser is true? Oddly, only the parent load() functions are run.

Also, for some reason, if you invalidate in load(), navigating is indefinitely set to true.