Authentication State Doesn't Persist Through Page Refresh

[MoonKraken]

First of all thank you for yew-oauth2 - having oauth in Rust webapps is amazing.

It seems like the access/refresh tokens are stored in an OAuth2Context object that can be retrieved by child components of <OAuth2>. Consequently, auth state seems to be lost when the page is refreshed.

I'm not an expert in auth flows, but wouldn't storing the access token in a cookie be preferable? Both to resolve this issue and because it's likely all or most requests to backend APIs will need to include the access token anyway.

I suppose that would make this crate a bit "opinionated" in that some developers might want to handle this a different way. What's your recommended approach for handling this given how the crate works today?

[ctron]

Thank for the great feedback! 😄

To my understanding (and I guess there are many opinions on how to do it right), the access token should not be stored.

You are right, what currently happens is that, when you reload, the access token is lost. When redirection is in place, that would redirect you to the oauth provider. And if that figures out that you are still logged in, would automatically redirect you back to the application with a new code, which you can then trade for an access token. So, nothing is stored.

We use that with Keycloak, and it works as expected. However, I guess not everyone wants to do it the same way.

Taking a look at some pages from Auth0: https://auth0.com/docs/secure/security-guidance/data-security/token-storage#browser-in-memory-scenarios

Auth0 recommends storing tokens in browser memory as the most secure option.

And (the note):

The in-memory method for browser storage does not provide persistence across page refreshes and browser tabs.

However, I think it may be a valid use case to store the access (and I guess the refresh token) in the browser local storage. If someone does want to do that. I guess that yew-oauth2 could be enhanced to support that, in addition, when enabled.

The code already stores some state, which is needed to verify the code, and trade in the access token. So that part could also check for an existing access token, and try to use it instead. And when a new token is fetched, that could be stored in the local browser storage.

[MoonKraken]

got it, thanks ctron! Closing...

[NickLarsenNZ]

@ctron: When redirection is in place, that would redirect you to the oauth provider. And if that figures out that you are still logged in, would automatically redirect you back to the application with a new code, which you can then trade for an access token.

When I reload my page, this redirection doesn't happen, I only see the <NotAuthenticated/> view.

How would I go about adding this redirection in for staying logged in, while not storing the token?

[ctron]

True, as the <NotAuthenticated> component isn't designed to handle this. For this you would need to use the <Redirect> component. IIRC, there is no example for this (yet).

What should happen is that it component detects that an authentication context/token is missing, and so it would redirect to the SSO server. If that still has a session active (maybe using cookies or storage) it would immediately redirect back to the application. So for the user, this would be transparent.

I will see if I can add an explicit example for this case.

[ctron]

I tried to create an example, but found out that Redirect had a different use case in mind: redirect to a URL once the session expired (or got logged off). I guess I should have documented that better 😀

So I created #6

I think it makes sense supporting this, and I would welcome your input on how to add this (how it would work best for you).

[ctron]

I released version 0.4.0, which improves the Redirect components a bit. This should make it easier to implement your use case. I also created a new example: https://github.com/ctron/yew-oauth2/tree/main/yew-oauth2-redirect-example

[NickLarsenNZ]

Thanks @ctron. I'll give that a try :)