Tutorial for configuring Onfido with Azure Active Directory B2C
In this sample tutorial, we provide guidance on how to integrate Azure AD B2C with Onfido. Onfido is a document ID and facial biometrics verification app. It allows companies to meet Know Your Customer and identity requirements in real time. Onfido uses sophisticated AI-based identity verification, which first verifies a photo ID, then matches it against their facial biometrics. This solution ties a digital identity to their real-world person and provides a safe onboarding experience while reducing fraud.
In this sample, we connect Onfido's service in the sign-up or login flow to do identity verification. Informed decisions about which product and service the user can access is made based on Onfido's results.
Prerequisites
To get started, you'll need:
An Azure AD subscription. If you don't have a subscription, you can get a free account.
An Azure AD B2C tenant that is linked to your Azure subscription.
An Onfido trial account.
Scenario description
The Onfido integration includes the following components:
Azure AD B2C tenant – The authorization server, responsible for verifying the user's credentials based on custom policies defined in the tenant. It's also known as the identity provider. It hosts the Onfido client app, which collects the user documents and transmits it to the Onfido API service.
Onfido client – A configurable JavaScript client document collection utility deployed within other webpages. Collects the documents and does preliminary checks like document size and quality.
Intermediate REST API – Provides endpoints for the Azure AD B2C tenant to communicate with the Onfido API service, handling data processing and adhering to the security requirements of both.
Onfido API service – The backend service provided by Onfido, which saves and verifies the documents provided by the user.
The following architecture diagram shows the implementation.

| Step | Description |
|---|---|
| 1. | User arrives at a login page. User signs-up to create a new account and enters information into the page. Azure AD B2C collects the user attributes. Onfido client app hosted in Azure AD B2C does preliminary checks for the user information. |
| 2. | Azure AD B2C calls the middle layer API and passes on the user attributes. |
| 3. | Middle layer API collects user attributes and transforms it into a format that Onfido API could consume. Then, sends it to Onfido. |
| 4. | Onfido consumes the information and processes it to validate user identification. Then, it returns the result to the middle layer API. |
| 5. | Middle layer API processes the information and sends back relevant information in the correct JSON format to Azure AD B2C. |
| 6. | Azure AD B2C receives information back from middle layer API. If it shows a Failure response, an error message is displayed to user. If it shows a Success response, the user is authenticated and written into the directory. |
Onboard with Onfido
To create an Onfido account, contact Onfido.
Once an account is created, create an API key. Live keys are billable, however, you can use the sandbox keys for testing the solution. The sandbox keys produce the same result structure as live keys, however, the results are always predetermined. Documents aren't processed or saved.
Note
You will need the key later.
For more information about Onfido, see Onfido API documentation and Onfido Developer Hub.
Configure Azure AD B2C with Onfido
Part 1 - Deploy the API
- Deploy the provided API code to an Azure service. The code can be published from Visual Studio, following these instructions.
- Set-up CORS, add Allowed Origin as https://{your_tenant_name}.b2clogin.com
Note
You'll need the URL of the deployed service to configure Azure AD with the required settings.
Adding sensitive configuration settings
Application settings can be configured in the App service in Azure. The App service allows for settings to be securely configured without checking them into a repository. The REST API needs the following settings:
| Application setting name | Source | Notes |
|---|---|---|
| OnfidoSettings:AuthToken | Onfido Account |
Part 2 - Deploy the UI
Configure your storage location
Store the UI files from the UI folder to your blob container.
Allow CORS access to storage container you created by following these instructions:
a. Go to Settings >Allowed Origin, enter
https://{your_tenant_name}.b2clogin.com. Replace your-tenant-name with the name of your Azure AD B2C tenant. For example, https://fabrikam.b2clogin.com. Use all lowercase letters when entering your tenant name.b. For Allowed Methods, select
GETandPUT.c. Select Save.
Update UI files
In the UI files, go to the folder ocean_blue
Open each html file.
Find and replace
{your-ui-blob-container-url}with the URL of where your UI ocean_blue, dist, and assets folders are locatedFind and replace
{your-intermediate-api-url}with the URL of the intermediate API app service.
Upload your files
Store the UI files from the UI folder to your blob container.
Use Azure Storage Explorer to manage your files and access permissions.
Part 3 - Configure Azure AD B2C
Replace the configuration values
In the provided custom policies, find the following placeholders and replace with the corresponding values from your instance.
| Placeholder | Replace with value | Example |
|---|---|---|
| {your_tenant_name} | Your tenant short name | "yourtenant" from yourtenant.onmicrosoft.com |
| {your_tenantID} | TenantID of your Azure AD B2C tenant | 01234567-89ab-cdef-0123-456789abcdef |
| {your_tenant_IdentityExperienceFramework_appid} | App ID of the IdentityExperienceFramework app configured in your Azure AD B2C tenant | 01234567-89ab-cdef-0123-456789abcdef |
| {your_tenant_ ProxyIdentityExperienceFramework _appid} | App ID of the ProxyIdentityExperienceFramework app configured in your Azure AD B2C tenant | 01234567-89ab-cdef-0123-456789abcdef |
| {your_tenant_extensions_appid} | App ID of your tenant's storage application | 01234567-89ab-cdef-0123-456789abcdef |
| {your_tenant_extensions_app_objectid} | Object ID of your tenant's storage application | 01234567-89ab-cdef-0123-456789abcdef |
| {your_app_insights_instrumentation_key} | Instrumentation key of your app insights instance* | 01234567-89ab-cdef-0123-456789abcdef |
| {your_ui_file_base_url} | URL of the location where your UI ocean_blue, dist, and assets folders are located | https://yourstorage.blob.core.windows.net/UI/| |
| {your_app_service_URL} | URL of the app service you've set up | https://yourapp.azurewebsites.net |
*App insights can be in a different tenant. This step is optional. Remove the corresponding TechnicalProfiles and OrchestrationSteps if not needed.
Part 4 - Configure the Azure AD B2C policy
Refer to this document for instructions on how to set up your Azure AD B2C tenant and configure policies.
Note
As a best practice, we recommend that customers add consent notification in the attribute collection page. Notify users that information will be send to third-party services for Identity verification.
Test the user flow
Open the Azure AD B2C tenant and under Policies select Identity Experience Framework.
Select your previously created SignUpSignIn.
Select Run user flow and select the settings:
a. Application: select the registered app (sample is JWT)
b. Reply URL: select the redirect URL
c. Select Run user flow.
Go through sign-up flow and create an account
Onfido service will be called during the flow, after user attribute is created. If the flow is incomplete, check that user isn't saved in the directory.
Next steps
For additional information, review the following articles:
Povratne informacije
Pošalјite i prikažite povratne informacije za