Drupal Headless SSO using the OAuth Protocol

Overview

miniOrange’s OAuth-based headless SSO solution efficiently connects the Drupal backend with an OAuth server using the OAuth protocol for authentication. Once the SSO process is completed, the module generates a JSON Web Token (JWT) for the logged-in user and transmits it to the frontend site. (Optional: This token can be used to validate any further Drupal APIs.) This guide highlights the crux of how headless SSO is implemented at both the backend and the frontend.

Prerequisites

• miniOrange OAuth Client Module : This module enables the SSO between the Drupal site and OAuth/OIDC Provider.
• REST & JSON API Authentication Module : After the SSO is performed, this module helps to generate the JWT and send this token to the frontend application. ( Optional: To authenticate any further Drupal APIs, pass the same JWT in the header along with the API request, and the REST & JSON API Authentication module will validate that JWT.)

Backend configurations

• miniOrange OAuth Client Module: Follow this setup guide to set up the connection between the Drupal site and the desired OAuth/OIDC Provider.
• REST & JSON API Authentication Module:
• To authenticate the Drupal APIs using the JWT, configure the JWT Authentication method in the module. Follow this setup guide.
• Configure the redirect URL of the frontend application:
• Navigate to the Advanced Settings tab of the REST & JSON API Authentication module.

• In the Token Endpoint Configurations for headless SSO details, enter the endpoint of the frontend application, where the browser will redirect after the Single Sign-On (SSO) process with a code parameter. After this, click on the Save Token Endpoint Configuration button.


Uncovering the Frontend Scenes

This section uncovers everything that a user needs to do on the frontend side.

Let’s begin:

• Login Flow:
• Initiate login from the user’s frontend application. (using URL- {drupal-base-url}/moLogin)
• The user is redirected to the configured server.
• Enter the user’s credentials to authenticate.
• After successful authentication, the user is redirected back to the frontend with the code as a query parameter in the URL.
• Use the code obtained in the previous step to make a request to Drupal's token endpoint. For this, follow the below-mentioned steps:-
• Locate the token endpoint in the Token Endpoint Configurations for headless SSO details. Refer to the following image for this.

• Example for making a POST request with the received code:-
• Suppose a user receives a code (received_code) on the frontend.
• Now, use the format below to make a POST request using this code.

                    HTTP:
                    POST https://{drupal_base_url}/getToken
                         code=(received_code)

                

• The token endpoint will validate the code.
• If the code is valid, the token endpoint provides a generated JWT for that particular logged-in user (Note that the code is for one-time use, so it cannot be used again to get a JWT.) Now, use this JWT to authenticate the subsequent APIs.

Note: To see the format of API requests that include the JWT token in the header, refer to this setup guide.

Related Articles

• What is Headless CMS ?
• Benefits of headless system

Why choose us



24/7 Support

Get prompt support from our Drupal technical experts, accessible around the clock for direct assistance

 Contact Us



Case Studies

miniOrange has successfully catered to the use cases of 400+ trusted customers with its highly flexible Drupal solutions.

 Case Studies



Other Solutions

Explore our popular Drupal solutions trusted by customers, including 2FA, User Provisioning, and Website Security.

 Know More