Search code examples
azureazure-ad-b2c-custom-policyazure-ad-b2c

Azure B2C custom layout redirect to domain hint but not taking login_hint

This is my current scenario:

I'm currently using Azure B2C with user flows. I create a custom layout for my login with some scripts that hide the IDP buttons and take the domain email to redirect to the proper IDP(like a user journey).

The problem:

I can redirect to the IDP by adding the domain_hint param in the URL but I can't add the email to that specific IDP so the user has to put his email again. I've been trying to add the login_hint param to see if it works but the domain_hint cause the redirection so the login_hint param disappears. This is really blocking me because we want to improve the user experience.

Also, I tried to perform the redirection in the script(by fetching it), extract the response URL, and then add the login_hint. This seems to work fine but I got a CORs policy issue that is not allowing me to perform the request as I expected

Question:

  1. Is there any way to perform the redirection with the domain_hint and also add the email using user flows? Is it only possible with Custom policies(IEF)?

  2. Is there any workaround for this CORs policy issue?

Thanks!!

Solution

  • • Yes, it is quite possible for your application to redirect to the identity provider of your choice as specified in the ‘domain_hint’ parameter. This query parameter provides a hint to Azure AD B2C about the social identity provider that should be used for sign-in. Also, along with the ‘domain_hint’ parameter, if you want that during the user journey, the sign-in name should populate automatically and the user should provide only password, then you can use the ‘login_hint’ query parameter as shown below: -

    Example: -

    let loginRequest = {
loginHint: "[email protected]"
extraQueryParameters: {domain_hint: 'facebook.com'}
}

myMSALObj.loginPopup(loginRequest);

    • You need to know the domain name of your external identity provider and you need to pass these both the above query parameters in your application’s ‘MSAL loginPopup() method’.

    For a detailed understanding and configuration of the above, kindly refer to the documentation link below: -

    https://learn.microsoft.com/en-us/azure/active-directory-b2c/enable-authentication-spa-app-options#prepopulate-the-sign-in-name

    Also, regarding the CORS policy issues, I would suggest you to please refer to the workarounds and troubleshooting steps specified in the documentation link below: -

    https://learn.microsoft.com/en-us/azure/active-directory/app-proxy/application-proxy-understand-cors-issues#understand-and-identify-cors-issues