nopCommerce SAML Single Sign-On (SSO) with AzureB2C as IDP

Overview

nopCommerce SAML Single Sign-On (SSO) plugin gives the ability to enable SAML Single Sign-On for your nopCommerce store. Using Single Sign-On you can use only one password to access your nopCommerce store and services. Our plugin is compatible with all the SAML compliant identity providers. Here we will go through a step-by-step guide to configure Single Sign-On (SSO) between nopCommerce and AzureB2C considering AzureB2C as IdP.

Pre-requisites : Download And Installation

• Download the nopCommerce SAML Single Sign-On (SSO) module.
• To install the plugin, login as admin into your nopCommerce store. In the admin dashboard, navigate to Configuration Tab >> Local plugins.

• Click on the Upload plugin or theme button at the top right corner, then in the popup window, click Choose File, select the downloaded plugin ZIP file, and click Upload plugin or theme to proceed.

• After uploading the plugin, click on Restart Application to apply the changes. Once the application restarts, you will see the plugin listed below. Click on the Install button to install it, and then click Restart Application again to apply the changes.

Configuration Steps

Step by Step guide for nopCommerce SAML SSO using AzureB2C as Identity Provider.

• After successful installation, locate the plugin in the list and click on the Configure button to proceed with the setup.

1. Activate the SAML Plugin using License Key

• On clicking Configure, you will be redirected to the license activation page, and you will receive a trial license key on your registered email.
• If you have not received the license key on your provided email, use the Download License Key button in the plugin to download the license file.

• To activate the plugin, you can either:
  • Enter the license key received via email in the provided input field.

  OR

  • Upload the license file that you downloaded using the button mentioned above.

• Then, check the box "I have read the above conditions and I want to activate the middleware", and click Activate License button.

2. Provide nopCommerce store Metadata to AzureB2C Identity Provider

• After successful license activation, the plugin dashboard will open as shown below.
• In the plugin dashboard, click on the Service Provider Metadata button from the top menu. This will open the Service Provider Metadata page.

You can obtain the SAML SP metadata using either of the two methods described below to configure it on your Identity Provider end.

A] Using SAML metadata URL or metadata file

• On this page, you can find the Metadata URL as well as the option to download the SAML metadata XML file.
• Copy the Metadata URL or download the metadata file to configure the same on your Identity Provider end.
• You may refer to the screenshot below:

B] Uploading Metadata Manually

• On this page, you can manually copy the service provider metadata such as SP Entity ID, ACS URL, Base URL and share it with your Identity Provider for configuration.
• You may refer to the screenshot below:

Register the Identity Experience Framework application

• Log into Azure B2C Portal.
• From the Azure AD B2C tenant, select App registrations, and then select New registration.

• For Name, enter IdentityExperienceFramework.
• Under Supported account types, select Accounts in this organizational directory only.

• Under Redirect URI, select Web, and then enter "https://your-tenant-name.b2clogin.com/your-tenant-name.onmicrosoft.com", where your-tenant-name is your Azure AD B2C tenant domain name.

• Under Permissions, select the Grant admin consent to openid and offline_access permissions check box.
• Click on Register.

• Record the Application (client) ID for use in a later step.

Register the Identity Experience Framework application

• Under Manage, select Expose an API.
• Select Add a scope, then select Save and continue to accept the default application ID URI.

• Enter the following values to create a scope that allows custom policy execution in your Azure AD B2C tenant:
• Scope name: user_impersonation
• Admin consent display name: Access IdentityExperienceFramework
• Admin consent description: Allow the application to access IdentityExperienceFramework on behalf of the signed-in user.

• Select Add scope.

Register the ProxyIdentityExperienceFramework application

• Select App registrations, and then select New registration.
• For Name, enter ProxyIdentityExperienceFramework.
• Under Supported account types, select Accounts in this organizational directory only.

• Under Redirect URI, use the drop-down to select Public client/native (mobile & desktop).
• For Redirect URI, enter myapp://auth.
• Under Permissions, select the Grant admin consent to openid and offline_access permissions check box.
• Select Register.

• Record the Application (client) ID for use in a later step.

Next, specify that the application should be treated as a public client

• Under Manage, select Authentication.
• Under Advanced settings, enable Allow public client flows (select Yes).
• Select Save.

Now, grant permissions to the API scope you exposed earlier in the IdentityExperienceFramework registration

• Under Manage, select API permissions.
• Under Configured permissions, select Add a permission.

• Select the My APIs tab, then select the IdentityExperienceFramework application.

• Under Permission, select the user_impersonation scope that you defined earlier.
• Select Add permissions. As directed, wait a few minutes before proceeding to the next step.

• Select Grant admin consent for (your tenant name).

• Select your currently signed-in administrator account, or sign in with an account in your Azure AD B2C tenant that's been assigned at least the Cloud application administrator role.
• Select Yes.
• Select Refresh, and then verify that "Granted for ..." appears under Status for the scopes - offline_access, openid and user_impersonation. It might take a few minutes for the permissions to propagate.

Register the nopCommerce Application

• Select App registrations, and then select New registration.
• Enter a Name for the application such as: WP-app.
• Under Supported account types, select Accounts in any organizational directory or any identity provider. For authenticating users with Azure AD B2C.

• Under Redirect URI, select Web, and then enter the ACS URL from the Service Provider Settings tab of the nopCommerce plugin, as mentioned in Step 2B above.
• Select Register.

• Under Manage, click on Expose an API.
• Click on Set for the Application ID URI and then click on Save, accepting the default value.

• Once saved, copy the Application ID URI and navigate to the Service Provider Metadata tab of the plugin.
• Paste the copied value under the SP Entity ID / Issuer field provided in this tab.
• Click on Save.

Generate SSO Policies

• From our Azure B2C portal, navigate to the Overview section of your B2C tenant and record your tenant name.
  NOTE: If your B2C domain is b2ctest.onmicrosoft.com, then your tenant name is b2ctest.

• Enter your Azure B2C tenant name below, along with the application ID for IdentityExperienceFramework and ProxyIdentityExperienceFramework apps as registered in the above steps.

Azure B2C tenant Name:
IdentityExperienceFramework app ID:
ProxyIdentityExperienceFramework app ID:
Select additional attributes	User Type Job Title Department Usage Location Street Address State or Province Country or Region City ZIP or Postal Code Office Phone Mobile Phone physicalDeliveryOfficeName Age Group Consent Provided for Minor Legal Age Group Classification createdDateTime netId Select the attributes

• Click on the Generate Azure B2C Policies button to download the SSO policies.
• Extract the downloaded zip file. It contains the policy files and certificate (.pfx), which you will require in the following steps.

Setup and upload Certificates

• Sign in to the Azure portal and browse to your Azure AD B2C tenant.

• Under Policies, select Identity Experience Framework and then Policy keys.

• Select Add, and then select Options > Upload.
• Enter the Name as SamlIdpCert. The prefix B2C_1A_ is automatically added to the name of your key.

• Using the upload file control, upload your certificate that was generated in the above steps along with the SSO policies (tenantname-cert.pfx).
• Enter the certificate's password as your tenant name and click on Create. For example, if your tenant name is xyzb2c.onmicrosoft.com, enter the password as xyzb2c.
• You should be able to see a new policy key with the name B2C_1A_SamlIdpCert.

Create the signing key

• On the overview page of your Azure AD B2C tenant, under Policies, select Identity Experience Framework.
• Select Policy Keys and then select Add.
• For Options, choose Generate.
• In Name, enter TokenSigningKeyContainer.
• For Key type, select RSA.
• For Key usage, select Signature.

• Select Create.

Create the encryption key

• On the overview page of your Azure AD B2C tenant, under Policies, select Identity Experience Framework.
• Select Policy Keys and then select Add.
• For Options, choose Generate.
• In Name, enter TokenEncryptionKeyContainer.
• For Key type, select RSA.
• For Key usage, select Encryption.

• Select Create.

Upload the policies

• Select the Identity Experience Framework menu item in your B2C tenant in the Azure portal.

• Select Upload custom policy.

• As per the following order, upload the policy files downloaded in the above steps:
• TrustFrameworkBase.xml
• TrustFrameworkExtensions.xml
• SignUpOrSignin.xml
• ProfileEdit.xml
• PasswordReset.xml
• SignUpOrSigninSAML.xml

• As you upload the files, Azure adds the prefix B2C_1A_ to each.

You have successfully configured Azure B2C as SAML IdP (Identity Provider) for achieving Azure B2C SSO login into your nopCommerce application.

3. Configure AzureB2C Identity Provider Metadata in nopCommerce store

• Click on the Add new IDP button to configure a new Identity Provider.

• Under the Plugin Settings tab, select AzureB2C as your identity provider from the list shown.

• After selecting your IdP from the list, the Identity Provider Configuration page will open. On this page, click on the Upload IdP Metadata button.

There are two ways detailed below with which you can configure your SAML Identity Provider metadata in the plugin.

A] Upload metadata using the Upload IDP Metadata button:

• Enter the IdP Name, then either provide the metadata URL in the Fetch Metadata section and click Fetch Metadata to retrieve the configuration automatically, or upload the metadata XML file using the Upload Metadata option to configure the IdP.
• You may refer to the screenshot below:

B] Configure the identity provider metadata manually:

• Alternatively, under the Identity Provider Settings tab, you can manually fill in the mandatory fields like IDP Name, IDP Entity ID and Single Sign-On URL and click Save Settings.

4. Testing SAML SSO

• After uploading the metadata details, navigate back to the Dashboard. Click on the three dots (⋮) next to the configured Identity Provider and select Test Configuration.

• On successful configuration, you will get attributes name and attribute values in the test configuration window.

• If you are experiencing any error, you can troubleshoot it using the steps below:
• Click on the Troubleshoot SSO button and enable the required log levels.
• Download the log file using the Download Logs button to identify what went wrong.
• You can share the log file with us at nopcommercesupport@xecurify.com and our team will reach out to you to resolve your issue.

5. Adding SSO link for your nopCommerce store

• Click on the three dots (⋮) next to the configured Identity Provider and select SSO Link.
• A “Copy to Clipboard” pop-up will appear. Click OK to copy the SSO link to your clipboard.

Related Articles

• nopCommerce Oauth SSO
• nopCommerce Two Factor Authentication
• nopCommerce SAML SSO with Azure AD as IDP