RPT
RPT

Reputation: 748

How to use CSPs on iFrames

I am using an iFrame to contain an external html source https://good.com/main.html

<iframe src=“https://good.com/main.html" scrolling="no" style="overflow: hidden; height: 700px;"></iframe>

But good.com/main.html imports and executes the following javascript

https://good.com/a.js
https://good.com/b.js
https://bad.com/c.js

Is there a way to prevent good.com/main.html importing and executing bad.com/c.js? More specifically, prevent any resource that does not have the same domain as https://good.com?

I tried sandboxing the iFrame

<iframe sandbox=“allow-same-origin allow-scripts” src=“https://good.com/main.html” scrolling="no" style="overflow: hidden; height: 700px;"></iframe>

But it still imports and executes the https://bad.com/c.js

Is there a way to prevent the source from importing and executing any external js?

I read about CSPs on iFrames, but I am unsure of it’s usage.

Upvotes: 4

Views: 3656

Answers (1)

Stephen R
Stephen R

Reputation: 3897

Broadly speaking, you can't. Iframes have their own CSP and you can't pass a policy in from the parent page.

That said, the "csp" attribute of the iframe element, that you link to in the question, somewhat allows this. It allows you to request that the iframe source apply the CSP that you set in the "csp" attribute; but you can't enforce it, merely ask. So you can theoretically do:

<iframe csp="default-src 'none';" ...>

The source of the iframe may or may not implement the CSP you request.

Note this is brand new and is (reportedly) only supported in Chrome and Opera.

Upvotes: 6

Related Questions