A presentation at WordCamp London 2018 in in London, UK by Matt Brunt
@Brunty CSP: Let’s Break Stuff Content Security Policies Let’s Break Stuff
@Brunty CSP: Let’s Break Stuff Because you all totally care about this, right?! About me ▸ Senior Software Engineer at Viva IT (those folks in orange hoodies at some conferences & events you may have been to) ▸ @Brunty ▸ @PHPem ▸ mfyu.co.uk ▸ matt@mfyu.co.uk
@Brunty CSP: Let’s Break Stuff Blah blah … just get on with the talk Things I do ▸ Dungeon master for D&D campaigns ▸ Mentor, lead & teach apprentices & junior developers ▸ Run & organise PHP East Midlands ▸ Speak at user groups and conferences ▸ Break production sites with incorrectly configured content security policies
@Brunty CSP: Let’s Break Stuff Disclaimer: I don’t work with WordPress
@Brunty CSP: Let’s Break Stuff Oh good, finally we’re getting started A talk in 3 parts ▸ XSS ▸ CSP ▸ Break stuff
@Brunty CSP: Let’s Break Stuff The scary stuff
@Brunty CSP: Let’s Break Stuff First, some background What is Cross-Site-Scripting (XSS)? ▸ XSS enables an attacker to inject client-side scripts into non- malicious web pages viewed by other users ▸ In 2016 there was a 61% likelihood of a browser-based
vulnerability being found in a web application ▸ Of those browser based vulnerabilities, 86% were found to be XSS related ▸ That’s just over 52% of all web application vulnerabilities https://www.edgescan.com/assets/docs/reports/2016-edgescan-stats-report.pdf
@Brunty CSP: Let’s Break Stuff I mean, it’s just a joke vulnerability, right?! What can be done with XSS? ▸ Put pictures of cats in web pages ▸ alert(‘ ! ’); ▸ Rickroll a user ▸ Twitter self-retweeting tweet https://www.youtube.com/watch?v=zv0kZKC6GAM
▸ Samy worm https://en.wikipedia.org/wiki/Samy_(computer_worm)
@Brunty CSP: Let’s Break Stuff Well … maybe it’s not a joke vulnerability What can be done with XSS? ▸ Make modifications to the DOM ▸ Load additional scripts, resources, styles, images etc ▸ Access HTML5 APIs - webcam, microphone, geolocation ▸ Steal cookies (and therefore steal session cookies)
@Brunty CSP: Let’s Break Stuff
@Brunty CSP: Let’s Break Stuff It’s really not a joke vulnerability What can be done with XSS? https://www.wired.com/2008/03/hackers-assault-epilepsy-patients-via-computer/
@Brunty CSP: Let’s Break Stuff Ty p e s o f X S S a t t a c k Stored XSS (AKA Persistent or Type I) ▸ Occurs when input is stored - generally in a server-side database, but not always ▸ This could also be within a HTML5 database, thus never being sent to the server at all ▸ who.is was a site Rickrolled by a TXT record in the DNS of a website (yes, really)
@Brunty CSP: Let’s Break Stuff Ty p e s o f X S S a t t a c k Reflected XSS (AKA Non-persistent or Type II) ▸ Occurs when user input provided in the request is immediately returned - such as in an error message, search string etc ▸ Data is not stored, and in some instances, may not even reach the server (see the next type of XSS)
@Brunty CSP: Let’s Break Stuff Ty p e s o f X S S a t t a c k DOM-Based XSS (AKA Type-0) ▸ The entire flow of the attack takes place within the browser ▸ For example, if JavaScript in the site takes input, and uses something like document.write based on that input, it can be vulnerable to a DOM-based XSS attack
@Brunty CSP: Let’s Break Stuff Ty p e s o f X S S a t t a c k Self XSS ▸ Social-engineering form of XSS ▸ Requires the user to execute code in the browser ▸ Doing so via the console can’t be protected by a lot of methods ▸ Not considered a ‘true’ XSS attack due to requiring the user to execute the code
@Brunty CSP: Let’s Break Stuff
Title Text Body Level One Body Level Two Body Level Three @Brunty CSP: Let’s Break Stuff @Brunty CSP: Let’s Break Stuff Let’s fight back
@Brunty CSP: Let’s Break Stuff HTTP response header to help reduce XSS risks What is a CSP?
@Brunty CSP: Let’s Break Stuff It is not a silver bullet What is a CSP?
@Brunty CSP: Let’s Break Stuff It is an extra layer of security What is a CSP?
@Brunty CSP: Let’s Break Stuff It declares what resources are allowed to load How does a CSP work?
@Brunty CSP: Let’s Break Stuff Browser support
@Brunty CSP: Let’s Break Stuff Meh, it’s alright(ish) Sorry IE users
@Brunty CSP: Let’s Break Stuff CSP to the rescue! What can we protect? ▸ default-src ▸ script-src ▸ style-src ▸ img-src ▸ form-action ▸ update-insecure-requests
@Brunty CSP: Let’s Break Stuff Full reference: https://content-security-policy.com https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/Content-Security-Policy
@Brunty CSP: Let’s Break Stuff img-src * Allows any URL except data: blob: filesystem: schemes.
@Brunty CSP: Let’s Break Stuff object-src 'none' Don’t load resources from any source
@Brunty CSP: Let’s Break Stuff style-src ‘self' Allow loading from same scheme, host and port
@Brunty CSP: Let’s Break Stuff script-src 'unsafe-inline'
Allows use of inline source elements such as style attribute, onclick, or script tag bodies
@Brunty CSP: Let’s Break Stuff Don’t use unsafe-inline
@Brunty CSP: Let’s Break Stuff
<script nonce="$RANDOM">...</script>script-src 'self' 'nonce-$RANDOM'
@Brunty CSP: Let’s Break Stuff Content-Security-Policy: default-src 'none'; script- src 'self' https://*.google.com 'nonce-random123'; style-src 'self'; img-src 'self'; upgrade-insecure- requests; form-action 'self';
@Brunty CSP: Let’s Break Stuff I broke production with a bad CSP Learn from my mistakes
@Brunty CSP: Let’s Break Stuff Don’t do what I did
@Brunty CSP: Let’s Break Stuff Report-URI
@Brunty CSP: Let’s Break Stuff When a policy failure occurs, the browser sends a JSON payload to that URL
@Brunty CSP: Let’s Break Stuff { "csp-report": { "blocked-uri": "self", "document-uri": "https://mysite.com", "line-number": 1, "original-policy": "script-src 'self'", "script-sample": "try { for(var lastpass_iter=0; lastpass...", "source-file": "https://mysite.com", "violated-directive": "script-src 'self'" } }
@Brunty CSP: Let’s Break Stuff report-uri.io
@Brunty CSP: Let’s Break Stuff
@Brunty CSP: Let’s Break Stuff Report-only
@Brunty CSP: Let’s Break Stuff Content-Security-Policy-Report-Only: [policy]; report- uri https://app.report-uri.io/r/default/csp/reportOnly;
@Brunty CSP: Let’s Break Stuff Trial stuff before Enforcing
@Brunty CSP: Let’s Break Stuff There will be noise, lots of noise
@Brunty CSP: Let’s Break Stuff Ways to make dealing with a CSP easier Tips ▸ Have an easy and quick way to disable the CSP in production if required ▸ Better yet, have a way to switch it from enforced to report only so you can get violations reported to help you debug ▸ Add the CSP at an application level if you need a nonce
@Brunty CSP: Let’s Break Stuff Ways to make dealing with a CSP easier Multiple policies ▸ They complicate things ▸ For a resource to be allowed, it must be allowed by all policies declared (problematic if an enforced policy) ▸ I tend to avoid them where possible on enforced policies ▸ But with report-only mode they can be very useful to deploy and test multiple policies at the same time (as nothing breaks for the user)
@Brunty CSP: Let’s Break Stuff Ways to remove barriers in development Cryptographic nonces ▸ Don’t generate multiple nonces in the same request (but do
generate a new nonce on each separate request) ▸ If using a templating engine (such as twig) - add the nonce as a global so it’s available in every template by default ▸ Write a helper in your template engine to generate script tags with a nonce if it’s available
@Brunty CSP: Let’s Break Stuff The problem with CSPs and CMSs
@Brunty CSP: Let’s Break Stuff Plugins
@Brunty CSP: Let’s Break Stuff Inline scripts (without nonces) are the enemy
@Brunty CSP: Let’s Break Stuff Stop building dodgy plugins, avoid inline scripts & eval Troy Hunt
@Brunty CSP: Let’s Break Stuff [look at] making WordPress more CSP friendly Scott Helme
@Brunty CSP: Let’s Break Stuff Inline scripts (without nonces) are the enemy
@Brunty CSP: Let’s Break Stuff Demo time! Let’s break stuff
@Brunty CSP: Let’s Break Stuff @scott_helme He knows his stuff!
@Brunty CSP: Let’s Break Stuff @mr_goodwin He first introduced me to what a CSP is
@Brunty CSP: Let’s Break Stuff Homework time! Links & further reading ▸ https://www.owasp.org/index.php/Cross-site_Scripting_(XSS) ▸ https://content-security-policy.com ▸ https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/Content-Security-Policy ▸ https://report-uri.io ▸ https://scotthelme.co.uk/just-how-much-traffic-can-you-generate-using-csp/ ▸ https://www.edgescan.com/assets/docs/reports/2016-edgescan-stats-report.pdf ▸ http://theharmonyguy.com/oldsite/2011/04/21/recent-facebook-xss-attacks-show-increasing- sophistication/ ▸ https://github.com/Brunty/csp-demo
@Brunty CSP: Let’s Break Stuff Thank you
@Brunty CSP: Let’s Break Stuff Questions? @Brunty @PHPem mfyu.co.uk matt@mfyu.co.uk
Content Security Policies are another tool we should have in our security toolbelt to help protect users of our sites. In this session you’ll learn what they are, why they’re needed, how they work and the limitations on what they can & cannot do to protect users.
You’ll see a demo of attacks a CSP will block, you’ll see a site broken by a CSP, show what the different CSP directives & options will do and be introduced to some of the tools available to help with implementing a CSP on your sites!
The following resources were mentioned during the presentation or are useful additional information.
The website that's used to demonstrate CSP directives and implementation.
for free. You
can too.