← back to showcase

4. OAuth2 token flow (userinfo scope)

Uses google.accounts.oauth2.initTokenClient instead of the ID-token flow. This is the classic OAuth2 implicit-style token grant: you get a bare access token, not a signed identity token, so the client has to call an API (here, userinfo) to learn who the user is. This is the pattern you'd use for requesting extra scopes (Drive, Calendar, etc.), not just login.

Raw token grant response (from initTokenClient):

Raw userinfo response:

Where's the verification step here?

There's no separate "verify" step to run in this flow — verification is implicit. Unlike the ID-token variants, there's no signed JWT to check; instead, the endpoint this page calls with the access token only returns data when the token is valid and non-expired: 

GET https://www.googleapis.com/oauth2/v3/userinfo
Authorization: Bearer <access_token>

If the token were forged or expired, that request would fail with a 401 instead of returning a profile — Google is doing the verification server-side as part of answering the call.

End-to-end flow:

  1. Browser loads Google's gsi/client script
  2. User clicks the button, requestAccessToken() opens Google's consent popup
  3. Google returns a bare OAuth2 access token (no identity claims)
  4. Your JS calls userinfo (or any authorized API) with Authorization: Bearer <token>
  5. Google validates the token server-side before answering
  6. In a real app you'd typically send the access token to your backend, which makes the same API call rather than trusting the browser's result