Using your Dynamics 365 portal in an iframe

There might be certain scenarios where you want to utilize certain parts of Dynamics 365 portals functionality within other applications. Most often this is where another content management system (CMS) is already in place but you want to enhance its abilities and add new functions that work with your CRM. Instead of writing customizations in that CMS it can be easy to configure your desired functionality with the out of box functionality of Dynamics 365 portals.

With Dynamics 365 portals through you might run into a issue with embedding the site in an iframe. If trying to embedding your portal in an iframe you will end up with a blank frame. Opening up Chrome’s developer tools and view the console you will notice the following error providing a hint as to the issue.

Refused to display '' in a frame because it set 'X-Frame-Options' to 'SAMEORIGIN'.

X-Frame-Options is part of the HTTP response header and can be used by the web server to control who can display your content directly in an iframe. This is important if you want to prevent any sort of embeds of your site as well as limit it to an allowed list of sites. You can read more about X-Frame-Options on the Morilla Developer Network Documentation.

The following are the X-Frame-Options directive options:

  • DENY – blocks all iframe requests
  • SAMEORIGIN – allows iframe’s from the origin site
  • ALLOW-FROM – allows iframe’s from the URL

You can manipulate the X-Frame-Options of your Dynamics 365 portal through the site setting HTTP/X-Frame-Options, inserting in the value one of the options above. New portals should include the setting by default in all portals with the default value set to SAMEORIGIN. If you do not have the site setting from an older portal that has upgraded, you can add it but it requires the supporting portal code version (v8.2).

Some other considerations when embedding your portal will also be the display of the page. Most likely the site your embedding into will already have a header with navigation and also a footer, so it might not make sense to include these type of components on the pages your iframe will display.

You can handle this in various ways with the portal, either through simply putting some CSS only on iframe pages that hide elements, keep in mind that the Bootstrap CSS uses the width of your frame and not the parent window so you may be in a mobile layout inside the iframe. Another option is to use the Page Template with the Use Website Header and Footer when using the Web Template type. Leaving this option set to false will only render the contents of the liquid template, it will leave out all portal scaffolding like Bootstrap CSS, and JavaScript libraries. If you need those type of components you will need to add them back through your own references in your web template. The web template option is great for data display type options, if you want to use entity form or list then you will require that portal scaffolding for those components to work.


There is a hidden rewrite template that does not have a header or footer you can use if your only need is an entity form. Create a new page template with the type Rewrite and set the Rewrite Url to ~/Areas/Portal/Pages/Form.aspx. This page template is used by entity list to display modal dialog forms for entity list create and edit functions. This page template if you look at the v7 code only contains an entity form control and sets the content controls for header and footer to blank, it does not even include the page copy.


Based on the functions you want to accomplish and the security you require for the content in your iframe you will need to select the best method for displaying your page.

17 thoughts on “Using your Dynamics 365 portal in an iframe

  1. I agree with Nick: great post.

    Just two questions, as part of a customer portal,
    1. If my CMS already contains an identification (login, password), how to use this token to access only the information of this client within an iframe for example?
    2. Is it possible to use the 365 Portal ID to replace my CMS ID?


    1. Sharing authentication between the frames could be a little complicated. The most ideal solution would be to use a common STS (Secure Token Service – like Azure B2C or IdentityServer) with both CMS. With the STS the identity store is external from both systems and it would allow you to share to other applications too. You could just extend the profile in each individual application and sync with a backend process if necessary, or share common profile data through claims and also include common unique ID that would be included in the STS token.

      Other solutions would be to use one systems native auth but it might be hard trying to read a common cookie without code access in v8.x, you would be able to read your other CMS cookie in JS but this has potential for you to reveal your encryption key. Setting a common cookie was possible in v7.0.0018+ because of the ASP.NET Identity site settings, but they have been removed in v8.x. Also decrypting the cookie from v8.x would be difficult as you won’t know the machine key that is used to encrypt cookies.


      1. Hi Colin, thank you for this useful article.
        While authenticating Portal users with AD B2C, it seems impossible to display portal content in an IFrame, as AD B2C login dialog refuses to display in an IFrame.
        Are you familiar with any solution for this scenario?


      2. B2C blocks interactive requests in iframes as a security, most if not all providers do. You need to get your B2C token and cookie for your site prior to loading in the iframe, or look into silent token methods provided by MSAL.

        Silent auth uses prompt none as a parameter which will allow iframe passage. Probably need to rethink things a little bit and why sending them through an iframe in the first place. If you must then the easiest way is to do a redirect first to get your other site the proper token first.

        Liked by 1 person

    1. The setting is found under the CRM navigation – Portals > Site Settings and the setting name “HTTP/X-Frame-Options”, if it does not already exist then create a new site setting with that name and your desired value.


  2. Hi

    After manipulating , X-Frame-Options , still we are getting “Access Denied” issue in Iframe, Could you please explain further.


  3. Hi Colin,
    Thanks for this helpful post.
    I configured the portal to run inside an iFrame, and it is working well. However some of links (HTML a elements) have attribute target =”_top” and when clicked change the top location to the portal url and exiting from the parent site.
    Do you know if it is possible to disable this behaviour with portal configuration. I can have JavaScript to change the attribute target to _self, but I have other issues …
    Thank you.


    1. Hi Lahcen, you should be able to override most of the HTML functionality by creating your own Liquid templates where you can write the HTML how your requirements need implemented. Alteratively if you just want easy coverage without going through all HTML then as you suggest a quick JavaScript/jQuery function to do a replace of “_top” to “_self” would work as well.



  4. i’m having a problem with this X-Frame-Options thing… and it is that 4 forms in my portal should be accessed from 4 different domains.

    X-Frame-Options, only allows to declare one domain.

    The only solution is to set 4 different portals?
    Or 4 portal binded to the same microsoftcrmportals url?


    1. You could potentially wildcard if you used a sub domain on the same top level domain but otherwise that is the restriction as outline in the RFC for X-Frame-Options. Yes 4 portals would also work because there would be a different X-Frame-Option and application for each.


  5. Hi. I tried everything what you mentioned here and still I have issues. When I try display new web page for entity list with new page template (with unchecked field “use website header and footer”) then I have this error: “There are no records to display. You don’t have permission to view these records. Error completing request. Loading…” when I check “use header and footer” again then page is displayed correctly. Do you know how to resolve this issue?


    1. Hi Jon Snow 🙂

      Unchecking “use website header and footer” will prevent the JS scripts from loading and break the functionality of an entity list as it is dependent on JS to load its data. You will want to keep that option on and just have it hide or not use the standard header and footer.


      1. I want use this webpage later in iframe, so I don’t want have header and footer. Do you know which JS should I load?


Leave a Reply

Fill in your details below or click an icon to log in: Logo

You are commenting using your account. Log Out /  Change )

Google photo

You are commenting using your Google account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s