Contents

OAuth Single Sign-On (SSO) for Shopify using Facebook as IDP | Shopify Login with Facebook

Shopify integration with Facebook allow your customers to login to the store using facebook as an identity provider. Here the Facebook works as an OAuth provider for Shopify SSO application using miniorange as an Identity Broker. In this guide we will see how to implement Facebook Single Sign-On (SSO) solution on your Shopify store in the easiest way.

Facebook Single Sign On (SSO) for Your Application miniOrange provides a ready to use solution for your application. This solution ensures that you are ready to roll out secure access to your application using facebook within minutes.

Pre-requisite : Single Sign On - SSO Application

To configure SSO into Shopify using Facebook as IDP, you will need to install the miniOrange Single Sign On - SSO Application on your Shopify store:

Shopify Single Sign-On (SSO)

By miniOrange

miniOrange Provides Secure Single Sign-On (SSO) access to your Shopify Stores(both plus and Non plus Stores).

Get this application

Step by Step guide for Single Sign-On in Shopify Store Using Facebook

1. Configure miniOrange as Service Provider (SP) in Facebook

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 what your app is going to work for.

OAuth/OpenID/OIDC Single Sign On (SSO) Facebook SSO add new app

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.
To get the Redirect URL:
- Now go to your Shopify store and click on Setup IDP button in the top left in navigation bar.
- From the left navigation bar select Identity Provider.
- Copy the Callback URL as Redirect URL required for next step.
Under Client OAuth Settings, enter the Callback/Redirect URL 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). Keep them handy as these will be used in furthur steps.
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.
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.

OAuth/OpenID/OIDC Single Sign On (SSO) Facebook SSO change status

You have successfully completed your Facebook App side configurations.

2. Configure Facebook as OAuth 2.0 Provider in Shopify.

Again, go to your Shopify store, click on the Apps tab and select the Single Sign On - SSO Login application.

Single Sign-On (SSO)for Shopify (Plus and Non Plus), Configure IDP for enabling Single Sign-On (SSO)

Click on the Setup IDP button in the top left in the navigation bar.

Shopify - miniorange sso application - add identity provider

From the left navigation bar select Configure SSO and click on Add Identity provider button.

Shopify - miniorange sso application - choose OAuth 2.0

Go to OAuth 2.0 tab and select the IDP name as a Facebook from the dropdown.

Enter the following values.

App Name	Facebook
App Display Name	Choose appropriate Name
Client ID	From Step 1
Client secret ID	From Step 1
Scope	public_profile email

You have successfully completed Shopify side configuration.

3. User Attribute Mapping

You can map attributes coming from your Identity Provider into your Shopify store customer profile.

Navigate to Single Sign On - SSO Application from Admin Dashboard.
Scroll down to Attribute Mapping Section.

Shopify Single Sign-On (SSO) - Restrict Shopify Store to logged in users

Enter the Fristname and Lastname attributes values by reffering the below table.

Firstname	firstName
Lastname	lastName

Save your configurations.

4. Testing SSO for your Shopify Store

Go to your Shopify Store login page.(https://<your-shopify-storedomain>/account/login)
Click on the login button you customized earlier.

You’ll be redirected to the login page of the IDP you configured in previous step. Log in with your IDP account credentials.
You’ll be successfully logged in to your Shopify store.

Hence your configuration of Facebook as IDP in Shopify is successfully completed.