React JS app's iframe Dynamics app blocked

Question

1. We're trying to iframe: mrc-xxx-xxx.crm.dynamics.com  
2. Dynamics REDIRECTS to: login.microsoftonline.com
3. Login blocks with X-Frame-Options 

how to solve this problem. We are already logged in React App and if the new tab opens the mrc-xxx-xxx.crm.dynamics.com   it shows the page just fine but from the the iFrame. I see the following error

Refused to display 'https://login.microsoftonline.com/' in a frame because it set 'X-Frame-Options' to 'deny'.

DO u agree with below statement? If, yes we cannot find the option to allow embedding setting,
This happens because Dynamics doesn't accept iframe authentication without the "AllowEmbedding" setting enabled.  The login.microsoftonline.com error is the SYMPTOM. The Dynamics redirect is the CAUSE. 

Answer 1

The issue you are encountering is due to the X-Frame-Options header being set to DENY for the login page at login.microsoftonline.com. This is a security measure to prevent clickjacking attacks, and it is by design that Microsoft Entra ID (formerly Azure AD) does not allow its login page to be embedded in an iframe.

As for your statement regarding the "AllowEmbedding" setting, it is correct that Dynamics 365 does not support iframe authentication without specific configurations. However, the inability to embed the login page is not something that can be resolved by changing settings on your end, as it is a security feature enforced by Microsoft.

To handle authentication in your React app, you should consider using the MSAL (Microsoft Authentication Library) for JavaScript, which provides methods for handling authentication flows without relying on iframes. You can utilize popup APIs for user interaction instead of trying to load the login page in an iframe.

For more information on handling authentication in iframes and the limitations involved, you can refer to the documentation on iframe usage with MSAL.

---

References:

• Using MSAL in iframed apps
• Unable to display SharePoint pages from a different domain in iFrame

Answer 2

Hello,

You are bumping into a hard platform limit, not a missing toggle.

login.microsoftonline.com always sends X-Frame-Options: DENY for its interactive sign-in pages so they cannot be rendered inside an iframe. This is a security control from Microsoft Entra ID to block clickjacking and similar attacks, and it is not something you can override from Dynamics or from your React app.

When your React app loads mrc-xxx-xxx.crm.dynamics.com in an iframe, Dynamics sees that the user is not authenticated in that browser context, so it redirects to login.microsoftonline.com. At that point the iframe tries to show the Microsoft login page, the login service sends X-Frame-Options: DENY, and the browser refuses to display it. That is why you see the console error.

So, about this statement:

This happens because Dynamics does not accept iframe authentication without the AllowEmbedding setting enabled. The login.microsoftonline.com error is the SYMPTOM. The Dynamics redirect is the CAUSE.

I would not fully agree with it.

It is true that Dynamics is redirecting you, so in that sense the redirect is part of the cause. But the real blocker you are seeing is the Entra login page itself, which is intentionally non-frameable. Even if Dynamics had an AllowEmbedding option for its own pages, that would not change the headers returned by login.microsoftonline.com. The X-Frame-Options: DENY on the login domain is what actually stops the iframe, and that header is controlled only by Microsoft, not by a setting in your tenant.

Settings like HTTP/X-Frame-Options or any embedding flags that you might find on portals or apps only affect how your Dynamics or portal pages can be embedded. They do not make the Microsoft login service embeddable.

The way to solve this in a React app is to change the design so that the Microsoft login flow never runs inside an iframe at all. In practice, that means:

1. Handle Entra ID sign-in at top level or with a popup window in your React app, using Microsoft Authentication Library for JavaScript (MSAL) or an equivalent supported flow, not in an iframe.
2. Once the user is authenticated and you have tokens, either open Dynamics in a normal browser tab or window (which is what you already see working) or use the tokens to call Dataverse or other APIs from your React app instead of trying to embed the full Dynamics UI in an iframe.

From a Microsoft best-practice standpoint, trying to keep the entire Dynamics UI inside an iframe in a custom React app while relying on the Entra interactive login inside that same iframe is not supported and will keep failing with exactly the error you are seeing.