authenticationoauthgoogle-oauthopenid-connectgoogle-openid

How to "sign in with Google" (id_token) *and* receive a code/access_token for specific scope (for the backend)


I'm building an application where a user should be able to sign in with Google, but afterwards, the backend server needs access to some data from the users's account (analytics.readonly scope).

If I understand it correctly, this can be done with the "OAuth Hybrid Flow": An id_token and an authorization_code are returned on the front channel, but the sensitive access_token and refresh_token can only be retrieved on the back channel.

Yet, Google does not seem to provide this functionality.

I imagined that my frontend could receive both an id_token and a code as URL parameters after the Google OAuth flow. The React frontend would then POST both the id_token and the code to my Flask backend.

The backend would then 1) check the id_token, 2) exchange the code for a refresh/access token and return an authenticated session cookie to the frontend.

Now my question:

Thanks!


Solution

  • I would handle the token management on the backend instead of doing it in the frontend.

    The authorization code is only used as part of the authorization code flow.The code is just a random token and does not contain any user info, so you can't use it to signin the user.

    You can't get the id_token and authorization_code at the same time, why would you? Auth code flow is a two step process, so you always get a code first, that you then can exhange for the id/access tokens.

    I would consider looking at this this great video for how to approach authentication for SPA applications.