
The policy for /apples does not allow it to frame any subresources: frame-src 'none', and the policy for /oranges does not allow it to be framed by any other pages: frame-ancestors 'none'. But the page /apples cannot frame the page /oranges for two reasons. The page /apples can be framed by /oranges, for example with an iframe tag. So for example if we had a policy for the URI /apples defined as this: frame-src 'none' frame-ancestors 'self'Īnd now a policy for the URI /oranges defined as: frame-src 'self' frame-ancestors 'none' The frame-src directive restricts where frames can be loaded from on the page protected by the CSP policy. How is frame-ancestors different from frame-src? Refused to load because it does not appear in the frame-ancestors directive of the content security policy. You might see an error message in the developer tools console such when you try to load a page in a frame, or iframe that is not allowed by the frame-ancestors policy, such as: What happens when frame-ancestors blocks something? No, the frame-ancestors does not inherit from the default-src directive, you need to explicitly specify it in your Content-Security-Policy header. Is frame-ancestors covered by the default-src directive? It must be specified as part of a Content-Security-Policy header. No, you cannot use the frame-ancestors directive from a Content-Security-Policy meta tag. Can frame-ancestors be used in a meta tag? In addition to frame and iframe the frame-ancestors directive also applies to applet, embed and objecttags. Now suppose we want to allow and to frame our page, we can specify it with frame-ancestors like this: frame-ancestors What HTML elements does frame-ancestors apply to?

Using frame-ancestors 'self' is similar to using X-Frame-Options: sameorigin In this case you can use: frame-ancestors 'self' Now suppose you want to allow a page to be framed, for example within an iframe, but only from the same site (same origin).


Specifically this means that the given URI cannot be framed inside a frame or iframe tag. Using frame-ancestors 'none' is similar to using X-Frame-Options: deny. The most common way to use the frame-ancestors directive is to block a page from being framed by other pages. Using the frame-ancestors CSP directive we can block or allow a page from being placed within a frame or iframe. The frame-ancestors directive allows you to specify which parent URLs can frame the current resource.
