Best Practices for Associating userId (from JWT) with Google OAuth Tokens

I have a few questions regarding the OAuth flow in a hypothetical context. Let's imagine the following situation: we have a JavaScript client (React JS), a Keycloak server, and a REST API (Spring Boot). We use Keycloak to identify the user via a JWT. Once authenticated, we want to offer the user the ability to link their Google Calendar to their account. It is therefore necessary to associate the user ID (present in the Keycloak JWT subject) with the Google access tokens.

I've had trouble finding the optimal method to achieve this association, other than using the "state" parameter of the Google API. Below is a sequence diagram representing the flow I've envisioned.

Could you confirm if this flow follows best practices? Is it secure and common? Are there other ways to achieve this association?

Thank you in advance for your help and advice.

A more standard option would be for your JS client to always manage authentication via Keycloak and configure it to use Sign in via Google for those users, who only need to do a single login:

• Your JS client redirects to Keycloak

• Keycloak redirects to Google for you, and includes a calendar scope

When login completes, Keycloak should be able to use an embedded token approach:

• Keycloak access tokens include the Google access token as a custom claim

Your JS client then calls your APIs with the access token. Your APIs can get the inner token and call Google APIs with it (CORS restrictions will prevent the JS client from calling Google APIs directly).

I have not verified this end to end with Keycloak, but it is a pattern to aim for. An authorization server (like Keycloak) can manage many connections for your apps, which helps to reduce complexity.