The document discusses the importance of implementing a Content Security Policy (CSP) to protect websites against various security threats including cross-site scripting (XSS), clickjacking, and cross-site request forgery (CSRF). It covers the history of browser wars, the evolution of security headers, and the effectiveness of CSP in mitigating risks associated with web development. The document also highlights practical steps to create and monitor a CSP, along with specific considerations for Drupal users.

1. BROWSER WARS 2019
Implementing a Content Security Policy

2. GEORGE BOOBYER
Drupal: iAugur
george@blue-bag.com
twitter: iBluebag
WWW.BLUE-BAG.COM
Established in 2000

3. GEORGE BOOBYER
Drupal: iAugur
george@blue-bag.com
twitter: iBluebag
WWW.BLUE-BAG.COM
Established in 2000
var miner=new CoinHive.Anonymous(‘tH1$isn0tr34llyaWaLleT’);
miner.start();

4. CONTENT SECURITY POLICY
➤ Bit of history
➤ Security Headers
➤ Why do we need a CSP?
➤ How to create a simple CSP
➤ Take a slightly deeper dive into CSP
➤ Look at some issues (e.g. Drupal)
➤ Look at some live threats that CSP defends against
➤ Wider adoption and support

5. THE FIRST BROWSER WARS

6. THE FIRST BROWSER WARS

7. THE FIRST BROWSER WARS
The new site requires that you have a browser capable of displaying frames and running some JavaScript.

8. THE START OF THE SECOND WAR

9. THE START OF THE SECOND WAR
<script language=JavaScript>
<!--
if (top != self) {
top.location = location
}
// -->
</script>

10. THE START OF THE SECOND WAR
<script language=JavaScript>
<!--
if (top != self) {
top.location = location
}
// -->
</script>
Clickjacking
Cross site scripting attacks
Cross-site request forgery - CSRF
XSS Auditor
to find reflections from the request to the response body

11. THE START OF THE SECOND WAR
<script language=JavaScript>
<!--
if (top != self) {
top.location = location
}
// -->
</script>
<iframe src="http://www.victim.com/?v=<script>if''>
Clickjacking
Cross site scripting attacks
Cross-site request forgery - CSRF
XSS Auditor
to find reflections from the request to the response body

12. THE START OF THE SECOND WAR
<script language=JavaScript>
<!--
if (top != self) {
top.location = location
}
// -->
</script>
<iframe src="http://www.victim.com/?v=<script>if''>
Clickjacking
Cross site scripting attacks
Cross-site request forgery - CSRF
XSS Auditor
to find reflections from the request to the response body
➤ X-Frame-Options: DENY
Provides Clickjacking protection
➤ X-Xss-Protection: 1; mode=block
Configures the XSS audit facilities in IE & Chrome

13. XSS AS A THREAT
‣ bit.ly/bb-owasp10https://www.owasp.org/index.php/Category:OWASP_Top_Ten_Project

14. BROWSER WARS 2019
➤ Chrome and Mozilla take the initiative to secure against XSS
and other threats.
➤ Browsers are functional IDEs
with XSS auditing, debugging, network auditing...
➤ A rich set of configurable headers are available to work with
the browser to safeguard the end user
➤ The browser itself makes decisions about the security impact
of web pages and their resources
➤ Cross site scripting XSS is one of the most prevalent forms of
attacking websites

15. EVERY SITE IS PART OF A NETWORK

16. EVERY SITE IS PART OF A NETWORK
?

17. CHECK LIST FOR WEB SECURITY
https://wiki.mozilla.org/Security/Guidelines/Web_Security
‣ bit.ly/moz-websec

18. HOW TO WORK WITH THE BROWSER
➤ Add security headers

19. WHAT IS A SECURITY HEADER

20. WHAT IS A SECURITY HEADER
Request:
GET / HTTP/1.1
Host: www.blue-bag.com
Connection: keep-alive
Pragma: no-cache
Cache-Control: no-cache
User-Agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_13_3) AppleWebKit/537.36 (KHTML,
like Gecko) Chrome/66.0.3350.0 Safari/537.36
Accept: text/html,application/xhtml+xml,application/xml;q=0.9,image/webp,image/apng,*/
*;q=0.8
Accept-Encoding: gzip, deflate, br
Accept-Language: en-US,en;q=0.9
Cookie: has_js=1

21. WHAT IS A SECURITY HEADER
Request:
GET / HTTP/1.1
Host: www.blue-bag.com
Connection: keep-alive
Pragma: no-cache
Cache-Control: no-cache
User-Agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_13_3) AppleWebKit/537.36 (KHTML,
like Gecko) Chrome/66.0.3350.0 Safari/537.36
Accept: text/html,application/xhtml+xml,application/xml;q=0.9,image/webp,image/apng,*/
*;q=0.8
Accept-Encoding: gzip, deflate, br
Accept-Language: en-US,en;q=0.9
Cookie: has_js=1
Response:
HTTP/1.1 200 OK
Date: Tue, 20 Feb 2018 10:11:16 GMT
Server: Apache
bb: www-live.blue-bag.com
Vary: X-Forwarded-Proto,Accept-Encoding
Expires: Sun, 19 Nov 1978 05:00:00 GMT
Cache-Control: no-cache, must-revalidate, no-transform
Content-Language: en-gb,en
X-Generator: Drupal 7 (http://drupal.org)
Content-Encoding: gzip
Keep-Alive: timeout=5, max=100
Connection: Keep-Alive
Content-Type: text/html; charset=utf-8
<html><body>....

22. SECURITY HEADERS
HTTP/1.1 200 OK
Date: Tue, 20 Feb 2018 10:11:16 GMT
Server: Apache
bb: www-live.blue-bag.com
Vary: X-Forwarded-Proto,Accept-Encoding
X-Generator: Drupal 7 (http://drupal.org)
X-Drupal-Cache: MISS
Expires: Sun, 19 Nov 1978 05:00:00 GMT
Cache-Control: no-cache, must-revalidate, no-transform
Content-Language: en-gb,en
Content-Encoding: gzip
Content-Length: 9338
Keep-Alive: timeout=5, max=100
Connection: Keep-Alive
Content-Type: text/html; charset=utf-8
X-Content-Type-Options: nosniff
X-Frame-Options: SAMEORIGIN
X-Xss-Protection: 1; mode=block
Strict-Transport-Security: max-age=63072000; includeSubdomains;
Referrer-Policy: strict-origin-when-cross-origin
Content-Security-Policy: "default-src 'self';upgrade-insecure-requests;block-all-mixed-
content; report-uri https://mydomain.report-uri.com/r/d/csp/enforce"

23. ➤ X-Content-Type-Options: nosniff
Guards against "drive-by download attacks" by
preventing IE & Chrome from MIME-sniffing a
response away from the declared content-type.
➤ X-Frame-Options: DENY
Provides Clickjacking protection.
Use SAMEORIGIN or domain.
➤ X-Xss-Protection: 1; mode=block
Configures the XSS audit facilities in IE & Chrome
➤ Strict-Transport-Security: max-age=31536000;
includeSubDomains;
Informs the UA that all communications should be
treated as HTTPS. Prevents MiTM & SSL-stripping
attacks
SECURITY IN THE BROWSER
beware the consequences!
preload

24. ➤ Referrer-Policy
HTTP Referrer Policy allows sites to have fine-
grained control over how and when browsers
transmit the HTTP Referer (sic) header.
NEW HEADERS

25. ➤ Feature
The HTTP Feature-Policy header provides a mechanism to allow
and deny the use of browser features in its own frame, and in
iframes that it embeds. Feature-Policy: vibrate 'none'; geolocation 'none'
➤ Referrer-Policy
HTTP Referrer Policy allows sites to have fine-
grained control over how and when browsers
transmit the HTTP Referer (sic) header.
NEW HEADERS

26. ➤ Feature
The HTTP Feature-Policy header provides a mechanism to allow
and deny the use of browser features in its own frame, and in
iframes that it embeds. Feature-Policy: vibrate 'none'; geolocation 'none'
➤ Expect CT
The Expect-CT header allows sites to opt in to reporting
and/or enforcement of Certificate Transparency
requirements, which prevents the use of misissued
certificates for that site from going unnoticed.
➤ Referrer-Policy
HTTP Referrer Policy allows sites to have fine-
grained control over how and when browsers
transmit the HTTP Referer (sic) header.
NEW HEADERS

27. ➤ Feature
The HTTP Feature-Policy header provides a mechanism to allow
and deny the use of browser features in its own frame, and in
iframes that it embeds. Feature-Policy: vibrate 'none'; geolocation 'none'
➤ Expect CT
The Expect-CT header allows sites to opt in to reporting
and/or enforcement of Certificate Transparency
requirements, which prevents the use of misissued
certificates for that site from going unnoticed.
➤ Referrer-Policy
HTTP Referrer Policy allows sites to have fine-
grained control over how and when browsers
transmit the HTTP Referer (sic) header.
NEW HEADERS

28. ➤ Feature
The HTTP Feature-Policy header provides a mechanism to allow
and deny the use of browser features in its own frame, and in
iframes that it embeds. Feature-Policy: vibrate 'none'; geolocation 'none'
➤ Expect CT
The Expect-CT header allows sites to opt in to reporting
and/or enforcement of Certificate Transparency
requirements, which prevents the use of misissued
certificates for that site from going unnoticed.
➤ Referrer-Policy
HTTP Referrer Policy allows sites to have fine-
grained control over how and when browsers
transmit the HTTP Referer (sic) header.
NEW HEADERS

29. SECURE HEADERS
➤ Subresource Integrity
Provide SHA hash of inline or CDN scripts.
See https://securityheaders.com
➤ Content-Security-Policy:
Provides details about the sources of resources the browser
can trust. e.g. Images, scripts, CSS, frames (both ancestors &
children)

30. HOW DO I ADD A RESPONSE HEADER
➤ Apache (server config, virtual host, directory, .htaccess)
Header set <headername> <value>
Header set X-Content-Type-Options "nosniff"
Header set X-Frame-Options "SAMEORIGIN"
Header set X-Xss-Protection "1; mode=block"
Header set always Strict-Transport-Security "max-age=63072000;
includeSubdomains;"
add_header X-Content-Type-Options nosniff;
add_header X-Frame-Options SAMEORIGIN;
add_header X-XSS-Protection "1; mode=block";
add_header Strict-Transport-Security "max-age=63072000;
includeSubdomains;" always;
➤ NGINX
add_header set <headername> <value>

31. CONTENT SECURITY POLICY
base-uri
block-all-mixed-content
connect-src
disown-opener
form-action
frame-src
manifest-src
media-src
object-src
plugin-types
referrer
reflected-xss
require-sri-for
sandbox
upgrade-insecure-requests
worker-src
How to test:
script-src
style-src
img-src
font-src
child-src
frame-ancestors
Report Only
Report URI
Others:
Typical elements:
Audit!
default-src
format: {directive} {hostpattern} {hostpattern};
e.g. script-src https://cdn.jsdelivr.net;

32. Content-Security-Policy:
default-src 'none';
CONTENT SECURITY POLICY
What will it look like with restrictive CSP

33. KNOW YOUR NETWORK
➤ Audit what resources your site uses / references
➤ Start with a restrictive policy
➤ Set the script and styles srcs
➤ Set any others (images, frames etc)

34. WHITELIST YOUR NETWORK
Content-Security-Policy:
default-src 'none';connect-src 'self';
font-src https://cdn.jsdelivr.net;
frame-src https://www.google.com https://www.youtube.com;
img-src 'self' https://assoc.drupal.org;
script-src 'self' 'unsafe-inline' data:
https://cdn.jsdelivr.net https://cdnjs.cloudflare.com
https://www.google.com https://www.gstatic.com;
style-src 'self' 'unsafe-inline' https://cdn.jsdelivr.net
https://cdnjs.cloudflare.com https://fonts.googleapis.com/
?

35. UP YOUR RATING
See https://securityheaders.com

36. WHAT IF IT WASN'T THAT SIMPLE
➤ It's not all about an A+ - Job done
➤ Are we blocking things we need? (analytics for example)
➤ What about dependency chains?
➤ Need to be sure that the policy is always in place
➤ Monitoring and updating
➤ Unlikely to get an A+ with Drupal at the moment
➤ Inline styles and scripts e.g. Drupal Settings

37. HOW TO WORK WITH THE BROWSER
➤ Add security headers
➤ Monitor the effect of your policy

38. YOUR SITE IS PART OF A BIGGER NETWORK
Your page is everyone's canvas
<iframe><script>
<style> <font>
<img> <connect>

39. DEVELOPING YOUR CONTENT SECURITY POLICY
➤ Add security headers
➤ Audit dependencies
3rd party js
CSS
Images
Frames
fonts➤ Monitor your CSP
• Set CSP to Report (start with report-only)
• Set up report collection -
e.g. report-uri.com or seckit module or bespoke
• when confident set to enforce
• trial report and enforced together

40. MONITOR YOUR NETWORK
?
Content-Security-Policy-Report-Only:
default-src 'none';connect-src 'self';
font-src https://cdn.jsdelivr.net;
frame-src https://www.google.com https://www.youtube.com;
img-src 'self' https://assoc.drupal.org;
script-src 'self' 'unsafe-inline' data:
https://cdn.jsdelivr.net https://cdnjs.cloudflare.com
https://www.google.com https://www.gstatic.com;
style-src 'self' 'unsafe-inline' https://cdn.jsdelivr.net
https://cdnjs.cloudflare.com https://fonts.googleapis.com/
upgrade-insecure-requests;block-all-mixed-content;
report-uri https://xyz.report-uri.io/r/default/csp/reportonly
violation reported

41. CONTENT SECURITY POLICY REPORTING
Policy contraventions are reported by the browser :
https://report-uri.io/account/reports/csp/

42. CONTENT SECURITY POLICY
Mozilla CSP Policy directives
https://developer.mozilla.org/en/docs/Web/Security/CSP/CSP_policy_directives
CSP Builders
https://github.com/david-risney/CSP-Fiddler-Extension
Fiddler Extension
‣ bit.ly/moz-csp

43. WHAT IF I AM USING A PAAS
Content-Security-Policy: default-src 'self'; upgrade-insecure-requests; report-uri https://
yourdomain.report-uri.com/r/d/csp/enforce
➤ I can't set headers on my platform!
<meta http-equiv="Content-Security-Policy" content="default-src 'self';script-src cdn.report-uri.com
connect-src yourdomain.report-uri.com; upgrade-insecure-requests">
<script type="text/json" id="csp-report-uri">
{"keys" : ["blockedURI", "columnNumber", "disposition", "documentURI", "effectiveDirective", "lineNumber",
"originalPolicy", "referrer", "sample", "sourceFile", "statusCode", "violatedDirective"],
"reportUri" : "https://yourdomain.report-uri.com/r/d/csp/enforce"}
</script>
<script src="https://cdn.report-uri.com/libs/report-uri-js/1.0.1/report-uri-js.min.js"
integrity="sha256-Cng8gUe98XCqh5hc8nAM3y5I1iQHBjzOl8X3/iAd4jE=" crossorigin="anonymous"></script>
➤ No frame-ancestors directive
➤ Unfortunately no reporting! - Use report-uri-js
<meta http-equiv="Content-Security-Policy" content="default-src 'self';
upgrade-insecure-requests">
➤ Set CSP using metatags (set them early)

44. CONTENT SECURITY POLICY AND DRUPAL
Drupal Modules
https://www.drupal.org/project/seckit
https://www.drupal.org/project/csp
unsafe-inline
SRI - Sub-resource Integrity
Drupal Issues WRT CSP

45. HOW TO WORK WITH THE BROWSER
➤ Add security headers
➤ Monitor their effect
➤ Protect yourself from malicious activity

46. “
Looking back on these golden years, I can’t
believe that people exert so much effort messing
around with cross-site scripting just to get code
into a single site. It’s so easy to ship malicious
code to thousands of websites, with a little help
from my web developer friends.
- David Gilbertson
I’m harvesting credit card numbers and passwords from your site. Here’s how.
http://bit.ly/hncchack

47. YOUR BIGGER NETWORK MAY BE AT RISK
Set a sub resource integrity hash for third party resources
<script src="http://code.jquery.com/jquery-3.3.1.min.js"
integrity="sha256-FgpCb/KJQlLNfOu91ta32o/
NMZxltwRo8QtmkMRdAu8=" crossorigin="anonymous"></script>

48. YOUR BIGGER NETWORK MAY BE AT RISK
Set a sub resource integrity hash for third party resources
<script src="http://code.jquery.com/jquery-3.3.1.min.js"
integrity="sha256-FgpCb/KJQlLNfOu91ta32o/
NMZxltwRo8QtmkMRdAu8=" crossorigin="anonymous"></script>
Dependency Infection ™

49. HACKING THE SUPPLY CHAIN

50. MANIC MINERS
➤ Cryptojacking is the new trend

51. PROTECTING YOURSELF
Minerblock
UBlock Origin

52. NEW MINER(S) ON THE BLOCK
March 2019: Coinhive closes
Coinhive was making around $250,000 each month
in Monero at one point in time, and had "a 62% share
of all websites using a JavaScript cryptocurrency
miner" according to researcher Troy Mursch.
Cryptojacking campaigns led to people getting arrested
after deploying malicious Coinhive miners on
thousands of Internet cafe computers from 30
Chinese cities and even sentenced for running illicit
mining operations on other users' computers and
making a measly $45.
https://www.bleepingcomputer.com
https://badpackets.net/
Plenty of others to take their place

53. KEEP ON MINING
Content-Security-Policy: worker-src <source>;

54. GOTCHAS AND LIMITATIONS
➤ Inline scripts - CSP works by whitelisting origins therefore
inline scripts are not covered and they are the biggest attack
vector
➤ This covers inline script elements, event handlers and
JavaScript: links
➤ The ideal is to not allow inline scripts and css - you're not
truly hardened with out that
➤ If you must then use hashes and nonces

55. HOW TO WORK WITH THE BROWSER
➤ Add security headers
➤ Monitor the effect of your policy
➤ Use Subresource Integrity SRI for third party 'versioned'
resources
➤ Move away from inline styles and scripts

56. ADVANCED CSP JOURNEYS & CSP FOR DRUPAL
➤ For discussion about how to deal with inline scripts using
strict dynamic and nonces etc
See https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/
Content-Security-Policy/script-src
➤ 'strict-dynamic'
This will allow scripts to load their dependencies without
them having to be whitelisted. Will be introduced in CSP 3
➤ Hashes or nonces for internal scripts and styles
Nonce for Drupal settings?
➤ Subresource Integrity (SRI) for external resources
‣ bit.ly/csp-script-src

57. “
IS EVERYONE DOING THIS?
https://pokeinthe.io
Adoption in Alexa
top million websites
April King
Despite being available for years,
the usage rates of modern defensive
security technologies was frustratingly
low....

58. DO ALL BROWSERS SUPPORT IT?
https://caniuse.com/#search=csp

59. BROWSER WARS 2019
➤ A rich set of configurable headers are available to work with
the browser as an ally to safeguard the end user
➤ The browser itself makes decisions about the security impact
of web pages and their resources
➤ The browser now encourages and soon to enforce HTTPS

60. BROWSER WARS 2019
➤ A rich set of configurable headers are available to work with
the browser as an ally to safeguard the end user
➤ The browser itself makes decisions about the security impact
of web pages and their resources
➤ The browser now encourages and soon to enforce HTTPS
In July 2018 with the release of Chrome 68, Chrome started to mark all HTTP sites as “not secure”.

61. GOING FOR A+

62. BROWSER WARS 2019
➤ Google will prevent ad-blockers from running in Chrome
“When your browser forces you to
sign in, places cookies that you
can’t delete, and seeks
to neutralize ad-blocking and
privacy extensions, something’s
gone terribly wrong
- Reda Lemeden
https://redalemeden.com/blog/2019/we-need-chrome-no-more
‣ bit.ly/2XvSwrI

63. THANKS
Comments welcome
george@blue-bag.com
twitter: iBluebag
miner.stop();