Google authentication and authorization in Blazor webassembly


In my current blazor webassembly project I used the google authenticator. It is very simple to implement in Blazor web assembly. So i am making small blog post on this topic.

Step 1: Create the Blazor standalone project like this

This will create the all boilerplate code related with authentication and authorization.

microsoft.aspnetcore.components.webassembly.authentication package play the main role to communicate the authenticate users and obtain tokens to call protected APIs.

Step 2: Create a Google API Console project to obtain a client ID and client secret to configure the Google authentication in our application.

Follow the instruction as given below URL

https://developers.google.com/identity/sign-in/web/sign-in#before_you_begin

and create the credentials like this

Step 3: Go to appsettings.json file and keep the required configuration like this

Step 4: Change the startup file like this
Step 5: Run the application
Click on Log in button. It will route to google login page

After authentication, It will come to our blazor application like this

Summary:

We saw that with help of microsoft.aspnetcore.components.webassembly.authentication package. It is very simple to implement third party authentication in our blazor web assembly application.

Advertisement