DreamTeK
DreamTeK

Reputation: 34177

Content Security Policy - Determine source of blocked resource

In Firefox I am getting the following error:

Content Security Policy: The page’s settings blocked the loading of a resource at data: (“media-src”).

I am unsure why I would get this error as I host no video or audio tags.

<add name="Content-Security-Policy" value="default-src 'self'; connect-src 'self'; font-src 'self'; frame-src 'self'; img-src 'self'; media-src 'self'; object-src 'self'; script-src 'self' 'unsafe-inline' 'unsafe-eval'; style-src 'self' 'unsafe-inline';"/>

How can you find the source of the blocked resource in Firefox?

Any ideas why this would occur when the site has no external resources?


SOLUTION

I needed to include the data: attribute.

media-src 'self' data:;

Upvotes: 3

Views: 2093

Answers (2)

Tino
Tino

Reputation: 10439

NoScript (on FF) might be the culprit

FWIW, I have the same problem at my side with Firefox ESR (but not with Chrome). Each page (with just the appropriate CSP in header), even with an empty (thus 0 byte long) body, resulted in following ugly warning in the FF Console:

Content-Security-Policy: The page’s settings blocked the loading of a resource at data: (“default-src”).

The message disappears when the NoScript extension is unloaded.

Disabling NoScript on the TAB was not enough, it only vanished when I completely unloaded the extension from FF. Hence NoScript extension - sadly - injects this warning into pages, which means that NoScript leaks your privacy when it triggers a CSP report to websites and hence reveals its presence which can be used to do fingerprints (this only happens with pages with a very strict CSP, though).

When I tried to debug this, the received CSP report was not very conclusive at all:

{
  "csp-report": {
    "blocked-uri": "data",
    "disposition": "enforce",
    "document-uri": "https://survey.example.net/",
    "effective-directive": "media-src",
    "original-policy": "default-src 'none'; base-uri 'none'; form-action 'self'; script-src 'self'; img-src 'self'; style-src 'self'; connect-src 'self' https://forum.example.net/; frame-ancestors 'none'; report-uri https://login.example.net/csp",
    "referrer": "",
    "status-code": 200,
    "violated-directive": "media-src"
  }
}

Notes:

  • I replaced the real domain by example above.
  • There is no such violation reported from Chrome
  • It can be considered a FF bug that it reports a CSP violation which stems from some extension
    • Note that uBlock Origin stops the CSP reports from being send
  • I only found this solution by trial-and-error, as the received CSP reports did not help me to debug where they really came from
    • Chrome did not have the issue at all, so the first thing I had to find out was that they come from FF
    • The second thing was to find out that this stems from NoScript installed
    • Also the FF console is not very helpful in such cases
  • I probably have to live with CSP reports pouring in like a tsunami due to this
    • There are no traces in the CSP JSON that they stem from FF
    • Hence be sure to record the full HTTP headers in your receiving CSP script.
    • I probably need to improve my CSP receiver to be able to sort out such SPAM
  • NoScript is a lifesaver against malicious sites and JavaScript
    • Hence I do not recommend to disable it!
    • Instead combine it with ublock-origin to protect your privacy

Upvotes: 2

granty
granty

Reputation: 8496

Basic ways to debug CSP:

  1. Violation reports (report-uri directive) can give full info.
  2. Chrome's console more informative than Firefoxes. Chrome shows blocked Url in console (Firefox - too in some cases).
  3. The SecurityPolicyViolationEvent provides the same info as violation reports (if you familiar with JavaScript).

Detailed info how to debug CSP.

Upvotes: 2

Related Questions