Content Security Policies
A whole new way of securing your website that
no one knows about
Miriam Schwab, WCEU 2018
5x
'//tag.bounceexchange.com/1990/i.js
//assets.adobedtm.com/6372cf21ef88ee60bc2
977a4898dcb5c7945a212/satelliteLib-
fd2e38c2a1cccb723029dc3b607e196906c8bf93.
js
//cdn.yldbt.com/js/yieldbot.intent.js
//c.amazon-adsystem.com/aax2/apstag.js
//cdn.accelerator.arsdev.net/h/
https://pixel.condenastdigital.com/sparro
w.min.js
How web apps are compromised
76% of total exploits
XSSCross Site Scripting
evil.js
evil.js
Cookies
Web
storage
DOM
Hidden
form
inputs
Global
objects
Privileges
3 types of XSS
Persistent Originates in the database Comment injection
Reflected Originates in victim’s request
http://www.goodsite.com/search
?keyword=<script>...</script>
DOM-based
Payload injected into client-
side code (not server-side)
Executed after the page has loaded
OWASP Top Ten
With XSS, the user
is the victim, not
the application.
• Session hijacking
• Cookie theft
• Account takeover
• Redirecting traffic
• Stealing account credentials
• Displaying unwanted ads
• Virus/malware infections
• Keylogging
• Slower devices
• 100% CPU
• High energy consumption
• Battery drain
• Overheating
55%
8,500%
34,000%
Nov. 2017
CSP
fonts.google.comgoogle-analytics.commysite.com/img.jpgevilsite.com/evil.js
CSP
Browser support levels
CSP Syntax
Directives
Strings specifying type of resource,
taken from predefined list
• font-src
• frame-src
• img-src
• media-src
• object-src
• script-src
• style-src
Source expressions
Patterns describing one or more servers
that resources can be downloaded from
https://website.com
'none'
'self’
*
'unsafe-inline'
'unsafe-eval'
Content-Security-Policy: default-src 'self' https:;
Content-Security-Policy: script-src 'self’
https://www.google-analytics.com
Content-Security-Policy: font-src 'self’
https://fonts.googleapis.com
Content-Security-Policy: object-src ‘none‘
unsafe inline unsafe eval
Content-Security-Policy: script-src
‘unsafe-inline’ ’unsafe-eval’
Nonce
<script nonce=EDNnf03nceIOfn39fn3e9h3sdfa>
//inline code
</script>
Content-Security-Policy: script-src 'nonce-
EDNnf03nceIOfn39fn3e9h3sdfa'
Hashes
<script>alert('Hello, world.');</script>
Content-Security-Policy: script-src 'sha256-
qznLcsROx4GACP2dm0UCKCzCG-HiZ1guq6ZZDob_Tng='
Content-Security-Policy: upgrade-insecure-requests;
Content-Security-Policy-Report-Only: default-src
'none’;
script-src https://mysite.com;
report-uri /csp-reports
Subresource Integrity - SRI
<script src="https://example.com/example-framework.js"
integrity="sha384-
oqVuAfXRKap7fdgcCY5uykM6+R9GqQ8K/uxy9rx7HNQlGYl1kPzQho1w
x4JwY8wC" crossorigin="anonymous"></script>
Don’t use
X-XSS
Protection
X-Frame
Options
X-Content
Type Options
How to add CSPs to your site
functions.php
add_action('send_headers', function(){
// Prevent XSS Attack header("Content-Security-
Policy: default-src 'self';");
meta tag
<meta http-equiv="Content-Security-Policy"
content="default-src https://cdn.example.net;
child-src 'none'; object-src 'none'">
This can't be used for frame-ancestors, report-uri, or sandbox.
htaccess
Header set Content-Security-Policy ”
default-src 'self’;
script-src 'self' www.google-analytics.com
*.cloudflare.com;
img-src *.cloudflare.com "
Tools
Adoption
Resources
• https://developers.google.com/web/fundamentals/security/csp/
• https://scotthelme.co.uk/csp-cheat-sheet/
• https://scotthelme.co.uk/content-security-policy-an-introduction/ -
great intro tutorial with explanations of directives and what they do
• https://report-uri.com/home/tools
• https://content-security-policy.com/
• https://developer.mozilla.org/en-
US/docs/Web/HTTP/Headers/Content-Security-Policy
• https://www.troyhunt.com/
Media credits
• Browser icon: Icons made by Freepik from Flaticon is licensed by Creative Commons BY 3.0
• JS icons: Icons made by Vectors Market from Flaticon is licensed by Creative Commons BY 3.0
• CSS icon: Icons made by Freepik from Flaticon is licensed by Creative Commons BY 3.0
• Font icon: Icons made by Dave Gandy from Flaticon is licensed by Creative Commons BY 3.0
• Image icon: Icons made by Smashicons from Flaticon is licensed by Creative Commons BY 3.0
• Grumpy Sheep: https://pixabay.com/en/sheep-grumpy-animal-humor-funny-2825100/
• Frustrated filmmaker: https://pixabay.com/en/filmmaker-youtuber-screenwriter-2838945/
• Pile of bitcoin: https://pixabay.com/en/bitcoin-crypto-virtual-money-3024279/
• Snail: https://pixabay.com/en/snail-rainy-day-spring-animal-slow-3385348/
• Cryptomining guy: https://pixabay.com/en/bitcoin-mining-crypto-currency-2714192/
• Smiley icon: Icons made by Roundicons from Flaticon is licensed by Creative Commons BY 3.0
• Tools: https://pixabay.com/en/tools-vintage-woodworking-saw-1209764/
Thank you!!
Miriam Schwab | miriam@strattic.com

Content Security Policies: A whole new way of securing your website that no one knows about