What's the safest method to store refresh tokens on the client side with Laravel Passport?

I’m building an app using OAuth 2.0 with Authorization Code Grant and PKCE. My setup has two local servers: one for SSO and another for the frontend web app.

Here’s what I’ve done so far:

The frontend sends users to the auth server and then handles the callback at /auth/callback. In this callback, I swap the auth code for access and refresh tokens using a special endpoint on the SSO server.

The server sends back a JSON response with the tokens and expiration time. Now, my JavaScript can see the refresh token.

I’m stuck on how to keep this refresh token safe on the frontend. What’s the best way to do this? I want to make sure it’s secure and not easy for bad actors to get their hands on.

Any tips or best practices would be super helpful. Thanks!

Storing refresh tokens securely on the client side is indeed challenging. One approach you might consider is using a combination of secure, HttpOnly cookies and server-side session storage. This method leverages Laravel’s built-in session handling capabilities.

For example, you can store a session identifier in a secure, HttpOnly cookie on the client and keep the actual refresh token on the server associated with this session ID. When a refresh is needed, the frontend sends the session cookie to the backend, which then retrieves the refresh token using the session ID to perform the token refresh.

This approach minimizes the client-side exposure of the refresh token while maintaining functionality. It is not foolproof, but it offers a good balance of security and practicality for many use cases.

yo, refresh tokens are tricky! have u thought about encrypting it before storage? u could use laravel’s built-in encryption helpers. maybe store it in a secure cookie or even consider splitting it across multiple storage methods for extra security. just dont put it in localstorage, thats asking for trouble!

Hey there! Have u considered using HttpOnly cookies for storing refresh tokens? they’re safer than local storage cuz they’re not accessible via JavaScript. But I’m curious, what made u choose separate servers for SSO and frontend? That setup sounds interesting! How’s it working out for u so far?