How does social login work
Social login allows you to sign up or authenticate users with just one click by using their existing accounts. Before implementing it with Arengu, it's recommended to learn about its main features and how it works:
- You can add social login buttons to any form step.
- When using social login, all other fields in the same step will be ignored.
- You can dynamically control the redirect URL after submitting a form.
- Linked flows will be executed and receive the data obtained from the social provider.
- Users will be prompted with a permission dialog that may be displayed as a new tab on the browser or as a pop-up on the same browser tab.
- All data obtained from social providers will follow the OpenID standard claims.
How to implement social login
Adding social login to your forms is a simple task with Arengu - just drag and drop wherever you want it:
To set up the social login field it is mandatory to add the Client ID, the Client Secret and select the permissions (scope) the users have to grant. If no scope is specified, it will default to the email scope.
Standard OpenID claims
Most of social providers have slight differences when returning claims like first name, last name, etc. In order to unify this, Arengu will return an object containing OpenID standard claims:
All retrieved data will be included inside your field ID and profile properties, for the following examples, it is assumed that the field ID is named social:
Example of received data using Google as a social provider:
Example of received data using Facebook as a social provider:
Example of received data in a flow:
Setting up social providers
Login with Facebook
Go to the facebook developer console and create or select your app. Under Settings -> Basic you will find your App ID to use in your social login field.
On App Domains, include all the domains where you will use your social login:
And lastly, remember to add Facebook Login for Business under the Products section and make sure Web OAuth Login is enabled:
Login with Google
Go to the Google Cloud APIs credential console and select or create an OAuth client ID:
Login with Microsoft
Go to the Microsoft Azure portal to register an application, select Supported account types: "Accounts in any organizational directory (Any Azure AD directory - Multitenant) and personal Microsoft accounts (e.g. Skype, Xbox)" and add the url https://oauth.arengu.com/forms/callback under Redirect URI:
Once it has been created, you will find the Application (client) ID.
Select the Certificates & secrets to add a client secret
You will need the Application (client) ID and the Secret Value to use in your social login field.
Login with Github
Go to the Github Developer settings page and add an OAuth app, name the app, add a Homepage URL, and add the url https://oauth.arengu.com/forms/callback under Authorization callback URL:
Once the application has been created you will find the Client ID, then Generate a client secret to use in your social login field.
Login with LinkedIn
Go to the LinkedIn Developer Dashboard and Create an app. Select your company LinkedIn page and URL. Once it has been created, you will find the Client ID and Client secret under the Auth tab to use in your social login field.
Add the url https://oauth.arengu.com/forms/callback under the Authorized redirect URLs for your app and update.