Integration of Facebook Login (Facebook Social Login) with Magento using OAuth 2.0 Protocol. The Magento OAuth / OpenID Connect Single Sign-On (SSO) plugin makes it easy to use OAuth2 to set up Facebook Login on Magento (Facebook Single Sign on).

The plugin can be set up using other Social Media sources, as well as custom OAuth and OIDC providers. It contains a lot of Single Sign-On (SSO) features, like Attribute Mapping for user profiles, Role Mapping, and so on. In this guide, we'll go over how to set up SSO between Magento and Facebook. At the end of this article, users should be able to log into Magento using Facebook. Click here to read more about the Magento OAuth Single Sign-On (OAuth & OpenID Connect Client) plugin's extra features.

The Magento OAuth & OpenID Connect Single Sign-On (SSO) plugin makes it possible to log into Magento securely using Facebook as an OAuth and OpenID Connect provider. You can also use alternative Oauth providers, such as Azure B2C, Office 365, and other custom providers, to configure the plugin. Advanced Single Sign-On features such as user profile Attribute Mapping, Role Mapping, and so on are supported. We'll go over how to set up SSO between Magento and Facebook in this article. Users should be able to log in to Magento through Facebook by the end of this guide.

Click here to know more about other features we provide in Magento OAuth Single Sign-On ( OAuth & OpenID Connect Client ) plugin

OAuth / OpenID Connect Single Sign On – SSO (OAuth Client)

By miniOrange

(1)

Magento OAuth OpenID Connect SSO extension allows login (Single Sign-On) into Magento with your Azure AD, Azure B2C, AWS Cognito, WSO2, Okta, LinkedIn, Google, Facebook, Slack, Discord or other custom OAuth 2.0 providers [24/7 SUPPORT]

 Tested with 2.4.5

Get this plugin

Steps to configure Facebook OAuth & OpenID Single Sign-On (SSO) Login into Magento

1. Setup Facebook as OAuth Provider

Follow the steps below to configure Facebook as OAuth Provider

 Configure Facebook as OAuth Provider

• First of all, Login/ Signup in Facebook developer console at https://developers.facebook.com/

• Go to My apps.

• Click on Create app to create a new app.

• Select your application type.

• Enter the required details and click on Create App.

• Complete the security check and click on Submit button.

• Select Facebook Login by clicking on the set up button .

• Select Facebook Login -> Settings under Products option in the navigation bar .

• Under Client OAuth Settings, enter the Callback/Redirect URL (from your miniOrange Oauth Client plugin) in the Valid OAuth Redirect URIs field. Click on the Save button to save your configurations.
  Most importantly, your Callback/Redirect URI should be https and not http. It is mandatory while configuring Facebook as an OAuth Server.

• Go to Settings -> Basic to view your App Id and App Secret Refer to the image below).

• Enter your Privacy Policy URL in the Privacy Policy URL field and choose a category from the dropdown in the Category field. Then, click on Save Changes button to save your configurations.
• Copy your App ID and your App Secret and save it in your miniOrange OAuth Client Extension. (under client id and client secret field respectively).

• Change you app status from In Development to Live by clicking on OFF as shown in the image below. Then, click on confirm to confirm your change of status.

You have successfully configured Facebook as OAuth Provider for achieving Facebook Single Sign-On (SSO) with Magento for user authentication.

2. Configuring Magento 2 as OAuth Client

• After successfully configuring OAuth Provider, go to OAuth Provider tab and configure OAuth Provider Name, Client ID, Client Secret, Scope and provided endpoints. (You can copy these values in STEP 2 from the application dashboard.)
  
  

  Please refer below Endpoints to configure the OAuth client

  
  

  Scope:	public_profile email
  Authorize Endpoint:	https://www.facebook.com/dialog/oauth
  Access Token Endpoint:	https://graph.facebook.com/v2.8/oauth/access_token
  Get User Info Endpoint:	https://graph.facebook.com/me/?fields=id,name,email,age_range,first_name,gender,last_name,link

• Click on the Save button to save the settings.
• Click on the Test Configuration button.

• You will see all the values returned by your OAuth Provider to Magento in a table. If you don't see value for First Name, Last Name, Email or Username, make the required settings in your OAuth Provider to return this information.
• The miniOrange Premium Plugin also provides you the the feature to auto redirect your user to the IdP Login Page.

• Go to the Sign In Settings tab and check options to enable SSO on your Magento site.

4: Attribute Mapping (Optional). *This is Premium feature.

• You can map attributes in the Attribute Mapping tab. Only username and email are allowed to be mapped in free version of the plugin. However, in the premium version of the plugin, you can map various attributes coming from your OAuth Provider to the attributes present in your Magento site.

5: Role Mapping (Optional). *This is Premium feature.

• You can specify a default role in the free plugin that will be allocated to all non-admin users when they conduct SSO.
• Go to Attribute/Role mapping tab and navigate to Role Mapping section.
• Select the Default Role and click on the Save button.

By configuring Facebook as an OAuth Provider and Magento as an OAuth Client using our Magento OAuth Client plugin, you have successfully installed Magento Facebook Single Sign-On (SSO). Within minutes, you'll be able to provide safe access to your Magento site utilising Facebook login credentials thanks to this solution.

Additional Resources

• What is Single Sign-On (SSO) Login?
• What is OAuth 2.0?
• How OAuth works?
• OAuth with facebook
• Magento OAuth and OpenID Single Sign On (SSO) Plugin.
• Magento SAML Single Sign On (SSO) Plugin.
• Magento OAuth Single Sign On (SSO) using Azure AD.