Forum Discussion

TiagoC's avatar
TiagoC
Copper Contributor
Jan 23, 2025

angular-b2c-sample-app and iframes

I have a project that I based on this sample project: https://github.com/AzureAD/microsoft-authentication-library-for-js/tree/dev/samples/msal-angular-v3-samples/angular-b2c-sample-app Currently ...
Azure AD B2C
azure custom policies
Kidd_Ip's avatar
Kidd_Ip
MVP
Jan 24, 2025

Take this:

 

  • Enable Custom Policy for JavaScript: Ensure your custom policy is enabled for JavaScript. This is necessary for embedding the B2C UI in an iframe.
  • Configure Web Application: Set up your web application to generate an authorization request and redirect the user to the Azure AD B2C policy.
  • Set Up the Iframe: Add an iframe element to your web application's HTML. The src attribute of the iframe should point to the sign-in controller (e.g., /account/SignUpSignIn).
  • Handle Authentication: After the user completes the authentication process, the ID token will be received by your application. Validate the token and reload the main page to complete the authorization flow.
    <iframe src="/account/SignUpSignIn" width="100%" height="500px"></iframe>

    Replace /account/SignUpSignIn with the appropriate sign-in controller in your application.

Resources