Content Security Policy report-uri is not being recognized - security

I'm setting up a content security policy in report-only mode. When I test it, Google Chrome gives this error:
The Content Security Policy 'default-src 'self'; script-src 'self' 'unsafe-inline' https: //use.typekit.com https://js.hs-analytics.net https://google-analytics.com https://ajax.googleapis.com; font-src https: //use.typekit.com; style-src 'self' 'unsafe-inline' https: //use.typekit.com; frame-src https: //www.youtube.com;' was delivered in report-only mode, but does not specify a 'report-uri'; the policy will have no effect. Please either add a 'report-uri' directive, or deliver the policy via the 'Content-Security-Policy' header.
Here is my full Content Security Policy, I define the HTTP header in a header PHP file for the website:
header("Content-Security-Policy-Report-Only: default-src 'self';
script-src 'self' 'unsafe-inline' https://use.typekit.com https://js.hs-analytics.net https://google-analytics.com https://ajax.googleapis.com;
font-src https://use.typekit.com;
style-src 'self' 'unsafe-inline' https://use.typekit.com;
frame-src https://www.youtube.com;
report-uri /csp-violations-report-endpoint;
");
I have a folder in the web root directory: csp-violations-report-endpoint, with a single index.php file inside of it to handle the violation.
I'm not sure what I'm doing wrong. I've read MDN's suggestions for report-uri and used Google's example to write my report-uri directive.
Should I try pointing the report-uri to a script in the root directory? Should I try letting it log on its own, or do I need a parser to handle it? Could there be something wrong with my script? (I can include that if it would be of help)
Edit: It may be possible that my web browser is ignoring the report-uri directive (since it's deprecated) and is expecting the report-to directive, and that is why it's not working but the error message leads me to believe that isn't the case.

I might be completely off base, but, if you're using the code exactly as pictured above, then you are likely sending a bunch of invalid headers. HTTP Headers have to exist on a single line, and yours does not. Try this:
header(
"Content-Security-Policy-Report-Only: default-src 'self'; " .
"script-src 'self' 'unsafe-inline' https://use.typekit.com https://js.hs-analytics.net https://google-analytics.com https://ajax.googleapis.com; " .
"font-src https://use.typekit.com; " .
"style-src 'self' 'unsafe-inline' https://use.typekit.com; " .
"frame-src https://www.youtube.com; " .
"report-uri /csp-violations-report-endpoint; "
);

Related

How to set correct Chrome extension content_security_policy regex in manifest v3

I was using manifest version 2 and everything was fine, But unfortunately, version 2 is no longer after 2023. So I've decided to migrate to the version3.
I was defining content_security_policy as below:
"content_security_policy": "script-src 'self' https://ssl.google-analytics.com;
object-src 'self'"
and now I'm trying to set it as below
"content_security_policy":{
"extension_pages" : "script-src 'self' https://ssl.google-analytics.com;
object-src 'self'"
}
But I got this error:
Refused to load the script 'https://ssl.google-analytics.com/ga.js' because it
violates the following Content Security Policy directive: "script-src 'self'". Note
that 'script-src-elem' was not explicitly set, so 'script-src' is used as a fallback.
How can I solve this?

Issue in content security policy in chrome extension manifest version 3

The content security policy value in my chrome extension manifest version 2 is:
"content_security_policy": "script-src 'self' https://ssl.google-analytics.com; object-src 'self'"
Now, i need to migrate to manifest version 3. To do so, I wrote the content security policy value in the following way:
"content_security_policy": { "extension_pages": "script-src 'self' https://ssl.google-analytics.com; object-src 'self'", "sandbox": "..." }
But when I try to run the extension, the manifest is not loaded and I get the following error
'content_security_policy.extension_pages': Insecure CSP value "https://ssl.google-analytics.com" in directive 'script-src'.
Can someone please guide me how can I fix the issue ?
Thanks for any help in advance.

Unrecognized Content-Security-Policy directive ''self''

I have an error please let me know how to solve it
[ Unrecognized Content-Security-Policy directive ''self''. ]
[ The Content Security Policy directive 'default-src' contains 'style-src' as a source expression. Did you mean 'default-src ...; style-src...' (note the semicolon)? ]
The code used is
Header set Content-Security-Policy "default-src style-src 'unsafe-inline'; 'self';"

Access-Control-Allow-Origin error for Webfonts on Firefox/Mac

i try to load some web fonts from webtype but on Firefox/Mac i always geht an Access-Control-Allow-Origin-Error.
htaccess:
Header set Access-Control-Allow-Origin "*"
base href is also set:
<base href="http://XXX.XXX.ch">
Error: CORS-Header 'Access-Control-Allow-Origin' missing
Any idea to solve the problem?
thanks
thomas

How to proxy an image in node express?

I have this image from Filepicker.io: https://www.filepicker.io/api/file/9H-1AxgZTwqct8tjkmkZ
But when I open it in the browser, it will download the file directly, I thought that's because the response header or something, so I'm wondering how to proxy it so that I can view it in browser like other images, like this one : https://distilleryimage1.s3.amazonaws.com/84d490a4071811e285a622000a1d039f_5.jpg
curl -si https://www.filepicker.io/api/file/9H-1AxgZTwqct8tjkmkZ | head
HTTP/1.1 200 OK
Access-Control-Allow-Headers: CONTENT-TYPE, X-NO-STREAM
Access-Control-Allow-Methods: DELETE, GET, HEAD, POST, PUT
Access-Control-Allow-Origin: *
Access-Control-Max-Age: 21600
Cache-Control: public, max-age=315360000, no-transform
Content-Disposition: attachment; filename="中秋福利.jpg"
Content-Type: image/jpeg
Date: Fri, 28 Sep 2012 08:21:45 GMT
Server: gunicorn/0.14.6
Content-Disposition is set to attachment. If you proxy it then remove that header altogether or set it to inline.
While vinayr's answer is correct, you can avoid using a proxy altogether by appending ?dl=false to the end of your FilePicker URI.
For example: https://www.filepicker.io/api/file/9H-1AxgZTwqct8tjkmkZ?dl=false
There are also a number of other in the FilePicker Documentation, particularly the "Working with FPUrls" section and the "Retrieving the file" and "Image Conversion" subsections.
Github uses https://github.com/atmos/camo to proxy images for SSL. You can try using it. You can mount it on your express app:
var camo = require('./node_modules/server.js') // you have to strip the server.listen(port) part
app.use('/proxy', camo)

Resources