Social Login in Oracle APEX using Google

In the digital era, user authentication plays a vital role in web applications. A smooth and convenient authentication experience not only boosts user satisfaction but also simplifies the onboarding process. One effective method is integrating social sign-in options, enabling users to authenticate using their social media accounts.

In this blog post, we will explore the process of implementing a Social Sign-In feature in an Oracle APEX Application, specifically focusing on authenticating users using their Google accounts. By integrating Google's authentication services into your APEX applications, you can offer your users a hassle-free login experience while leveraging the power of their Google credentials.

Step 1: Register app and get Client Id and Client Secret from Google Cloud. 

To implement social sign-in with Google in your Oracle APEX application, you need to register your app and obtain the Client ID and Client Secret from the Google Cloud Platform. 

Here are the steps to follow:

Go to the Google Cloud Platform Console (https://console.cloud.google.com/).

If you don't have a project yet, create a new one by clicking on the project dropdown at the top of the page and selecting "New Project." Otherwise, select the desired project from the dropdown.

Next, you need to configure the consent screen. The consent screen is where you provide information about your application and obtain user consent.

Navigate to the "APIs & Services" section and click on "OAuth consent screen." Select "External" and click "Create".

Fill in the required information, including your application name, application logo, support email, and developer contact email. Click "SAVE AND CONTINUE"

On Scope configuration page, we are not going to set any scope so click "SAVE AND CONTINUE".

On Test Users configuration screen, click "SAVE AND CONTINUE"

In the last step, review the summary of the OAuth consent screen.

Next, click on the "Credentials" tab in the left sidebar.

Click the "Create Credentials" button and select "OAuth client ID" from the dropdown menu.

In the "Application type" section, choose "Web application" and provide Application Name.

To specify the Authorized Redirect URI, you must provide the callback URL of your Oracle APEX application. This callback URL is crucial for the authentication process and ensures that users are redirected back to your application after successfully authenticating with their Google accounts.

The format of the callback URL is https://<server>/ords/apex_authentication.callback

After specifying all the values, click on "Create" button. 

Take note of the generated Client ID and Client Secret as you will need them to configure the social sign-in feature in your Oracle APEX application.


Step 2: Setup Web Credentials in Oracle APEX

Go to App Builder -> Workspace Utilities -> All Workspace Utilities


Select Web Credentials


Click on Create button.


Provide a name for the Web Credential. For Authentication Type, select  "OAuth2 Client Credentials Flow". Enter Client Id and Client Secret that we generated in the first step on Google Cloud and click "Create" button. 


Step 3: Create Authentication Scheme in Oracle APEX

Go to Shared Components of your application and select Authentication Schemes and click on "Create" button.


Select "Based on a pre-configured scheme from the gallery” and press NEXT


On the Create Authentication Scheme page, provide the value of require attributes and press "Create"

Name: GOOGLE SSO
Scheme Type: Social Sign-In
Credential Store: GOOGLE SSO ( Name of web credential we have created in previous step)
Authentication Provider: Google
Scope: profile,email ( For more detail, click here)
Username: email


Edit the above created authentication scheme and add the Post Logout URL. I wanted user to redirect on the login page of our application, so that I added the login page URL as Post-Logout URL.

https://g797c891abe3879-db1.adb.us-phoenix-1.oraclecloudapps.com/ords/r/apidemo123/apex-sso/login


Select "Enabled" for Switch in Session. 





Make sure that  "Oracle APEX Accounts" is your Current Authentication scheme.




Step 4: Modify Login Page

To provide users with multiple authentication options in your application, including the ability to log in using a regular username and password or a Google account, you can add a "Sign In with Google" button on the login page.

Go to Login Page (Page id 9999) in your application and add "GOOGLE_SSO" button with following properties:

Button Name: GOOGLE_SSO
Label: Sign In with Google
Button Template: Text with Icon
Icon: fa-google
Action: Redirect to Page in this Application
Page: 1
Request: APEX_AUTHENTICATION=GOOGLE SSO

Here, "GOOGLE SSO" is the name of the authentication scheme that we created in the previous step. Setting this request allow us to select Authentication scheme at runtime.


.

To log in to this application, you can use the "Sign In" button by providing your username and password. However, if you prefer to sign in using your Google account, simply click on the "Sign In with Google" button. This will redirect you to the Google Sign-in page, where you can authenticate using your Google credentials.

Comments

Popular posts from this blog

Sorting Order in Oracle APEX Classic Report

Multi-select List Item in Oracle APEX | Checkbox Group

OTP based Authentication in Oracle APEX using Twilio