Search Results :

×

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:

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

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/

    OAuth/OpenID/OIDC Single Sign On (SSO) Facebook SSO developer console
  • Go to My apps.

    OAuth/OpenID/OIDC Single Sign On (SSO) Facebook SSO add new app
  • Click on Create App. to create a new app.

    OAuth/OpenID/OIDC Single Sign On (SSO) Facebook SSO add 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.

    OAuth/OpenID/OIDC Single Sign On (SSO) Facebook SSO add new app
  • Complete the security check and click on Submit button.

    OAuth/OpenID/OIDC Single Sign On (SSO) Facebook SSO add new app
  • Select Facebook Login by clicking on the set up button.

    OAuth/OpenID/OIDC Single Sign On (SSO) Facebook SSO login setup
  • Select Facebook Login -> Settings under Products option in the navigation bar.

    OAuth/OpenID/OIDC Single Sign On (SSO) Facebook SSO login setting
  • To get the Redirect URL:

    • Go to your Shopify store, click on the Apps tab and select the Single Sign On - SSO Login application.
    • shopify app section - single sign on application
    • Click on the Setup IDP button in the top left in the navigation bar.
    • Single Sign-On (SSO)for Shopify (Plus and Non Plus), Configure IDP for enabling Single Sign-On (SSO)
    • From the left navigation bar select Identity Provider.

      Shopify SSO using Facebook - add Identity Provider
    • Copy the Callback URL as Redirect URL required for next step.

      Shopify sso using facebook - choose OAuth
  • 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.

    OAuth/OpenID/OIDC Single Sign On (SSO) Facebook SSO client oauth setting

  • 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.

    OAuth/OpenID/OIDC Single Sign On (SSO) Facebook SSO client oauth basic setting
  • 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.
  • shopify app section - single sign on application
  • Click on the Setup IDP button in the top left in the navigation bar.
  • Single Sign-On (SSO)for Shopify (Plus and Non Plus), Configure IDP for enabling Single Sign-On (SSO)
  • 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.
  • Shopify - miniorange sso application - choose OAuth 2.0
  • 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.
  • select project google oauth provider
  • 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.

Troubleshooting

invalid_request

This may be because your primary domain would be different from your Shopify domain. To check your primary domain and make SSO work, follow the steps given here.

shopify_plan_expired

This issue arises when either the trial period of your Development plan is expired. Or if your plan is not auto-renewed from the Shopify end. Contact us at shopifysupport@xecurify.com to resolve the plan upgrade issue and get smooth functioning of the SSO – Single Sign On Application.

invalid_attributes_received

As email is a required entity in Shopify for account creation as well as login operation, Single Sign On is not successful in this case. To resolve this error, please follow given here.

encountered_an_error

When I am performing SSO, I am getting ‘Please verify if Shopify App is installed’ error. To resolve this error, please follow given here.

If your error or query is not listed here, click here to see others.


Frequently Asked Questions (FAQs)


I have followed the steps to set IdP but where can I check SSO?

Follow the steps outlined here. to configure SSO in Shopify with your preferred IDP.

I installed the Shopify SSO application. I clicked on the “SETUP IDP” option but nothing opened up.

Redirection to any other site might be blocked in the browser. Please follow the steps given here to resolve the issue.

When I try to perform SSO, I get redirected to the “Incorrect App Configuration” page and then after subsequent attempts, I get redirected to https://store.xecurify.com/moas/login page.

You might be trying to perform SSO in the different tab of the same browser where you have opened our Single Sign-On – SSO Application or accessed the configuration portal of our application. In this case, SSO will be restricted due to security reasons.
Try to perform Single Sign On in a new incognito/private window or in a different browser in order to make SSO work.

After performing SSO, I want my customers to redirect to the collections or discount offer page.

Follow the steps outlined here. to redirect your customer to collections/cart or any other page.

Choose your preferred Identity Provider and start setting up SSO for Shopify right away



If you are looking for anything which you cannot find, please drop us an email on shopifysupport@xecurify.com.

Hello there!

Need Help? We are right here!

support
Contact miniOrange Support
success

Thanks for your inquiry.

If you dont hear from us within 24 hours, please feel free to send a follow up email to info@xecurify.com