Google Identity And OpenID Connect On Cloud Run Part 1

Dev Thakkar
4 min readDec 12, 2021

Scenario: For pricestats application authenticate user with Google Identity

Tech stack: Identity Platform, OAuth 2.0, Secret Manager, Cloud Run, Python, Flask, Visual Studio Code (VS Code), Cloud Code

Requirements:

(1) Allow user to sign-in with Google Identity before displaying initial page of pricestats application.

(2) Use Identity Platform to sign in users with an OpenID Connect (OIDC) provider (Google)

(3) Store Oauth2.0 Client ID in Secret Manager

(4) Deploy python application to Google Cloud Run

Outcome:

Step 1: Prerequisites

  • Setup Google Cloud (GCP) account
  • Download VS Code. Install extensions for Python, Cloud Code and Authlib
  • Review medium article on pricestats to understand application functionality. This article focus is on user sign-in only

After completing all relevant steps from pricestats article start from Step 2 below

Step 2: Configure Google as a Identity Provider

  • Configure consent screen
  • On consent screen include Authorized domains as below

Step 3: Lets code

  • In VS Code select empty “pricestats” folder. Below diagram shows files in folder after completing code
  • Update requirements.txt as below
  • At terminal within pricestats folder run below commands
>  python -m venv env>  env\Scripts\activate.bat>  pip install -r requirements.txt
  • Update .dockerignore as below
  • Update Dockerfile as below
  • In templates folder create index.html, home.html and data.html
Show “Login” link when accesstoken not present (else statement)
After valid Google login the home.html page is displayed with pricestats dropdowns (symbol and days)
data.html will display graph after submit from home.html

Explanation: (1) home.html will display Login link (2) After login through Google Identity the user is directed to home.html page (3) home.html will display two drop downs (a) Symbol and (b) time in days (2) On submit the home.html formdata will route through “data” method in app.py (given below) (3) data.html shows selected (a) symbol (b) time in days and generated graph in img tag

  • util.py and and pricegraph.py remain same as provided in pricestats article
  • Update middleware.py as below

Explanation: validatetoken is a decorator function that verifies authenticated user

Note: Current design has session management within flask session only. In a production scenario each user session will be managed with a data store (eg Firestore) with token refreshed to prevent random user attacks

Review example python app session management using Firestore

From link https://developers.google.com/identity/sign-in/web/backend-authCreate an account or session
After you have verified the token, check if the user is already in your user database. If so, establish an authenticated session for the user. If the user isn’t yet in your user database, create a new user record from the information in the ID token payload, and establish a session for the user. You can prompt the user for any additional profile information you require when you detect a newly created user in your app.
  • Update config.py as below
Client ID and Client Secret were created in Step 2 of this article. Optional to store the keys in Google Secret Manager
  • Update app.py as below

Explanation: (1) initial page load shows the index.html page (2) User clicks on “Login” link that directs call to login method (3) From login method the user is redirected to auth method (4) Google Logon screen will be presented for user (in case user is already logged in then the screen will not pop) (5)After valid authentication the homepage method is called using route ‘/home’ (6) homepage method includes decorator validatetoken that verifies access token before allowing user to proceed

methods data and plot_jpeg provide similar pricestats functionality
clean up user from session during logout

Test Local => Continue to Part 2

--

--