How to get past CSP (Content Security Policy) by allowing everything?

Question

The website works perfectly on local machine, but when I upload it to netlify it drops near 20 errors.

I just want to share one of my first projects with friends and not be bothered with security right now.

Tried implementing all the answers from this Allow All Content Security Policy? post, but still nothing.

This is my header that's getting the previously mentioned 20 errors:

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="Content-Security-Policy" content="
      default-src *  data: blob: filesystem: about: ws: wss: 'unsafe-inline' 'unsafe-eval' 'unsafe-dynamic'; 
      script-src * data: blob: 'unsafe-inline' 'unsafe-eval'; 
      connect-src * data: blob: 'unsafe-inline'; 
      img-src * data: blob: 'unsafe-inline'; 
      frame-src * data: blob: ; 
      style-src * data: blob: 'unsafe-inline';
      font-src * data: blob: 'unsafe-inline';">
    <link rel="stylesheet" href="css/main.css">

But trying all the other answers also resulted in something similar.

The way is, don't add any `meta http-equiv="Content-Security-Policy"` element to the document at all, and don't send any Content-Security-Policy at all. — sideshowbarker, Feb 06 '21 at 08:33

score 1 · Accepted Answer · answered Jul 27 '21 at 15:29

1

Same happened to me recently, you likely have a browser extension running that blocks scripts.

That's why you probably cannot even see these headers in google dev tools.

Disable it for that site and voila ;)

answered Jul 27 '21 at 15:29

nico gawenda

3,648
3
25
38

score 0 · Answer 2 · answered Feb 06 '21 at 10:13

0

Initially you have a CSP published via HTTP header, this CSP has a characteristic script-src-elem 'none' rule (underlined in BLUE in the print screen).
You added CSP via the meta tag, this CSP has a characteristic 'unsafe-dynamic' token (underlined in GREEN in the print screen).

You can't relax first Content Security Policy by adding a second one.

Like as comment by sideshowbarker, just remove CSP in HTTP header. Check if you have netlify-plugin-csp-generator or netlify-plugin-csp-headers Netlify packages installed. Those can publish default CSP via HTTP header.

answered Feb 06 '21 at 10:13

granty

7,234
1
14
21

Ok, so I removed the tag, installed the -csp-generator with npm and created a [netlify.toml file](https://i.imgur.com/9ejmPD7.png) where I tried multiple variations. Still getting the same errors where it doesn't like the [gsap CDN](https://i.imgur.com/hAKDBb8.png) and same [CSP issues](https://i.imgur.com/iTFj78j.png). Do I have to change all the * to 'self' 'unsafe-inline' 'unsafe-eval' and so on? Am I even on the right path? Why do no netlify tutorials mention anything about this / so few posts about it, why am I running into these issues with my basic single-page web app? – Maksiss Feb 06 '21 at 13:54
On the contrary, I suggested removing all packages that can publish CSP On local machine you do not have any troubles, only with Netlify because some packages publish default CSP. Remove meta and csp-packages installed. Then check do you still have a CSP header, tutorial is [here](https://stackoverflow.com/questions/64060894/trouble-with-content-security-policy/64068629#64068629). And check that no `` presents in the HTML code.. – granty Feb 06 '21 at 17:09
1

omg, I'm such a dunce... I for some reason didn't realise that it could be my noScript extension that's blocking the .js files. So yeah, doesn't look like I even needed all the CSP stuff, but thank you for bothering to try and help! -_-' – Maksiss Feb 06 '21 at 18:50
An interesting twist. Could you confirm that noScript extension block the .js files and it's observed as Content Security Policy blocking in the console? – granty Feb 07 '21 at 01:31
Not sure what confirmation you need, but I was wondering why so many errors referenced the ...netlify.app/, as it's something that I have no control over. And when I finally checked the devtool network tab, noticed that both mine and gsap scripts are in red and then it clicked. As soon as I set the app to trusted in noScript, everything worked. And the script-blocked console screenshots can be seen above – Maksiss Feb 07 '21 at 14:02

How to get past CSP (Content Security Policy) by allowing everything?

2 Answers2