Facebook as OAuth2 Provider

In the following example configuration we will implement Facebook as OAuth provider.
Requirements: You will require Facebook credentials and a Facebook developer account for configuration.

1: Register New App in Facebook

• To register a new app, open the Facebook developers console (opens new window).
• Go to Settings > Basic > Products.
• Add Facebook Login, and make sure to apply the following settings under Facebook Login > Settings:

Field	Value
Client OAuth Login	yes
Web OAuth Login	yes
Enforce HTTPS	yes
Force Web OAuth Reauthentication	no
Embedded Browser OAuth Login	yes
Use Strict Mode for Redirect URIs	yes

Please note: The facebook URI requires HTTPS (security information).

• In field Valid OAuth Redirect URIs, fill in your callback URIs (scheme: {your base URL}/oauth/login/{providerName}), for example: https://example.4allportal.net/oauth/login/facebook.
  Please note: The provider name is created in the next step and can be replaced here later.

2: 4ALLPORTAL Basic Configuration

In the 4ALLPORTAL, navigate to admin snap-in Authentication/OAuth configurations. Click Create in the toolbar.
The following basic settings are required for a Facebook provider:

• Give your provider a name (e.g. facebook). This name later replaces {providerName} in Facebook section Valid OAuth Redirect URIs.
  • Naming rules: Please do not use special characters (allowed are: a - z, A - Z, numbers and underscore _)
• In field Base URL, enter your domain name (without / at the end).
• Enable field visible.
• Select a default role and a default language for the users logging in with this provider.
• In section Mapping of user fields you can add the following configuration:

CoreEngine Field	External Field	Overwrite
ext_id	id	false
email	email	true
username	name	true
firstname	first_name	true
lastname	last_name	true

3: 4ALLPORTAL OAuth2 Specific Configuration

The following OAuth2 specific settings are required for a Facebook provider:

• In field Client ID, enter your App ID. You got it after you have created the app in Facebook (you can see it in the Facebook console).
• In field Client secret, enter your App secret. You got is after you have created the app in Facebook (you can see it in the Facebook console).
• In field Access token URI, enter https://graph.facebook.com/v6.0/oauth/access_token (please always check the correct version).
• In field User authorization URI, enter https://www.facebook.com/v6.0/dialog/oauth (please always check the correct version).
• In field User info URI, enter https://graph.facebook.com/v6.0/me?fields=id,first_name,middle_name,last_name,name,email.
• In section Scopes, add email and public_profile.

We have added some scopes to the User info URI, for Facebook these are the "Scopes". You can as well add other scopes, compare the Facebook docs (opens new window) for details.

Example configuration in the GUI

4: Complete Configuration

• Save your 4ALLPORTAL configuration and restart the system.
• In the Facebook-side configuration, replace {providerName} with your stored provider name in section Valid OAuth Redirect URIs.
• In the Facebook console, make sure your App is set to "Live":