OAuth modules and social login

October 8, 2024

Introduction

OAuth modules in one sentence

OAuth is an open standard for authorization, commonly used as a way for Internet users to login on websites by reusing their Facebook, Linkedin or Google account. The Jahia team built several modules that you can easily use to bring social login to your website. 

What can you do with these modules? 

  • Allow your visitors to login to your website via Linkedin or Facebook and delete friction for your customers when login
  • Collect data from social networks through login and reuse them for analytics or personalization (with jExperience)
  • Easily add the buttons "login with Facebook" and "login with Linkedin" by dragging and dropping them on your pages

No code is required to use these modules and the login buttons can be added to any webpage with a simple drag and drop. 

The modules 

  • Jahia Oauth : backbone of Jahia Oauth solutions
  • JCR OAuth Provider : actually provides the authentication to Jahia and give the ability to map each visitor attribute coming from the connectors to a Jahia User attribute
  • Facebook Oauth connector : Includes a droppable button "Login with Facebook" and a UI to configure the connection to your Facebook app
  • Linkedin Oauth connector : Includes a droppable button "Login with Linkedin" and a UI to configure the connection to your Linkedin app
  • Google Oauth connector : Includes a droppable button "Login with Google" and a UI to configure the connection to your Google app
  • jExperience Oauth data mapper : Provides the ability  to map each visitor attribute from the connectors to jExperience visitors profiles. Relying on jCustomer Customer Data Platform, this module is more adapted to heavy data collection (and allow analytics and personalization based on this data through jExperience)

oauth-schema-3.png

Which module do I need ?

Here are 2 use cases :

I'm using Jahia and I want to add a Facebook login button

Download the following modules from Jahia store, deploy them to your Jahia website and configure them accordingly using section 5: Jahia Oauth, JCR Oauth provider and Facebook connector

I'm using Jahia and jExperience, I want to add a Linkedin login button and do personalization based on the visitor industry

Download the following modules from Jahia store, deploy them to your Jahia website and configure accordingly using section 5:  Jahia Oauth, JCR Oauth provider, Linkedin connector and jExperience Oauth data mapper

Prerequisites

  • Every Jahia Oauth modules require DX 7.2.x 
  • jExperience Oauth data mapper requires Marketing Factory 1.6.2 or above
  • For each connector (Facebook, LinkedIn or both) that you'll use, you need the corresponding working application 

Applications

For more information on how to create your application, please refer to : 

Facebook

Configuration : https://developers.facebook.com/apps/

Documentation : https://developers.facebook.com/docs/facebook-login

Linkedin

Configuration : https://www.linkedin.com/developer/apps

Documentation : https://developer.linkedin.com/docs/signin-with-linkedin

Google

Configuration : https://console.developers.google.com/apis/credentials/oauthclient

Documentation : https://support.google.com/googleapi/answer/6158849

Configuration 

Once you selected, installed and deployed the oauth modules you need on your Jahia website, you can find the configuration in the site settings.

The first screen will list the Oauth connectors that you added to your website. 

connectors.png

Connectors 

When selecting a connector, you'll find a screen similar to the one below. Depending on the connector (Facebook or Linkedin), the options can be slightly different since they are related to the provider. 

linkedin-connector.png

  • ID Client : The ID of your application
  • Secret client : The "secret" of your application
  • Scope  : The scope defines which data you'll ask to your visitors. It needs to be the same on your application and in this screen.
Each connector supports a given scope, the supported scope is written below the textbox. If you type in a larger scope, the additional data won't be collected. Please contact Jahia solutions if you have specific needs and want to collect more data than what is currently supported. 
  • Callback url : The url where the user will be redirected when the login is a success. It must end in a specific way such as .linkedInOAuthCallbackAction.do . For instance : http://virtuallvr.com/en/sites/virtuall/home.linkedInOAuthCallbackAction.do . There can be several callback urls.
When you're done typing in a callback url, click on the "+" button
oauth-callback-url.png
 
Do not forget to remove the extension of the page before adding the suffix. For instance, http://virtuallvr.com/sites/virtuall/home.html.linkedInOAuthCallbackAction.do WON'T work

When you're done with the configuration, hit the save button. 

A new "ACTIONS" button will appear as per below : 

oauth-connector-filled-1.png

Actions

For each connector, you'll need to configure one or more "Actions".  The "JCR Oauth provider" will always be here, the "jExperience Oauth data mapper" will only appear if you deploy the module on your website (only possible if jExperience is deployed as well).

JCR OAuth provider

The JCR OAuth provider will actually manage the login to Jahia and create a Jahia User if no user is matching the one being authenticated. You can map each attribute coming from the connector to Jahia User attributes.  

When using Jahia and jExperience, we recommend to restrict the fields that you'll map in this provider since customer data will find better fit in jCustomer. However, we do recommend you to map the email address, that will be used as a login value (otherwise, a technical id will be generated). 

jcr-data-mapper.png

jExperience Oauth data mapper

The jExperience data mapper allows you to map each attribute coming from your connector to jExperience profile properties. You'll be able to use this data for analytics or personalization. Keep in mind that Marketing factory is based on jCustomer, and allows you to create as many profiles properties as you want, on the fly. 

The public profile URL will actually display the image coming from the connector in the jExperience profile. 

oauth-MF-data-mapper.png

Adding the social login button to your page/template

You'll find the social logins buttons as any Jahia component, under the group "Jahia Oauth button connector".

oauth-buttons.png