FOURTH SESSION: Working with Credentials from Google.

MVC 5 App with Google OAuth2 Sign-on (C#)

SCOPE;

This tutorial shows you how to build an ASP.NET MVC 5 web application that enables users to log in using OAuth 2.0  with credentials from an external authentication provider, Like Google.

Steps for Creating Application:

1) Click New Project, then select Visual C# on the left, then Web and then select ASP.NET  Web Application. Name your project and then click OK.

You can also Follow my First Tutorial!

2) In the New ASP.NET Project dialog, click MVC. If the Authentication is not Individual User Accounts, click the Change Authentication button and select Individual User Accounts.

See Snapshot:

3) Now, Right click on the Project --> Click: Manage NuGet packages...

See Snapshot:

4) Now, Select Updates in the left menu. You can click on the Update All button or you can search for only OWIN packages .

See Snapshot

:

5) Set the SSL:

• In Solution Explorer, click the project.
• Hit the F4 key to show the project properties. Alternatively, from the View menu you can select Properties Window.
• Change SSL Enabled to True.

• Copy the SSL URL (which will be https://localhost:44301/ unless you've created other SSL projects).
• In Solution Explorer, right click the project and select Properties.
• Select the Web tab, and then paste the SSL URL into the Project Url box. Save the file (Ctl+S). You will need this URL to configure Google authentication app.

6) Creating a Google app for OAuth 2:

• Navigate to the Google Developers Console.
• Click the Create Project button and enter a project name and ID (you can use the default values). In a few seconds the new project will be created and your browser will display the new projects page.
• In the left tab, click APIs & auth, and then >  Credentials.
• Click the Create New Client ID under OAuth.
• In the Create Client ID dialog, keep the default Web application for the application type.
• Set the Authorized JavaScript origins to the SSL URL you used above (https://localhost:44301/ unless you've created other SSL projects)
• Set the Authorized redirect URI to:
       https://localhost:44301and click the off button on Google+ API.

• Copy and paste the Client ID and Client secret  into the UseGoogleAuthentication method. 

7) Click App_Data --> Startup.Auth.cs --> UseGoogleAuthentication method. 

See Snapshot:

8) Press CTRL+F5 to build and run the application. Click the Log in link.

9) Under Use another service to log in, click Google.

10) You will be redirected to the google site where you will enter your credentials.

11) After you enter your credentials, you will be prompted to give permissions to the web application you just created.

12) Click Accept. You will now be redirected back to the Register page of the Muhammad_Fayyaz(my project name) application where you can register your Google account. You have the option of changing the local email registration name used for your Gmail account, but you generally want to keep the default email alias (that is, the one you used for authentication). Click Register.

WE ARE DONE!

THANK YOU.