-
Notifications
You must be signed in to change notification settings - Fork 0
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Update/Add security headers #280
base: main
Are you sure you want to change the base?
Conversation
Did you test this in one of our projects in a deployed setting? I fear that there might be some unwanted side-effects relating to different domains in a deployed setting |
Yes, I tested it on deployed settings. |
I would not add this to existing projects without extensive testing. However, the starter can define best practices and hopefully all bugs are discovered during development. So I think it is relatively safe to merge this. |
Some header could possible have a comment, when to extend/change them. You could also add links to best practices (MDN?), so we can track changes. |
Luckily I originally added comments to each Header but removed them since I wasn't sure if comments should be in the code. I could add them again, but I think it would be better to add detailed docs on how to modify each header and what effect each header has. What would you prefer? |
In code, as documentation can drift away. @johnnyomair? |
Agreed. We could add line comments for each header/item. |
site/next.config.js
Outdated
"style-src-elem 'unsafe-inline'", | ||
"style-src-attr 'unsafe-inline'", | ||
`img-src 'self' data: ${process.env.API_URL}/`, | ||
"script-src 'unsafe-eval'", |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Why do we allow 'unsafe-eval' for scripts? Isn't that potentially dangerous? Or is it required by Next?
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Unfortunately, it seems like it is required by one of our dependencies.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Can we specify which dependency? As far as I know Tag Managers require this value, but we don't have one as hard dependency. Nevertheless we might assume that a Tag Manager will be used most of the time.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Well, it's a lot; and I do not know an efficient way to evaluate it (even with tools like bundle-analyzer). Just because a package contains eval or any other "unsafe-eval" code doesn't necessarily mean the CSP needs to permit it. We have hundreds of files (including package dependencies oc) that include some form of eval.
A few example-deps are:
- exceljs
- protobufjs
- next.js
- terser-webpack-plugin
- uglify-js
There are many others, particularly code minifiers, TypeScript dependencies, and linting libraries. Has anyone suggestions on a more effective way to evaluate this?
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Has anyone suggestions on a more effective way to evaluate this?
I'd probably set it to 'none', start the site and see where an error occurs.
exceljs
I doubt that we have this dependency in the site
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
I'd probably set it to 'none', start the site and see where an error occurs.
That's what I did in the first place, but the error messages are generic and rarely inform you about the specific package.
I doubt that we have this dependency in the site
Yes, sorry - I forgot to mention that I included all microservices since we not only use the CSP in the site, (although API wouldn't be necessary I guess).
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
We can have a look at it together the next time we're both in the office.
@johnnyomair what headers should be documented and how? I don't think an explanation is useful since anyone can look headers up and they are fairly well explained. And if you understand the header you probably understand the logic behind their value. For example. x-xss-protection - the first thing in the MDN docs is that it should not be used, so its value is false. Edit: My initial documentation was somewhat like this:
|
@max-debug022 I like this. During the review I had a hard time wrapping my head around "What does I think you should add these comments |
I added the comments: cbc0472 |
I'd add comments for all settings that aren't obvious. Also, I'd only change the headers if they differ from helmets default value. |
a7ca85f
to
8fc1a07
Compare
d2311e6
to
057701e
Compare
e342490
to
0ca51f1
Compare
… local development
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Please fix the lint workflow
@dkarnutsch @fraxachun @thomasdax98 please review, this one's been open for way too long 😁 |
@@ -5,6 +5,31 @@ const withBundleAnalyzer = require("@next/bundle-analyzer")({ | |||
enabled: process.env.ANALYZE === "true", | |||
}); | |||
|
|||
function generateCSP() { |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
headers already is a function, so why not move the code there before returning the array?
cspRules["script-src"] = "'unsafe-eval'"; // Needed in local development | ||
cspRules["connect-src"] = "ws:"; // Used for hot reloading in local development | ||
} else { | ||
cspRules["upgrade-insecure-requests"] = ""; // Don't use upgrade-insecure-requests with Domain-Setup |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Why do we need this at all?
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
This instructs user agents to treat a site's insecure URLs (HTTP) as though they have been replaced with secure URLs.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Yes, but why do we need it? We don't serve any routes prefixed with http
in our applications or do we?
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Including upgrade-insecure-requests is optional but helps avoid potential misconfigurations and adds an extra layer of security, so I’d recommend keeping it.
I will wait for this PR to be merged: #415 |
This PR improves/updates the HTTP-Headers
TLDR