Getting OAuth credentials (Client ID and Secret) for Google Login

February 11, 2020

Google login is a common simple approach when it comes to implementing a login functionality. To implement login with google, we generally use OAuth for which we require Client Id and a Client Secret.

In this article, we will create an application on google developer console and get the Client Id and Secret that we can use for implementing Login with OAuth.

Creating a New Project

Start by navigating to Google Developer Console and create a new Application. Click the dropdown and click on New Project.

Creating a New Project in Google Developer Console

Name of Google Developer console application for oauth

Enter the name for the app being created

App Created

With this, the app is created in the developer console. Now we will switch to the created app using the dropdown option and selecting the app we just created.

OAuth Consent Screen

The application is now created. We now need to manage the consent screen.

Consent Screen

The consent screen is the screen that shows up the application name when you are trying to login with google. The screen shows the application name and then asks for the permissions that the app requires like Reading basic profile info or Managing google drive files.

Currently, the application looks similar to the image below.

google developer console app dashboard, credentials as selected option

Google Developer Console Credentials Dashboard

Now click the Configure Consent Screen and follow the wizard to configure the consent screen. The wizard will look similar to the images below.

Selecting the user type — External/Internal

Enter the app name in the Application name input

Now click the Save button and this will configure the consent screen.

Consent Screen Dashboard

Creating the OAuth Client ID

In the Credentials menu, Now click on Create Credentials and select OAuth Client ID.

OAuth client ID

With this selection, the following screen will appear.

Create OAuth client ID

Choose Web Application as the option as we are creating it to log in with a Web application
Enter the JavaScript origin. A JavaScript origin is a base URL from which the user will be sent to the consent screen. You can also enter a development URL.
Enter the value for Authorized redirect URIs. This will be the URL where google will redirect with a code appended in URL after authorization.

Now click on the Create button and you will land up getting your Client Id and Secret for your web application.

Client Id and Secret created

Now that you have the Client Id and Client Secret, you can use it to implement Google Login in your Web Application.