Content Security Policy (CSP)
Quick Reference Guide


The CSP frame-src Directive

The frame-src Content Security Policy (CSP) directive controls the loading of frames (for example via an <iframe> HTML tag) within a HTML document.

Example Policy

Assume a Content-Security-Policy header is set with the following policy:

frame-src 'self' allowed-site.example.com

Allows

With the above CSP policy, frames can be loaded via the same origin (via the 'self' source list value), or via URLs on the domain: allowed-site.example.com using the same scheme as the parent document (eg https).

<iframe src="/folder/example.html"></iframe>
<iframe src="https://allowed-site.example.com/frame.html"></iframe>

Blocks

The above policy will block any frame from loading that was not same origin or under the allowed-site.example.com domain, so the following would be blocked by CSP:

<iframe src="https://other.example.com/"></iframe>

Does CSP frame-src apply to frame and frameset tags?

Yes, the CSP frame-src directive does apply to the frame and frameset tags, however these tags are deprecated.

What does 'frame-src' was not explicitly set mean?

If you do not set the frame-src CSP directive, but you do have the default-src CSP directive set, then that policy will be applied. You need to either make sure that your iframe src attribute values comply with the default-src policy, or you need to add a frame-src directive to your CSP policy.

Here are some example of what you might see in the console when images are blocked from loading by a CSP policy with a default-src policy set:

refused to load the image because it violates the following content security policy directive: "default-src 'none'". note that 'frame-src' was not explicitly set, so 'default-src' is used as a fallback.
refused to load the image 'http://localhost:8080/favicon.ico' because it violates the following content security policy directive: "default-src 'none'". note that 'frame-src' was not explicitly set, so 'default-src' is used as a fallback.

How can I prevent my page from using frames

If you specify a content security policy with: frame-src 'none', this essentially prevents the iframe, frame, and frameset tags from functioning.

What is the difference between frame-src and frame-ancestors?

The CSP frame-ancestors directive prevents a page from being loaded inside a frame, and the frame-src controls which urls can be placed inside an frame on the current page.

Browser Support for frame-src

CSP Level 1


Supported On:


Chrome 25+ (2013)
Firefox 23+ (2013)
Safari 7+ (2013)
Edge 14+ (2015)


Not Supported On:


Internet Explorer

The CSP frame-src directive has been part of the Content Security Policy Specification since the first version of it (CSP Level 1).

The frame-src directive was deprecated in CSP Version 2 in favor of child-src, but was then undeprecated in CSP Level 3 (the latest version)

Internet Explorer 11 and below do not support the CSP frame-src directive. This means that IE11 will simply ignore the policy and allow frames to load from anywhere (as if a policy had not been set at all).

CSP Developer Field Guide

CSP Developer Field Guide

Want to learn the ins and outs CSP? Grab a copy of the CSP Developer Field Guide. It's a short and sweet guide to help developers get up to speed quickly.

Grab a Copy

Struggling to stay on top of security advisories?

Advisory Week is a weekly roundup of all the security advisories published by the major software vendors.