Rosamunda
Rosamunda

Reputation: 14980

Adding a Content-Security-Policy with PHP, why resources are not loaded?

I'm adding this at the top of my header in my php file:

header("Content-Security-Policy: default-src 'self'  https://apis.google.com  https://www.googletagmanager.com  https://fonts.googleapis.com  https://use.fontawesome.com  https://connect.facebook.net  https://www.facebook.com");

I want to allow scripts from all those websites. I've tries replacing every url with *, like https://apis.google.com to *.google.com, but the result is the same.

I've also tries using script-src instead of default-src.

I assume that this is for allowing everything from certain websites, but the resources included in that directive are not loaded. For example, the google fonts. They just won't load, I'm seeing the system font, not the Google font.

What am I doing wrong?

Checking the console I get this error:

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

Upvotes: 2

Views: 4564

Answers (3)

granty
granty

Reputation: 8496

Got it sorted. Just in case it helps someone:

script-src 'strict-dynamic' 'unsafe-inline' http: https:;
object-src 'none';
base-uri 'none';
require-trusted-types-for 'script';
report-uri https://apis.google.com https://www.googletagmanager.com https://fonts.googleapis.com https://use.fontawesome.com https://connect.facebook.net

Given CSP has 2 fatal errors and block any script as result:

  1. 'strict-dynamic' cancels any host-based / scheme-based sources and 'unsafe-inline' token (and 'self' too). Therefore it must be paired with 'nonce-value' or 'hash-value' in order to allow scripts which are fall under these.
    Currently in CSP3-compatible browsers you have all scripts blocked because resulting directive is script-src 'strict-dynamic' does allow nothing.

  2. For require-trusted-types-for directive have to use Trusted Types API to assing value to some XSS vulnerable DOM sinks. Therefore covered by this directive JS constructs like: element.innerHTML='...', document.write(), createElement('script'), parseFromString(), etc are block in Chrome browser (others as for now do not support Trusted Types API).

Do remove require-trusted-types-for 'script'; directive and add 'nonce-value' or 'hash-value' into script-src if you wish to use 'strict-dynamic'. Only scripts having nonce="value" and their childs will be allowed in this case. Usage of 'hash-value' will allow exec of scripts which have this hash and their childs (do not forget the integrity= attribute for external scripts).

And yes, remove the report-uri directive as was mentioned by Quentin. Google and facebook are not ready to serve your violation reports.

Upvotes: 1

Quentin
Quentin

Reputation: 943556

You have permitted 'self' which allows scripts to be loaded from other URLs on the same origin. This is the origin most likely to be entirely safe because it doesn't involve a third party.

'self' does not include inline scripts (which would need the 'unsafe-inline' or 'unsafe-hashes' options).

Inline scripts are the most dangerous to permit as they are the most likely kind of script to be created by an XSS attack.

Further reading: MDN

Upvotes: 2

Rosamunda
Rosamunda

Reputation: 14980

Got it sorted. Just in case it helps someone:

header("Content-Security-Policy: script-src 'strict-dynamic' 'unsafe-inline' http: https:;
object-src 'none';
base-uri 'none';
require-trusted-types-for 'script';
report-uri https://apis.google.com  https://www.googletagmanager.com  https://fonts.googleapis.com  
https://use.fontawesome.com  
https://connect.facebook.net");

Upvotes: 1

Related Questions