How To Configure Google Sign-In For ASP.NET MVC 5: Part Sixteen

Before reading this article, I highly recommend reading the previous parts of the series on ASP.NET:

Introduction

Enabling an Authentication sign in with Google and to allow users of your application to sign in with their Google account, you will need to register an application in the Google Developers console. After you have registered the application you can use the Client ID and Client Secret supplied by Google to register the Google social login provider in your ASP.NET MVC application.

You can follow the below screenshot:

Open the Visual Studio and select the File, New, then click Project.

project

Select Installed > Templates > Visual C#, and select ASP.NET Web Application from the menu. Here, I have given the name of my project to be “WebApplication8”.

  • You can give the project name as you wish.

  • And then click on “OK” button to create your project.create

In the below figure as you can see the default MVC will be selected, select MVC and then click “OK” button.

ok

In Solution Explorer, your project has been created. Click on Web Application8 project.

Hit the ALT+ENTER key to show the properties.

properties

Right click on to your project and select properties, select “Web” from the menus and take note of the “Project Url”, as you will need this when specifying the Redirect URI in Google.

URI

Now create a new project in the Google Developers Portal in order for you to use Google as an external authentication provider in your website, you will need to create a project in the Google Developers Console. Head on over to the Google Developers Console. Make sure you must have to login with Google account. Firstly, click on to “Create project” button.
Create
 
In the “New Project” dialog, give a name to your project and ID.

ID would be default auto created after giving name of project. Click on to “Create” button to create your project.
 
new

Now you can see project name in the below snapshot…

Next, we need to click on Google +API.
 

api

Click on to "Enable" button, by clicking on to enable button API will be enabled.

enable

You must have to enter your credentials, by which we can’t use API in our project.

So click on to Create Credentials and under it choose OAuth client ID.

create

For OAuth consent screen, click on to it.

consent

In the OAuth consent screen panel, enter your email_id and product name which have been registered yet, click on to save button to save this.

panel

Now click on create credentials and you have shown oAuth client id option, And then click on client id.

id

Click on radio button i.e. “web application” and click on to create button.


create

Now enter your URL in authorized redirect Urls

You mention your correct URL as on project in Visual Studio, go to properties of your existing project and copy URL from there.

Then click on create on click button.

create

After click on create button the client ID and client secret will be generated. Now copy both client id and client secret form here.

create

Now go to project.

In Solution Explorer, APP_START folder would be there. In APP_START folder you have STARTUP.AUTH.CS class, just click on to that class.

class

After clicking on that class, scroll down the page and you just show app.usegoogleAuthentication(), where I need to enter my client ID and client secret. 

Below this you have a client id and client secret

Paste that client id and client secret

id

Just like this….

code

Now run your application. Press F5 to run it.

In the below screenshot, click on to Login button on the top-right of the page.

page

I’m going to Login with my Google account for authenticate. Click on Google to Login. After clicking on button, you will be redirected to Google website.

website
If you are not logged into Google yet, you will be prompted to do so.

log in

Now Google will then prompt you to give the application permissions to access your personal data.

prompt
That's all about how we can configure Google Authentication in MVC Framework.

I hope you enjoyed this article. Stay tuned with me for more articles on all other Microsoft technologies.

Thanks.

Connect (“Nitin Pandit”);

Read more articles on ASP.NET:


Similar Articles