Espen Henriksen
Front-end team lead
Oslo Market Solutions
espen_dev
esphen
What the CSP?!
A layman's introduction
Lightning talk
Hold on to your horses
CSP
-
Content-Security-Policy
- A header sent from the server
- Can also be a meta tag in the <head>
- Helps guard against XSS
- Supported in modern browsers
- Partial support in IE11
Directives
- CSP consists of a series of directives
- Each directive specifies allowed origins
- If a directive does not specify the origin as allowed, the resource is blocked by the browser
- Common values: 'self', 'unsafe-inline', hostnames
Directives
- default-src
- connect-src
- font-src
- frame-src
- img-src
- manifest-src
- media-src
- prefetch-src
- script-src
- style-src
- webrtc-src
- worker-src
- base-uri
- plugin-types
- sandbox
- disown-opener
- form-action
- frame-ancestors
- navigate-to
- block-all-mixed-content
- require-sri-for
- upgrade-insecure-requests
What if you get it wrong?!
- Revert, revert!
- report-uri / report-to reporting directives
- report-uri allows browsers to notify us that a resource has been blocked
- Sentry supportsbeing a report-uri target
What does it look like?
Example
// Allow current domain and trusted.com
Content-Security-Policy: default-src 'self' *.trusted.com
// Allow self and enable reporting
Content-Security-Policy: default-src 'self'; report-uri http://example.com/collector
// Only allow https
Content-Security-Policy: default-src https://example.com
Demo
Fin
What the CSP?!
By Eline H
What the CSP?!
- 26