To Netlify: please have a look on a CSP violation (maybe related to prerender)

IP address comes from 3.235.xx.xx. It access the URL of my Netlify (preview site?) https://5f1553a0a5e2da5f8387fffe--lucid-lamarr-eeb067.netlify.app
It may be related to Netlify prerender function. I am not sure.

I had CSP in place, the production site works fine. The violation (CSS/JS) triggers two alarms to my CSP software.

Please take a look, thanks.

{
“csp-report”: {
“line_number”: 96,
“blocked_uri”: “https://www.kappawingman.com/theme/css/copybutton.css”,
“script_sample”: “”,
“status_code”: 0,
“violated_directive”: “style-src-elem”,
“document_uri”: “https://random-number-my-random-url-in-netlify/”,
“original_policy”: “default-src ‘self’ https://disqus.com https://c.disquscdn.com ; manifest-src ‘self’; script-src ‘self’ ‘unsafe-inline’ ‘unsafe-eval’ https://cdnjs.cloudflare.com https://cdn.jsdelivr.net https://browser.sentry-cdn.com https://kappa-wingman.disqus.com/embed.js https://kappa-wingman.disqus.com/count.js https://c.disquscdn.com https://www.google-analytics.com https://storage.googleapis.com https://api.github.com; img-src ‘self’ https://* https://www.google-analytics.com https://webmention.io https://res.cloudinary.com; style-src ‘self’ ‘unsafe-inline’ https://cdnjs.cloudflare.com https://cdn.jsdelivr.net https://fonts.googleapis.com https://c.disquscdn.com; font-src ‘self’ https://cdn.jsdelivr.net https://fonts.googleapis.com https://fonts.gstatic.com; connect-src ‘self’ https://o417064.ingest.sentry.io https://meilisearch.kappawingman.com https://kappa-meilisearch.herokuapp.com https://webmention.io https://s3-us-west-2.amazonaws.com/ca3db/ https://c.disquscdn.com https://kappa-wingman.disqus.com wss://realtime.services.disqus.com https://cdnjs.cloudflare.com https://cdn.jsdelivr.net https://browser.sentry-cdn.com https://fonts.googleapis.com https://fonts.gstatic.com https://res.cloudinary.com; frame-ancestors ‘self’; base-uri ‘self’; form-action ‘self’ https://webmention.io; media-src ‘none’; object-src ‘none’; block-all-mixed-content;”,
“source_file”: “https://random-number-my-random-url-in-netlify/”,
“disposition”: “enforce”,
“referrer”: “”,
“effective_directive”: “style-src-elem”
}
}

{
“csp-report”: {
“blocked_uri”: “https://www.kappawingman.com/theme/js/util.js?v=v1.9.3”,
“script_sample”: “”,
“status_code”: 0,
“violated_directive”: “script-src-elem”,
“document_uri”: “https://random-number-my-random-url-in-netlify/”,
“original_policy”: “default-src ‘self’ https://disqus.com https://c.disquscdn.com ; manifest-src ‘self’; script-src ‘self’ ‘unsafe-inline’ ‘unsafe-eval’ https://cdnjs.cloudflare.com https://cdn.jsdelivr.net https://browser.sentry-cdn.com https://kappa-wingman.disqus.com/embed.js https://kappa-wingman.disqus.com/count.js https://c.disquscdn.com https://www.google-analytics.com https://storage.googleapis.com https://api.github.com; img-src ‘self’ https://* https://www.google-analytics.com https://webmention.io https://res.cloudinary.com; style-src ‘self’ ‘unsafe-inline’ https://cdnjs.cloudflare.com https://cdn.jsdelivr.net https://fonts.googleapis.com https://c.disquscdn.com; font-src ‘self’ https://cdn.jsdelivr.net https://fonts.googleapis.com https://fonts.gstatic.com; connect-src ‘self’ https://o417064.ingest.sentry.io https://meilisearch.kappawingman.com https://kappa-meilisearch.herokuapp.com https://webmention.io https://s3-us-west-2.amazonaws.com/ca3db/ https://c.disquscdn.com https://kappa-wingman.disqus.com wss://realtime.services.disqus.com https://cdnjs.cloudflare.com https://cdn.jsdelivr.net https://browser.sentry-cdn.com https://fonts.googleapis.com https://fonts.gstatic.com https://res.cloudinary.com; frame-ancestors ‘self’; base-uri ‘self’; form-action ‘self’ https://webmention.io; media-src ‘none’; object-src ‘none’; block-all-mixed-content;”,
“disposition”: “enforce”,
“referrer”: “”,
“effective_directive”: “script-src-elem”
}
}

Hey! So, the CSP header is set by you. I guess that this error is thrown because you’re set to ‘self’ yet there’s a lot of external links and resources, hence not the same origin.

This may be a good resource for you :slight_smile:

  1. Besides setting to ‘self’. I tried to include all necessary host names in the CSP. I have software to report CSP violation and I also check browsers to see if there are violations.

  2. It should connect to my main page (www.kappaingman.com) instead of the ‘random-number-my-netlify-hostname.app’. My CSP can’t protect the random generated prefix or hostname. I am not sure if using ‘https://*-lucid-lamarr-eeb067.netlify.app’ in the CSP is valid.

Thanks.

Hey again! Spoke about this one a little bit. Are you intentionally using your deploy previews and poking them externally? If so, you might want to branch these as subdomains and preserve/share these links.

If not – well, this is part of the beauty of atomic deploys! I don’t have any specific advice to be able to make this process easier for a plethora of deploy previews but I’d be eager to know if the syntax in part 2 will work!

No, I didn’t use, link or tell anyone about my preview URL (the URL with random number prefix).

Also, two more similar violations just come from 18.232.xxx.xx (Amazon). User Agent is HeadlessChrome.

So, if they’re not being used long-term, do you need to monitor? :face_with_hand_over_mouth:

I’d love to know more about the root problem with this and how impactful it is to your workflow, service(s) and site(s).

I take a look on the report

blocked_uri https://www.kappawingman.com/theme/css/nero.css?v=v1.9.3
|document_uri|https://5f159c942813f497aab202f9–lucid-lamarr-eeb067.netlify.app/

Probably the machine in Amazon is accessing the preview URL, but my codes in the HTML refer to my production web site. When they access the elements inside the HTML, alarm triggers because those ‘self’ in the CSP is now the preview URL, not my production URL.

Problem may be solve if they access my production URL or remove all the CSP :slight_smile:

It is not affecting my workflow. But the problem may happen to other people, and may trigger some CSP violations to their reporting services.

That makes sense. If you are accessing the netlify.app subdomain, then there is nothing we can do to override a CSP header you’ve set. What you describe is pretty much out of our hands.

That said, we do appreciate you bringing this up for other users to be aware of those scenarios you’ve encountered around CSP.

I have further check. It seems the CSP is triggered when I deploy my website by CLI. May be Netlify is going to generate the thumbnail to display it next on the Netlify web console (https://app.netlify.com/sites/my-netlify-site-name/overview).

Sorry, I’m not sure I understand what you mean by that. Were you saying that you only see CSP issues when deploying via CLI? Note that we don’t serve sites any differently as far as CSP (CORS) headers are concerned.

Yes, it is because the automated remote system access my preview site. But my CSP are only valid for production site. They have different URL.

OK, I don’t think this is a bug - do you? If you access the preview on our domain instead of yours, you will not be able to affect the CSP. You’ll need to access on your own domain to have any control over that, as far as I understand it.

The problem is that the remote system to access my preview site is not me or users from the internet. It should be coming from a remote system from Netlify, the IP is from Amazon, the user agent is headless chrome. I don’t have control over those systems accessing my preview site (it’s is a random URL). Nobody except me and Netlify would know the preview URL.

Headless chrome sounds like our prerendering service: https://docs.netlify.com/site-deploys/post-processing/prerendering/#app . Perhaps you should not use that feature on this site due to your special CSP needs?