By Sai Kiran Reddy Vallapreddy
Prerequisites/Assumptions
I’m going to assume that you are familiar with Azure AD, Service Bus, Salesforce, B2C, Storage accounts, basic HTML.
QA- URL:
City of Sacramento Sign – In Page
We are storing the Users in Azure, authenticating the Users from Azure and doing an SSO with Salesforce and redirecting the users to SF portal.
We are doing a graph API call when a user changes nay information in SF and it will be synced in real-time to Azure B2c users info (like last name, phone number). There are many identity providers that offer user base and federated authentication, we have chosen B2C Azure Active Directory Authentication Service. It consists of the following features:
- Authentication provider as a cloud service, a cost-effective way as no infrastructure setup/maintenance required.
- Active Directory as a user base, which enables us to integrate with many portals built using various technology stack.
- Uses OAuth 2.0 protocol which is believed to be the most secure federated authentication protocol.
- Custom user flows allow us to do customization with different authentication flows, login/ signup / forgot password and edit profile.
- Scalability, as this is a cloud-based service, it offers scalability at just a few clicks away.
- Better control overlooks and feels by offering customization of UI.
Application Implementation
Implementing B2C Azure Active Directory Authentications requires few configurations and customizations.
- Azure subscription with required privilege is required to create an Azure Active Directory application.
- Next step is to set up a custom policy using Trust Framework, these are XML files contains details about claims, user journey steps, validations, and authentication flow.
- We have used kick-starter policies available over GitHub and extended based on our need.
- It offers inbuilt user attributes; we can extend that list and add our custom User attributes.
- We would require hosting a .net core 2.0 API application for a graph service provider. Using this API application we are offering user-info endpoint, as Azure B2C does not provide built-in user info endpoint. Azure Web role service is used as a hosting provider.
- We are using reCaptcha v2 google service for captcha validation at the time of registration. We have hosted reCaptcha v2 service provider Asp.net Web application using Azure web role hosting.
- Once the above configuration is done, we will get OAuth 2.0 well know API endpoint. This endpoint contains URL for Auth endpoint, token endpoint, and callback URL.
- We have configured identity provider in Salesforce portal using OpenID connect, above URLs along with client key, secret and scopes are configured to obtain an access token and do SSO in Salesforce portal using Azure B2C login flow.
UI Customization
Azure B2C offers UI customization by allowing us to use our own HTML/CSS page using a pre-specified set of containers, which bootstraps page.
- We have used bootstrap based blue opal theme as the base theme for UI pages, this offers full responsiveness.
- We are using Jquery to perform a basic set of javascript/client-side validations.
- We have transformed a single sign up page into the two-step registration process, using Jquery hide/show operations.
- reCaptcha libraries are added to provide captcha service while doing the registration.
Testing
There were applications required to be tested, one is Authentication endpoint as individual service and its integration with UI app.
- We used the Postman API simulator/testing tool for testing Authentication service.
- End to end scenarios were tested with UI app for functional verification
- We used chrome browser responsive tester of developer toolbar to test responsiveness.
Useful URLs:
- GitHub: Azure Samples
- Microsoft: Azure Active Directory B2C Content Definitions
- GitHub: Azure AD B2C VS Code Extension
- GitHub: Azure AD B2C Custom Policy Manager
- GitHub: Azure Samples Azure AD B2C Page Templates
- Microsoft: Azure Storage Explorer
- Microsoft: Customize your Azure AD Sign-In Page
- Salesforce: Apex Integration Rest Callouts
- Salesforce: How can i integrate one SFDC org to another SFDC using Rest Api
- Salesforce: How can I Integrate One SFDC Org to Another SFDC Using Rest API
- Microsoft: Enable JavaScript and Page Layout Versions in Azure Active Directory B2C
Wireframe:
Section -1 Includes:
- Create a new resource for production
- certificate tokens
- User fields and scopes
- Create new B2C App under Azure Active Directory
- Create certificate tokens (2 each for different purpose)
- Configure to enable some additional user fields and scopes
- Create a blob account and add html and css for signin, signup and forget password page
- Configure secure access for the blob to add them in policy links
- Create new base, base extension and signin_signup policies
- Get new gmail developer account and configure recaptcha v3 site
- Create new captcha verification .net app and include generated secret key from captcha admin portal
- Modify the signup page code to use new captcha site key and new url
- Configure CORS (alloid urls) for captcha in admin portal.
- Configure CORS in b2c app as ill.
- Create new userinfo endpoint app, that would require to configure graph API account.
- Host the userinfo and captcha app on azure ib and use the urls in policy
- Create new auth provider using oauth connect in sal.esforce.
- Use b2c endpoint details and .illknown url in community app.
- Use graph API url as scope/resource in salesforce oauth connect settings.
- Set up post login handler in salesforce apex class.
- Create Azure analytics workspace and Azure Audit logs, configure them to push logs to newly created analytics workspace for prod.
- For archiving, setup blob resource in diagnostic settings.
Section – 2 Includes:
- CosmosDB
- More service Bus topics and subscriptions.
- Azure analytics workspace and Azure Audit logs
- push logs
- blob resource in diagnostic
- Graph API
- function app and container for functions
- host.settings
- Salesforce apex class