How to enable content security policy for identity server?

I have a micro front-end which is connected to my identity server. In order for a user to access the micro front-end, the user needs to be authenticated via this ID server. The micro front-end needs to be embedded in an iframe in my main application but since this micro front-end requires the ID server, I am getting an error on the console. Everything works fine before embedding this micro front-end but I get this problem as soon it gets into the iframe.

Refused to frame 'https://localhost:44300/' because an ancestor violates the following Content Security Policy directive: "frame-ancestors 'none'".

I tried including this in my identity server’s web.config file which resulted to the above error on the console.

<system.webServer>
    <httpProtocol>
      <customHeaders>
        <add name="Content-Security-Policy" value="frame-ancestors ''" />
      </customHeaders>
    </httpProtocol>
  </system.webServer>

It seems ID server does not allow its content to be embedded in an iframe. This perhaps might not be a good practice but per my requirements, i will like to know how to enable this.

UPDATE

Here is where the csp is defined

public override void OnResultExecuting(ResultExecutingContext context)
        {
            var result = context.Result;
            if (result is ViewResult)
            {
                // https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/X-Content-Type-Options
                if (!context.HttpContext.Response.Headers.ContainsKey("X-Content-Type-Options"))
                {
                    context.HttpContext.Response.Headers.Add("X-Content-Type-Options", "nosniff");
                }

                // https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/X-Frame-Options
                if (!context.HttpContext.Response.Headers.ContainsKey("X-Frame-Options"))
                {
                    context.HttpContext.Response.Headers.Add("X-Frame-Options", "SAMEORIGIN");
                }

                // https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/Content-Security-Policy
                var csp = "default-src 'self'; object-src 'none'; frame-ancestors 'none'; sandbox allow-forms allow-same-origin allow-scripts; base-uri 'self';";
                // also consider adding upgrade-insecure-requests once you have HTTPS in place for production
                //csp += "upgrade-insecure-requests;";
                // also an example if you need client images to be displayed from twitter
                // csp += "img-src 'self' https://pbs.twimg.com;";

                // once for standards compliant browsers
                if (!context.HttpContext.Response.Headers.ContainsKey("Content-Security-Policy"))
                {
                    context.HttpContext.Response.Headers.Add("Content-Security-Policy", csp);
                }
                // and once again for IE
                if (!context.HttpContext.Response.Headers.ContainsKey("X-Content-Security-Policy"))
                {
                    context.HttpContext.Response.Headers.Add("X-Content-Security-Policy", csp);
                }

                // https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/Referrer-Policy
                var referrer_policy = "no-referrer";
                if (!context.HttpContext.Response.Headers.ContainsKey("Referrer-Policy"))
                {
                    context.HttpContext.Response.Headers.Add("Referrer-Policy", referrer_policy);
                }
            }
        }

Answers:

Thank you for visiting the Q&A section on Magenaut. Please note that all the answers may not help you solve the issue immediately. So please treat them as advisements. If you found the post helpful (or not), leave a comment & I’ll get back to you as soon as possible.

Method 1

It is really a bad idea to try to iframe IdentityServer, because then its hard for the user to know where he is actually logging in to.

If you still want to change it you need to look at the SecurityHeadersAttribute.cs file in the QuickStart folder, that one defines the CSP.

In this file you can tweak the security headers that are sent to the browser. You need to look at the CSP and the X-Frame-Options header.

All methods was sourced from stackoverflow.com or stackexchange.com, is licensed under cc by-sa 2.5, cc by-sa 3.0 and cc by-sa 4.0