Add link in custom mobile OTP login UI to open technical profile

Question

Hi Support

I have created a azure b2c custom policy for Mobile OTP and Email OTP , for both I've defined separate technical profile.

Default is Mobile OTP login as you can see in image.

So how Can I add a link to above Custom UI and open Sign-in Page for Email OTP screen.  On that link how to call a technical profile for Email OTP. 

I've attached custom policy and customize UI . 


```xml
 

        

So Here I've added both technical profile in First User journey, But if Remove "SignIN-WithEmail" TargetClaimExchangeID, It will open Mobile Otp login window defualt, so how to add a link in custom UI to LocalAccountDiscoveryUsingEmailAddress-SignIn this technical profile which will open Email OTP screen

Answer 1

Hi @Alok Aswal ,

Thanks for reaching out.

It seems attachment got missed in the post. I am assuming you have created a custom policy for Mobile OTP and Email OTP and defined separate technical profiles for both. You want to add a link to the custom UI that will open the Sign-in page for Email OTP screen and call the technical profile for Email OTP.

To achieve this, you can add a link to the custom UI that will redirect the user to the Sign-in page for Email OTP screen or you can add option button to select either Phone or mail OTP in the sign in page.

You can follow https://github.com/azure-ad-b2c/samples/tree/master/policies/mfa-email-or-phone to set up similar scenario in your application.

Hope this will help.

Thanks,

Shweta

---

Please remember to "Accept Answer" if answer helped you.

Answer 2

Hi @Shweta Mathur

Let me describe the case again.
We want to provide our customers the ability to sign-in/Sign-up either by using Mobile OTP or Email OTP.

By default, we want to show them the option to login with mobile OTP as shown below.

   PFA LoginMobileOTP.png

Here on this default view, we also want to give user the ability to go to “Email OTP option” as circled above. We are ok with adding a link or button here.

When user will click this link/button it will be moved to “Email OTP” view. something like below.

 PFA EmailOTPLogin.png

PFA Custom Policyxagrouptest.onmicrosoft.com-B2C_1A_SIGNUP_SIGNIN_MOBILE_EMAIL_OTP.xml

xagrouptest.onmicrosoft.com-B2C_1A_TRUSTFRAMEWORKEXTENSIONS_MOBILE_EMAIL_OTP.xml

So how to open Email OTP login screen (which is controlled by technical profile written in above custom policy) from Mobile OTP login screen via some link or radio button.

Regards

Alok

 

Answer 3

PFA Custom Policyxagrouptest.onmicrosoft.com-B2C_1A_SIGNUP_SIGNIN_MOBILE_EMAIL_OTP.xml

xagrouptest.onmicrosoft.com-B2C_1A_TRUSTFRAMEWORKEXTENSIONS_MOBILE_EMAIL_OTP.xml

So how to open Email OTP login screen (which is controlled by technical profile written in above custom policy) from Mobile OTP login screen via some link or radio button.