Web Application Security: Difference between revisions
Created page with "=Introduction= I wanted to create a page to make sure I am always covering issues with security. Some I would know off hand but useful for others when asked about =Resources=..." |
|||
(9 intermediate revisions by the same user not shown) | |||
Line 2: | Line 2: | ||
I wanted to create a page to make sure I am always covering issues with security. Some I would know off hand but useful for others when asked about | I wanted to create a page to make sure I am always covering issues with security. Some I would know off hand but useful for others when asked about | ||
=Resources= | =Resources= | ||
[[https://expressjs.com/en/advanced/best-practice-security.html Express Article]] | [https://pragmaticwebsecurity.com/articles/oauthoidc/localstorage-xss.htm XSS and token storage] | ||
<br> | |||
[https://expressjs.com/en/advanced/best-practice-security.html Express Article]] | |||
<br> | |||
[https://browsersecrets.restograde.com/ Securing Data in the Browser] | |||
<br> | |||
[https://pragmaticwebsecurity.com/files/cheatsheets/browsersecrets.pdf Securing Data in the Browser 2] | |||
<br> | |||
[https://pragmaticwebsecurity.com/files/cheatsheets/reactxss.pdf Avoiding XSS in React Apps] | |||
<br> | |||
[https://pragmaticwebsecurity.com/files/cheatsheets/angularowasptop10.pdf Avoiding XSS in Angular Apps] | |||
=Current Approach= | =Current Approach= | ||
*Helmet | *Use TLS | ||
*Implement Passport Strategy | |||
*Implement CSP | |||
*Implement Rate Limiting | |||
=Helmet= | |||
Helmet helps with | |||
*csp sets the Content-Security-Policy header to help prevent cross-site scripting attacks and other cross-site injections. | |||
*hidePoweredBy removes the X-Powered-By header. | |||
*hsts sets Strict-Transport-Security header that enforces secure (HTTP over SSL/TLS) connections to the server. | |||
*ieNoOpen sets X-Download-Options for IE8+. | |||
*noCache sets Cache-Control and Pragma headers to disable client-side caching. | |||
*noSniff sets X-Content-Type-Options to prevent browsers from MIME-sniffing a response away from the declared content-type. | |||
*frameguard sets the X-Frame-Options header to provide clickjacking protection. | |||
*xssFilter sets X-XSS-Protection to disable the buggy Cross-site scripting (XSS) filter in web browsers. | |||
=XSS and Storage= | |||
In the link above the overview was<br><br> | |||
Step 1: don’t worry too much about storage...<br> | |||
Step 2: review your application for XSS vulnerabilities. Avoiding XSS is insanely hard and requires a thorough code review. Lear about your templating framework and how to avoid XSS. Learn how to use context-sensitive output encoding and sanitization correctly. Go through every line of code to ensure you do not have XSS vulnerabilities...<br> | |||
Step 3: deploy a defense-in-depth mechanism against XSS. Modern browsers support a variety of security mechanisms that can help you lock down your application...<br> | |||
=Chrome and SameSite= | |||
With recent versions of Chrome there is a feature called SameSite which prevents cookies being passed to between apps. For passport where the implementation is on nodeJS this meant changing the COOKIE_OPTIONS | |||
<syntaxhighlight lang="js"> | |||
exports.COOKIE_OPTIONS = { | |||
httpOnly: true, | |||
// Since localhost is not having https protocol, | |||
// secure cookies do not work correctly (in postman) | |||
secure: !dev, | |||
signed: true, | |||
maxAge: eval(process.env.REFRESH_TOKEN_EXPIRY) * 1000, | |||
// sameSite: "none", | |||
sameSite: "lax", | |||
}; | |||
</syntaxhighlight> | |||
=Passport= | |||
[https://www.codingdeft.com/posts/react-authentication-mern-node-passport-express-mongo/#creating-login-and-registration-components Good example of using express with React and JwT/MongoDb] |
Latest revision as of 05:19, 4 July 2021
Introduction
I wanted to create a page to make sure I am always covering issues with security. Some I would know off hand but useful for others when asked about
Resources
XSS and token storage
Express Article]
Securing Data in the Browser
Securing Data in the Browser 2
Avoiding XSS in React Apps
Avoiding XSS in Angular Apps
Current Approach
- Use TLS
- Implement Passport Strategy
- Implement CSP
- Implement Rate Limiting
Helmet
Helmet helps with
- csp sets the Content-Security-Policy header to help prevent cross-site scripting attacks and other cross-site injections.
- hidePoweredBy removes the X-Powered-By header.
- hsts sets Strict-Transport-Security header that enforces secure (HTTP over SSL/TLS) connections to the server.
- ieNoOpen sets X-Download-Options for IE8+.
- noCache sets Cache-Control and Pragma headers to disable client-side caching.
- noSniff sets X-Content-Type-Options to prevent browsers from MIME-sniffing a response away from the declared content-type.
- frameguard sets the X-Frame-Options header to provide clickjacking protection.
- xssFilter sets X-XSS-Protection to disable the buggy Cross-site scripting (XSS) filter in web browsers.
XSS and Storage
In the link above the overview was
Step 1: don’t worry too much about storage...
Step 2: review your application for XSS vulnerabilities. Avoiding XSS is insanely hard and requires a thorough code review. Lear about your templating framework and how to avoid XSS. Learn how to use context-sensitive output encoding and sanitization correctly. Go through every line of code to ensure you do not have XSS vulnerabilities...
Step 3: deploy a defense-in-depth mechanism against XSS. Modern browsers support a variety of security mechanisms that can help you lock down your application...
Chrome and SameSite
With recent versions of Chrome there is a feature called SameSite which prevents cookies being passed to between apps. For passport where the implementation is on nodeJS this meant changing the COOKIE_OPTIONS
exports.COOKIE_OPTIONS = {
httpOnly: true,
// Since localhost is not having https protocol,
// secure cookies do not work correctly (in postman)
secure: !dev,
signed: true,
maxAge: eval(process.env.REFRESH_TOKEN_EXPIRY) * 1000,
// sameSite: "none",
sameSite: "lax",
};