Note that 'frame-src' was not explicitly set, so 'default-src' is used as a fallback

Question

I try adding frame-scr since it says that "Note that 'frame-src' was not explicitly set": heres what I have try adding :

frame-src 'self';
frame-src 'self' data:;
frame-src http://example.com/;
frame-src http://* https://*;

Still error I have change the frame-src many times and don't have any luck fixing the error.

Here is my Content-Security-Policy:

default-src 'self' data: ; object-src 'none'; frame-ancestors 'self'; sandbox allow-forms allow-same-origin allow-scripts; base-uri 'self';"

Here is my HTML :

<div id="main">
     <a href="" id="link">Click me</a><br>
</div>
<div id="popup"><iframe id="popupiframe"></iframe></div>
<div id="popupdarkbg"></div>

Here is my JS :

 document.getElementById("link").onclick = function (e) {
    e.preventDefault();
    document.getElementById("popupdarkbg").style.display = "block";
    document.getElementById("popup").style.display = "block";
    document.getElementById('popupiframe').src = "http://example.com/";
    document.getElementById('popupdarkbg').onclick = function () {
        document.getElementById("popup").style.display = "none";
        document.getElementById("popupdarkbg").style.display = "none";
    };
    return false;
}

window.onkeydown = function (e) {
    if (e.keyCode == 27) {
        document.getElementById("popup").style.display = "none";
        document.getElementById("popupdarkbg").style.display = "none";
        e.preventDefault();
        return;
    }
}

I encounter this error when I click the button/text the will trigger the iframe that will show another website in iframe.

Refused to frame 'http://example.com/' because it violates the following Content Security Policy directive: "default-src 'self' www.gravatar.com fonts.googleapis.com fonts.gstatic.com". Note that 'frame-src' was not explicitly set, so 'default-src' is used as a fallback.

score 0 · Answer 1 · answered Mar 23 '21 at 22:18

Yes, you have to add frame-src http://example.com; into your CSP.
BUT:

Here is my Content-Security-Policy:

default-src 'self' data: ; object-src ...

You show the CSP which does not match the actual policy from the console error:

I encounter this error ...:

Refused to frame 'http://example.com/' because it violates the following Content Security Policy directive: "default-src 'self' www.gravatar.com fonts.googleapis.com fonts.gstatic.com".

Looks like you edit the CSP which is not publish or is overridden. This can happen, for example, if CSP is published by some CMS plugin and at the same time in the .htaccess file.

If you have .htaccess or web-config with:

Header set Content Security Policy: "...rules..."

it overrides CSP published by CMS. In case of:

Header ALWAYS set Content Security Policy: "...rules..."

you will have 2 CSPs simultaneously.

Check which CSP is actually being delivered to the browser, the tutorial is here.

Note that 'frame-src' was not explicitly set, so 'default-src' is used as a fallback

1 Answers1