SlideShare a Scribd company logo
Securing your EmberJS Application
Philippe  De  Ryck
Acknowledgements
Aad Versteden @    
About Me – Philippe De Ryck
2
§ Postdoctoral  Researcher  @  DistriNet (KU  Leuven)
§ Focus  on  (client-­side)  Web  security
§ Responsible  for  the  Web  Security  training  program
§ Dissemination  of  knowledge  and  research  results
§ Target  audiences  include  industry  and  researchers
§ Main  author  of  the  Primer  on  Client-­Side  Web  Security
§ 7  attacker  models,  broken  down  in  10  capabilities
§ 13  attacks  and  their  countermeasures
§ Overview  of  security  best  practices
iMinds-­DistriNet, KU Leuven
3
§ Headcount:
§ 10  professors
§ 65  researchers
§ Research  Domains
§ Secure  Software
§ Distributed  Software
§ Part  of  the  iMinds Security  Department
§ Together  with  COSIC  and  ICRI
§ Academic  and  industrial  collaboration  in  30+  national  and  
European  projects
https://distrinet.cs.kuleuven.be
Traditional Web Applications
4
POST newItem.phpDescription:
Deadline:
Add  to  List
Create  New  Task
Cooking
25/02/2015
25/02/2015
Overview
30/03/2015
Cooking
B-­day  party
Parse  request
Store  data
Retrieve  all  data
Generate  HTML
Send  response
Deadline Task
Add  New
<html>
…
</html>
Traditional Web Applications
5
POST newItem.phpDescription:
Deadline:
Add  to  List
Create  New  Task
Cooking
25/02/2015
25/02/2015
Overview
30/03/2015
Cooking
B-­day  party
Parse  request
Store  data
Retrieve  all  data
Generate  HTML
Send  response
Deadline Task
Add  New
<html>
…
</html>
Traditional Web Applications
6
GET sortBy?col=Task
Description:
Deadline:
Add  to  List
Create  New  Task
Cooking
25/02/2015
25/02/2015
Overview
30/03/2015
Cooking
B-­day  party
Parse  request
Store  data
Retrieve  all  data
Generate  HTML
Send  response
Deadline Task
Add  New
Sorting  API
25/02/2015
30/03/2015
Cooking
B-­day  party
Deadline Task
<table>
…
</table>
Single Page Applications
7
POST /items/
Description:
Deadline:
Add  to  List
Create  New  Task
Cooking
25/02/2015
Parse  request
Store  data
Send  response
25/02/2015
Overview
30/03/2015
Cooking
B-­day  party
Deadline Task
Add  New
25/02/2015
30/03/2015
Cooking
B-­day  party
Deadline Task
OK
Single Page Application Architecture
8
API
Client-­Enforced  
Security  Policies
Storage  Backend
Client-­Side  
Application
Server-­Controlled  
Security  Policies
Client-­Side  Data  
Storage
Session  Data
Static  Application  
Files
Default  Browser  
Security  Policies
API
Client-­Enforced  
Security  Policies
Storage  Backend
Static  Application  
Files
JavaScript  APIs
Single Page Application Architecture
9
API
Client-­Enforced  
Security  Policies
Storage  Backend
Client-­Side  
Application
Server-­Controlled  
Security  Policies
Client-­Side  Data  
Storage
Session  Data
Static  Application  
Files
Default  Browser  
Security  Policies
API
Client-­Enforced  
Security  Policies
Storage  Backend
Static  Application  
Files
JavaScript  APIs
Single Page Application Architecture
10
API
Client-­Enforced  
Security  Policies
Storage  Backend
Client-­Side  
Application
Server-­Controlled  
Security  Policies
Client-­Side  Data  
Storage
Session  Data
Static  Application  
Files
Default  Browser  
Security  Policies
API
Client-­Enforced  
Security  Policies
Storage  Backend
Static  Application  
Files
JavaScript  APIs
Single Page Application Architecture
11
API
Client-­Enforced  
Security  Policies
Storage  Backend
Client-­Side  
Application
Server-­Controlled  
Security  Policies
Client-­Side  Data  
Storage
Session  Data
Static  Application  
Files
Default  Browser  
Security  Policies
API
Client-­Enforced  
Security  Policies
Storage  Backend
Static  Application  
Files
JavaScript  APIs
Cookie  Security  flags
X-­Frame-­Options
Content  Security  Policy
Cross-­Origin  Resource  Sharing
HTTP  Strict  Transport  Security
HTTP  Public  Key  Pinning
Subresource Integrity
…
Threats against Modern Web Applications
12
API
Client-­Enforced  
Security  Policies
Storage  Backend
Client-­Side  
Application
Server-­Controlled  
Security  Policies
Client-­Side  Data  
Storage
Session  Data
Static  Application  
Files
Default  Browser  
Security  Policies
API
Client-­Enforced  
Security  Policies
Storage  Backend
Static  Application  
Files
JavaScript  APIs
Web Security has Become Complex
13
http://arstechnica.com/security/2015/04/no-­joke-­googles-­april-­fools-­prank-­inadvertently-­broke-­sites-­security/
Web Security has Become Complex
14
http://arstechnica.com/security/2015/04/match-­coms-­http-­only-­login-­page-­puts-­millions-­of-­passwords-­at-­risk/
Client-­Side Web Security
15
§ Browser  security  policies  govern  client-­side  behavior
§ Default  policies  apply  to  all  applications  running  in  the  browser
§ Same-­origin  policy  restricts  interactions  within  the  browser
§ Depended  upon  by  numerous  countermeasures
§ Modern  client-­side  security  policies  are  server-­driven
§ Tailored  towards  a  specific  web  application
§ Prevent  unauthorized  actions  within  the  browser
§ Often  preceded  by  autonomous  client-­side  countermeasures
The Web Security Landscape
16
Overview
17
§ Cross-­Site  Request  Forgery
§ Technicalities  and  common  countermeasures
§ Mitigating  CSRF  in  EmberJS applications
§ Cross-­Site  Scripting
§ What  is  it  and  why  should  I  care?
§ XSS  Protection  in  EmberJS
§ Content  Security  Policy
§ CSP,  a  second  line  of  defense  against  injection  attacks
§ Keeping  tabs  on  your  CSP  deployment
§ EmberJS and  CSP  in  practice
Overview
18
§ Cross-­Site  Request  Forgery
§ Technicalities  and  common  countermeasures
§ Mitigating  CSRF  in  EmberJS applications
§ Cross-­Site  Scripting
§ What  is  it  and  why  should  I  care?
§ XSS  Protection  in  EmberJS
§ Content  Security  Policy
§ CSP,  a  second  line  of  defense  against  injection  attacks
§ Keeping  tabs  on  your  CSP  deployment
§ EmberJS and  CSP  in  practice
Cross-­Site Request Forgery Illustrated
19
some-shop.com
hackedblog.com
Login as Philippe
Hello Philippe
Show orders
List of orders
Show latest blog post
Latest blog post
Change email address
Sure thing, Philippe
The Essence of CSRF
20
§ The  server  is  confused  about  the  intentions  of  the  user
§ Malicious  sites  can  trigger  unintended  requests  from  the  browser
§ Consequence  of  the  ambient  authority  carried  by  the  cookie
§ Common  vulnerability
§ Illustrated  by  cases  at  Google,  Facebook,  eBay,  …
§ Ranked  #8  on  OWASP  top  10  (2013)
§ Countermeasures  require  explicit  action  by  the  developer
§ Often  only  focus  on  POST  /  PUT  /  DELETE
CSRF Examples
21
http://news.softpedia.com/news/CSRF-­Vulnerability-­in-­eBay-­Allows-­Hackers-­to-­Hijack-­User-­Accounts-­Video-­383316.shtml
CSRF Examples
22https://threatpost.com/pharming-­attack-­targets-­home-­router-­dns-­settings/111326
http://arstechnica.com/security/2014/03/hackers-­hijack-­300000-­plus-­wireless-­routers-­make-­malicious-­changes/
CSRF Defense 1: HTML tokens
23
§ Hide  token  within  the  page,  and  check  upon  form  submission
§ Same-­Origin  Policy  keeps  this  token  out  of  reach  for  the  attacker
some-shop.com
hackedblog.com
Account details page
Account details
Change email address
Sure thing, Philippe
Show latest blog post
Latest blog post
Change email address
CSRF token sadness L
CSRF Defense 1: HTML tokens
24
§ Hide  token  within  the  page,  and  check  upon  form  submission
§ Same-­Origin  Policy  keeps  this  token  out  of  reach  for  the  attacker
<form action=“submit.php”>
<input type=“hidden” name=“token”
value=“qasfj8j12adsjadu2223” />
…
</form>
TOKEN-­BASED APPROACH
CSRF Defense 2: Origin Header
25
§ Check  the  origin  header  sent  by  the  browser
§ Automatically  added  to  state-­changing  requests  (POST,  PUT,  DELETE)
some-shop.com
hackedblog.com
Change email address
Origin: some-shop.com
Sure thing, Philippe
Show latest blog post
Latest blog post
Change email address
Origin: hackedblog.com
Stranger danger! L
CSRF Defense 3: Transparent Tokens
26
§ Transparent  token  stored  in  cookie,  checked  in  header
§ Security  depends  on  the  ability  to  read  the  cookie  from  JavaScript
some-shop.com
First request
Set-Cookie: session=…
Set-Cookie: CSRF-Token=123
Cookie: session=…
Cookie: CSRF-Token=123
Only  the  JS  code  on  the  page  can  
copy  cookie  value  into  header
X-CSRF-Token: 123
var csrf = require('csurf');
app.use(csrf());
app.use("/", function(req, res, next) {
res.cookie('XSRF-TOKEN', req.csrfToken());
next();
});
TRANSPARENT TOKENS
CSRF Defense 3: Transparent Tokens
27
§ Transparent  token  stored  in  cookie,  checked  in  header
§ Security  depends  on  the  ability  to  read  the  cookie  from  JavaScript
CSRF Defense 3: Transparent Tokens
28
§ Transparent  token  stored  in  cookie,  checked  in  header
§ Security  depends  on  the  ability  to  read  the  cookie  from  JavaScript
export default {
name: "CSRFProtection",
initialize() {
window.$.ajaxPrefilter(
function(options, originalOptions, xhr) {
if ( ! options.crossDomain ) {
var token = /XSRF-TOKEN=([^;]+)/.exec(document.cookie);
if(token) {
xhr.setRequestHeader('X-CSRF-Token', token[1]);
}
}
})}};
EMBERJS INITIALIZER
What with Authentication Tokens?
29
some-shop.com
hackedblog.com
Login as Philippe
Hello Philippe
Show orders
List of orders
Show latest blog post
Latest blog post
Change email address
Dude, where’s your token?
What with Authentication Tokens?
30
some-shop.com
hackedblog.com
Login as Philippe
Hello Philippe
Authorization: lakdjq9ajzj22
Show orders
Authorization: lakdjq9ajzj22
List of orders
Show latest blog post
Latest blog post
Change email address
Dude, where’s your token?
Overview
31
§ Cross-­Site  Request  Forgery
§ Technicalities  and  common  countermeasures
§ Mitigating  CSRF  in  EmberJS applications
§ Cross-­Site  Scripting
§ What  is  it  and  why  should  I  care?
§ XSS  Protection  in  EmberJS
§ Content  Security  Policy
§ CSP,  a  second  line  of  defense  against  injection  attacks
§ Keeping  tabs  on  your  CSP  deployment
§ EmberJS and  CSP  in  practice
Overview
32
§ Cross-­Site  Request  Forgery
§ Technicalities  and  common  countermeasures
§ Mitigating  CSRF  in  EmberJS applications
§ Cross-­Site  Scripting
§ What  is  it  and  why  should  I  care?
§ XSS  Protection  in  EmberJS
§ Content  Security  Policy
§ CSP,  a  second  line  of  defense  against  injection  attacks
§ Keeping  tabs  on  your  CSP  deployment
§ EmberJS and  CSP  in  practice
Cross-­Site Scripting (XSS)
33
§ Injection  of  attacker-­controlled  script  into  victim  application
§ Very  common  Web  vulnerability
§ Ranked  #3  in  OWASP’s  top  10  (2013)
§ Referred  to  as  the  buffer  overflow  of  the  Web
§ Why  is  XSS  such  a  big  deal?
§ Attacker  can  run  code  with  your  application’s  privileges
§ Full  access  to  page’s  contents  and  resources
§ Full  use  of  granted  permissions
§ Launch  platform  for  attack  escalation  (e.g.  malware)
Cross-­Site Scripting Example
34
some-shop.com
Show reviews
List of reviews
Add Review
OK
Attacker
Victim
Bleh is awesome!
<script>
alert(‘haha, NOT’)
</script>
Cross-­Site Scripting Payloads
35
§ XSS  payload  is  often  benign,  just  to  show  a  proof  of  exploit
Cross-­Site Scripting Payloads
36
§ XSS  payload  is  often  benign,  just  to  show  a  proof  of  exploit
§ XSS  payloads  are  only  limited  by  your  creativity
§ Session  hijacking
§ Defacement
§ Undermining  defenses  (e.g.  CSRF)
§ Keylogging
§ Network  scanning
§ …
§ Can  be  used  to  launch  a  more  elaborate  attack
Apache.org Compromise
37
1.  Report  bug  with  obscured  URL  
containing  reflected  XSS  attack
http://tinyurl.com/XXXXXXX
2.  Admin  opens  link,  
compromising  their  session
3.  Attacker  disable  notifications  
for  a  hosted  project
4.  Attacker  changes  upload  
path  to  location  that  can  
execute  JSP  files
5.  Attacker  added  new  bug  
reports  with  JSP  attachments
6.  Attacker  browses  and  copies  
filesystem through  JSP.  Installs  
backdoor  JSP  with  webserver
privileges
http://blogs.apache.org/infra/entry/apache_org_04_09_2010
Apache.org Compromise
38
7.  Attacker  installs  JAR  to  
collect  passwords  on  login
8.  Triggered  logins  by  sending  
out  password  reset  mails
9.  One  of  the  passwords  
matched  an  SSH  account  with  
full  sudo access
10.  The  accessible  machine  
had  user  home  folders,  with  
cached  subversion  credentials
11.  From  the  subversion  
machine,  privilege  escalation  
was  unsuccessful
http://blogs.apache.org/infra/entry/apache_org_04_09_2010
Different Types of XSS
39
§ Different  types  of  script  injection
§ Persistent:  stored  data  used  in  the  response
§ Reflected:  part  of  the  URI  used  in  the  response
§ DOM-­based:  data  used  by  client-­side  scripts
http://www.example.com/search?q=<script>alert(‘XSS’);</script>
<h1>You searched for<script>alert(‘XSS’);</script></h1>
REFLECTED XSS
Different Types of XSS
40
§ Different  types  of  script  injection
§ Persistent:  stored  data  used  in  the  response
§ Reflected:  part  of  the  URI  used  in  the  response
§ DOM-­based:  data  used  by  client-­side  scripts
http://www.example.com/search?name=<script>alert(‘XSS’);</script>
<script>
name = document.URL.substring(document.URL.indexOf("name=")+5);
document.write(“<h1>Welcome “ + name + “</h1>”);
</script>
<h1>Welcome <script>alert(‘XSS’);</script></h1>
DOM-­BASED XSS
Mitigating XSS
41
§ Secure  coding  practices
§ Do  not rely  on  simple  filters  (e.g.  removing  <,  >,  &,  “,  ‘)
§ Use  context-­sensitive  output  encoding
• HTML  body <h1>DATA</h1>
• HTML  attributes <div id=‘DATA’>
• Stylesheet  context body { background-color: DATA; }
• Script  context alert(“DATA”);
• URL  context <a href=“http://example.com?arg=DATA”>
§ Additional  layers  of  defense
§ Browsers  incorporate  reflective  XSS  filters
§ Content  Security  Policy  allows  servers  to  prevent  inline  script  execution
Overview
42
§ Cross-­Site  Request  Forgery
§ Technicalities  and  common  countermeasures
§ Mitigating  CSRF  in  EmberJS applications
§ Cross-­Site  Scripting
§ What  is  it  and  why  should  I  care?
§ XSS  Protection  in  EmberJS
§ Content  Security  Policy
§ CSP,  a  second  line  of  defense  against  injection  attacks
§ Keeping  tabs  on  your  CSP  deployment
§ EmberJS and  CSP  in  practice
XSS and JS MVC Frameworks
43
§ JS  MVC  frameworks  change  the  underlying  architecture
§ Highly  dynamic  front  ends,  delivered  as  static  application  files
§ Data-­oriented  back  ends
§ Difficult  to  match  to  traditional  XSS  countermeasures
§ Server  lacks  any  context  information  about  the  data
§ More  security  responsibilities  for  the  client-­side  application
§ Protect  against  injection  attacks  during  data  binding
Example: Allowing User-­Provided Images
44
<img src=”http://some-shop.com/coolcar.png" />
USER INPUT
<img src=”http://some-shop.com/coolcar.png" />
RENDERED HTML
{{input type=“text” value=x}}
<div>{{x}}</div>
EMBERJS TEMPLATE
Go to StackOverflow
45
And you Find a Solution
46
Example: Allowing User-­Provided Images
47
<img src=”http://some-shop.com/coolcar.png" />
USER INPUT
RENDERED HTML
{{input type=“text” value=x}}
<div>{{{x}}}</div>
EMBERJS TEMPLATE
Example: Allowing User-­Provided Images
48
<img src=”http://some-shop.com/coolcar.png"
onerror=“alert(1)” />
USER INPUT
GENERATED HTML
{{input type=“text” value=x}}
<div>{{{x}}}</div>
EMBERJS TEMPLATE
Example: Allowing User-­Provided Images
49
<img src=”http://some-shop.com/coolcar.png"
onerror=“alert(1)” />
USER INPUT
GENERATED HTML
{{input type=“text” value=x}}
<div>{{y}}</div>
y: function() { return Ember.String.htmlSafe(this.get(”x")); }.property(”x")
EMBERJS TEMPLATE &  CONTROLLER
Example: Allowing User-­Provided Images
50
http://some-shop.com/coolcar.png
USER INPUT
GENERATED HTML
{{input type=“text” value=x}}
<div><img src={{x}} /></div>
EMBERJS TEMPLATE
Sanitizing Data in EmberJS
51
§ No  built  in  capabilities  to  sanitize  data
§ Use  an  external  sanitization  library
§ DOMPurify is  fast  and  reliable
{{input type=“text” value=x}}
<div>{{sanitize-purify x}}</div>
EMBERJS TEMPLATE
Sanitizing Data in EmberJS
52
import Ember from 'ember';
import sanitizer from "../utils/dompurify";
export function sanitizePurify(params/*, hash*/) {
var text = params[0];
return Ember.String.htmlSafe(sanitizer.sanitize(text || ""))
}
export default Ember.Helper.helper(sanitizePurify);
EMBERJS SANITIZE HELPER
{{input type=“text” value=x}}
<div>{{sanitize-purify x}}</div>
EMBERJS TEMPLATE
Data Binding in EmberJS
53
§ {{  }}  produces  safe,  escaped  data
§ Use  this  to  avoid  shooting  yourself  in  the  foot
§ Use  in  the  correct  context,  and  EmberJS will  do  the  escaping
§ {{{  }}}  simply  injects  raw  data,  without  escaping
§ Don’t  use  this…  like  …  ever
§ Ember.String.htmlSafe(…)  marks  a  string  as  safe
§ Will  be  injected  without  escaping,  even  when  using  {{  }}
§ Only  use  when  you  write  the  static  html  code yourself
§ Use  a  sanitizer  if  you  need  a  selected  set  of  HTML  tags
§ Allows  markup  but  removes  dangerous  features
Overview
54
§ Cross-­Site  Request  Forgery
§ Technicalities  and  common  countermeasures
§ Mitigating  CSRF  in  EmberJS applications
§ Cross-­Site  Scripting
§ What  is  it  and  why  should  I  care?
§ XSS  Protection  in  EmberJS
§ Content  Security  Policy
§ CSP,  a  second  line  of  defense  against  injection  attacks
§ Keeping  tabs  on  your  CSP  deployment
§ EmberJS and  CSP  in  practice
Overview
55
§ Cross-­Site  Request  Forgery
§ Technicalities  and  common  countermeasures
§ Mitigating  CSRF  in  EmberJS applications
§ Cross-­Site  Scripting
§ What  is  it  and  why  should  I  care?
§ XSS  Protection  in  EmberJS
§ Content  Security  Policy
§ CSP,  a  second  line  of  defense  against  injection  attacks
§ Keeping  tabs  on  your  CSP  deployment
§ EmberJS and  CSP  in  practice
You Know Content Security Policy …
56
The Essence of CSP
57
§ CSP  reduces  the  harm  of  content  injection  vulnerabilities
§ By  telling  the  client  where  resources  should  be  loaded  from
§ By  disabling  “dangerous  features”  by  default
§ CSP  is  intended  as  a  second  line  of  defense
§ A  policy  consists  of  a  set  of  directives
§ Each  directive  controls  a  different  kind  of  resource
§ Policy  is  delivered  as  an  HTTP  header  by  the  server
§ Compatible  browsers  will  enforce  the  policy  on  the  response
Introducing CSP by Example
58
<h1>You searched for<script>alert(‘XSS’);</script></h1>
XSS  WITH INLINE SCRIPTS
<h1>You searched for<script src=“https://evil.com/hackme.js”></script></h1>
XSS  WITH REMOTE SCRIPTS
eval('alert("Your query string was '
+ unescape(document.location.search) //hello%22);alert(1+%22
+ '");');
XSS  WITH EVAL
Introducing CSP by Example
59
Content-Security-Policy:
default-src 'self';
EXAMPLE POLICY
Content-Security-Policy:
default-src 'self';
script-src ‘self’
https://cdnjs.cloudflare.com;
EXAMPLE POLICY
Content Security Policy
60
§ CSP  started  as  a  research  paper  by  the  Mozilla  team
§ Aim  to  give  administrator  control  over  appearance  of  site
§ Aim  to  give  users  some  confidence  where  data  is  sent  to
§ Even  in  the  presence  of  an  attacker  that  controls  content
§ By  default,  CSP  will:
§ Prevent  resources  from  being  loaded  from  non-­whitelisted  locations
§ The  use  of  eval()
§ Inline  content  from  being  executed
• Scripts  and  styles
Introducing CSP by Example
61
Content-Security-Policy:
default-src 'self';
script-src ‘self’
https://cdnjs.cloudflare.com;
style-src ‘self’
https://cdnjs.cloudflare.com/…/bootstrap.min.css;
EXAMPLE POLICY
CSP is the Security Policy of the Future
62
§ CSP  has  been  well  received,  and  evolved  quickly
§ Addition  of  plugin  types,  sandbox,  child  contexts,  form  destinations
§ Additional  spec  adds  UI  Security  Directives
§ Deprecates  X-­FRAME-­OPTIONS  header
§ Additional  features  to  overcome  implementation  hurdles
§ Widely  supported  by  browsers
§ Chrome  makes  CSP  mandatory  for  its  components
§ Browser  extensions  and  packaged  apps
A Quick Overview of CSP’s Directives
63
§ By  default,  CSP  will:
§ Prevent  resources  from  being  loaded  from  non-­whitelisted  locations
§ default-­src
§ Specifies  the  default  sources  of  all  content
§ Can  be  overwritten  with  more  specific  directives  for  each  type
§ img-­src,  style-­src,  font-­src,  child-­src,  media-­src,  object-­src
§ Specifies  the  sources  of  these  content  types
§ connect-­src,  form-­action
§ Specifices the  destination  of  these  actions
§ Sandbox  and  frame-­ancestors
Lifting Content Restrictions in CSP
64
§ script-­src and  style-­src support  the  lifting  of  restrictions
§ By  specifying  ‘unsafe-­inline’  and  ‘unsafe-­eval’
§ Not  recommended,  as  this  renders  protection  useless  
§ CSP  1.1  supports  nonces and  hashes
§ Inline  script  and  style  blocks  can  be  allowed
Content-Security-Policy:
script-src ‘self’ ‘nonce-RANDOM’;
EXAMPLE POLICY WITH A NONCE
<script nonce=“RANDOM”>…</script>
EXAMPLE USE OF A NONCE
Lifting Content Restrictions in CSP
65
§ script-­src and  style-­src support  the  lifting  of  restrictions
§ By  specifying  ‘unsafe-­inline’  and  ‘unsafe-­eval’
§ Not  recommended,  as  this  renders  protection  useless  
§ CSP  1.1  supports  nonces and  hashes
§ Inline  script  and  style  blocks  can  be  allowed
Content-Security-Policy:
script-src ‘self’ ‘nonce-a8qzj1r’;
EXAMPLE POLICY WITH A NONCE
<script nonce=“a8qzj1r”>…</script>
EXAMPLE USE OF A NONCE
Dynamically Applying Styles without unsafe-­inline
66
§ Sometimes,  styles  need  to  be  applied  dynamically  from  JS
§ Triggers  CSP  warnings,  requiring  the  use  of  unsafe-­inline for  styles
Dynamically Applying Styles without unsafe-­inline
67
§ Sometimes,  styles  need  to  be  applied  dynamically  from  JS
§ Triggers  CSP  warnings,  requiring  the  use  of  unsafe-­inline for  styles
§ Fixed  by  using  DOM  manipulation
§ Not  inline  style,  because  this  can  not  be  injected  directly
§ Would  require  a  script  injection  attack  first,  which  CSP  also  covers
CSP Examples
68
Goal: Load  no  external  resources
Content-Security-Policy:
default-src ‘self’;
EXAMPLE POLICY
Goal: Load  all  content  over  HTTPS
Content-Security-Policy:
default-src https: ‘unsafe-inline’ ‘unsafe-eval’;
EXAMPLE POLICY
Overview
69
§ Cross-­Site  Request  Forgery
§ Technicalities  and  common  countermeasures
§ Mitigating  CSRF  in  EmberJS applications
§ Cross-­Site  Scripting
§ What  is  it  and  why  should  I  care?
§ XSS  Protection  in  EmberJS
§ Content  Security  Policy
§ CSP,  a  second  line  of  defense  against  injection  attacks
§ Keeping  tabs  on  your  CSP  deployment
§ EmberJS and  CSP  in  practice
CSP Violation Reports
70
§ CSP  can  report  violations  back  to  the  resource  server
§ Allows  for  fine-­tuning  of  the  CSP  policy
§ Gives  insights  in  actual  attacks
§ Enabled  by  using  the  report-­uri directive
§ Points  to  a  handler  on  the  server  that  can  process  reports
Content-Security-Policy:
default-src 'self';
report-uri http://some-shop.com/csp-report.cgi
EXAMPLE POLICY
CSP Violation Report Example
71
{
"csp-report": {
"document-uri": "http://some-shop.com/page.html",
"referrer": "http://attacker.com/haxor.html",
"blocked-uri": "http://attacker.com/image.png",
"violated-directive": "default-src 'self'",
"effective-directive": "img-src",
"original-policy": "default-src 'self';
report-uri http://some-shop.com/csp-report.cgi"
}
}
EXAMPLE VIOLATION REPORT
CSP in Report-­Only Mode
72
§ CSP  can  be  deployed  in  reporting  mode
§ No  content  will  be  blocked
§ Warnings  will  be  generated  in  console
§ If  report-­uri is  specified,  error  reports  will  be  sent
§ Great  for  trying  out  policies  before  deploying  them
Content-Security-Policy-Report-Only:
default-src 'self';
report-uri http://some-shop.com/csp-report.cgi
REPORT-­ONLY POLICY
Overview
73
§ Cross-­Site  Request  Forgery
§ Technicalities  and  common  countermeasures
§ Mitigating  CSRF  in  EmberJS applications
§ Cross-­Site  Scripting
§ What  is  it  and  why  should  I  care?
§ XSS  Protection  in  EmberJS
§ Content  Security  Policy
§ CSP,  a  second  line  of  defense  against  injection  attacks
§ Keeping  tabs  on  your  CSP  deployment
§ EmberJS and  CSP  in  practice
So We’re Back to This …
74
EmberJS Enables CSP by Default
75
§ Taken  care  of  by  ember-­cli-­content-­security-­policy
§ Also  adds  unafe-­eval in  development  mode
§ Also  adds  live-­reload  requirements  (not  shown  here)
Content-Security-Policy-Report-Only:
default-src ‘none';
script-src ‘self’;
font-src ‘self’;
img-src ‘self’;
style-src ‘self’;
media-src ‘self’;
connect-src ‘self’ http://0.0.0.0:4200/csp-report;
report-uri http://0.0.0.0:4200/csp-report;
EMBERJS DEFAULT CSP  POLICY
Updating the EmberJS CSP Policy
76
§ CSP  policy  can  be  updated  through  environment.js
ENV.contentSecurityPolicyHeader = "Content-Security-Policy"
ENV.contentSecurityPolicy = {
'default-src': "'none'",
'script-src': "'self’ https://",
'font-src': "'self'",
'connect-src': "'self'",
'img-src': "'self'",
'style-src': "'self’ https://maxcdn.bootstrapcdn.com",
'media-src': "'self'”
}
UPDATING THE EMBERJS CSP  POLICY
Overview
77
§ Cross-­Site  Request  Forgery
§ Technicalities  and  common  countermeasures
§ Mitigating  CSRF  in  EmberJS applications
§ Cross-­Site  Scripting
§ What  is  it  and  why  should  I  care?
§ XSS  Protection  in  EmberJS
§ Content  Security  Policy
§ CSP,  a  second  line  of  defense  against  injection  attacks
§ Keeping  tabs  on  your  CSP  deployment
§ EmberJS and  CSP  in  practice
Overview
78
§ Cross-­Site  Request  Forgery
§ Technicalities  and  common  countermeasures
§ Mitigating  CSRF  in  EmberJS applications
§ Cross-­Site  Scripting
§ What  is  it  and  why  should  I  care?
§ XSS  Protection  in  EmberJS
§ Content  Security  Policy
§ CSP,  a  second  line  of  defense  against  injection  attacks
§ Keeping  tabs  on  your  CSP  deployment
§ EmberJS and  CSP  in  practice
Action Points for Tomorrow
79
1. Check  whether  your  APIs  are  vulnerable  to  CSRF  attacks
§ Enable  CSRF  mitigation  through  transparent  tokens
2. Make  sure  you  refrain  from  using  {{{  }}}
§ Let  EmberJS do  its  contextual  escaping
§ Use  a  sanitizer  where  necessary
3. Look  into  your  CSP  policy
§ Try  to  get  rid  of  the  unsafe-­inline and  unsafe-­eval statements
§ Make  the  policy  as  strict  as  possible
§ Share  your  findings!
Getting Single Page Application Security Right
80
Progressive Web Security Training Course
81
§ Hardening  your  Applications  for  a  Rocky  Future
§ 4  one-­day  hands-­on  sessions
§ We  cover  4  important  Web  security  topics
1. Why  simply  deploying  HTTPS  will  not  get  you  an  A+  grade
2. How  to  avoid  common  pitfalls  in  authentication  and  authorization  on  the  Web
3. Why  modern  security  technologies  will  eradicate  XSS
4. Four  new  browser  communication  mechanisms,  and  how  they  affect  your  
application
https://distrinet.cs.kuleuven.be/events/
Securing your EmberJS Application
Special  thanks  to  Aad Versteden for  
his  practical  EmberJS insights    
Acknowledgements
Icons  by  Visual  Pharm  (https://icons8.com)
Securing your EmberJS Application
Philippe  De  Ryck
philippe.deryck@cs.kuleuven.be
/in/philippederyck
https://distrinet.cs.kuleuven.be/events/websecurity/
@PhilippeDeRyck

More Related Content

What's hot

Introduction to Amazon Elastic File System (EFS)
Introduction to Amazon Elastic File System (EFS)Introduction to Amazon Elastic File System (EFS)
Introduction to Amazon Elastic File System (EFS)
Amazon Web Services
 
AWS Partner Data Analytics on AWS_Handout.pdf
AWS Partner Data Analytics on AWS_Handout.pdfAWS Partner Data Analytics on AWS_Handout.pdf
AWS Partner Data Analytics on AWS_Handout.pdf
SrinjoySaha12
 
Breaking the Monolith
Breaking the MonolithBreaking the Monolith
Breaking the Monolith
VMware Tanzu
 
Eks and fargate
Eks and fargateEks and fargate
Eks and fargate
Asaf Abres
 
Best Practices for Amazon S3 and Amazon Glacier (STG203-R2) - AWS re:Invent 2018
Best Practices for Amazon S3 and Amazon Glacier (STG203-R2) - AWS re:Invent 2018Best Practices for Amazon S3 and Amazon Glacier (STG203-R2) - AWS re:Invent 2018
Best Practices for Amazon S3 and Amazon Glacier (STG203-R2) - AWS re:Invent 2018
Amazon Web Services
 
Deep Dive on Amazon Elastic Container Service (ECS) and Fargate
Deep Dive on Amazon Elastic Container Service (ECS) and FargateDeep Dive on Amazon Elastic Container Service (ECS) and Fargate
Deep Dive on Amazon Elastic Container Service (ECS) and Fargate
Amazon Web Services
 
Dynamodb ppt
Dynamodb pptDynamodb ppt
Dynamodb ppt
Shellychoudhary1
 
Messaging in the AWS Cloud
Messaging in the AWS CloudMessaging in the AWS Cloud
Messaging in the AWS Cloud
Amazon Web Services
 
AWS Monitoring & Logging
AWS Monitoring & LoggingAWS Monitoring & Logging
AWS Monitoring & Logging
Jason Poley
 
Container Security
Container SecurityContainer Security
Container Security
Amazon Web Services
 
Creating Connector to Bridge the Worlds of Kafka and gRPC at Wework (Anoop Di...
Creating Connector to Bridge the Worlds of Kafka and gRPC at Wework (Anoop Di...Creating Connector to Bridge the Worlds of Kafka and gRPC at Wework (Anoop Di...
Creating Connector to Bridge the Worlds of Kafka and gRPC at Wework (Anoop Di...
confluent
 
Running Kubernetes on AWS.pdf
Running Kubernetes on AWS.pdfRunning Kubernetes on AWS.pdf
Running Kubernetes on AWS.pdf
Amazon Web Services
 
Cost optimization - Don't overspend on AWS
Cost optimization - Don't overspend on AWSCost optimization - Don't overspend on AWS
Cost optimization - Don't overspend on AWS
Sandeep Cashyap
 
DockerでCKANを動かそう
DockerでCKANを動かそうDockerでCKANを動かそう
DockerでCKANを動かそう
Takayuki Goto
 
Local Testing and Deployment Best Practices for Serverless Applications - AWS...
Local Testing and Deployment Best Practices for Serverless Applications - AWS...Local Testing and Deployment Best Practices for Serverless Applications - AWS...
Local Testing and Deployment Best Practices for Serverless Applications - AWS...
Amazon Web Services
 
Cost Optimization on AWS
Cost Optimization on AWSCost Optimization on AWS
Cost Optimization on AWS
Amazon Web Services
 
Introduction to AWS Amplify CLI
Introduction to AWS Amplify CLIIntroduction to AWS Amplify CLI
Introduction to AWS Amplify CLI
Amazon Web Services
 
20180220 AWS Black Belt Online Seminar - Amazon Container Services
20180220 AWS Black Belt Online Seminar - Amazon Container Services20180220 AWS Black Belt Online Seminar - Amazon Container Services
20180220 AWS Black Belt Online Seminar - Amazon Container Services
Amazon Web Services Japan
 
AWS Simple Storage Service (s3)
AWS Simple Storage Service (s3) AWS Simple Storage Service (s3)
AWS Simple Storage Service (s3)
zekeLabs Technologies
 
AWS Lake Formation Deep Dive
AWS Lake Formation Deep DiveAWS Lake Formation Deep Dive
AWS Lake Formation Deep Dive
Cobus Bernard
 

What's hot (20)

Introduction to Amazon Elastic File System (EFS)
Introduction to Amazon Elastic File System (EFS)Introduction to Amazon Elastic File System (EFS)
Introduction to Amazon Elastic File System (EFS)
 
AWS Partner Data Analytics on AWS_Handout.pdf
AWS Partner Data Analytics on AWS_Handout.pdfAWS Partner Data Analytics on AWS_Handout.pdf
AWS Partner Data Analytics on AWS_Handout.pdf
 
Breaking the Monolith
Breaking the MonolithBreaking the Monolith
Breaking the Monolith
 
Eks and fargate
Eks and fargateEks and fargate
Eks and fargate
 
Best Practices for Amazon S3 and Amazon Glacier (STG203-R2) - AWS re:Invent 2018
Best Practices for Amazon S3 and Amazon Glacier (STG203-R2) - AWS re:Invent 2018Best Practices for Amazon S3 and Amazon Glacier (STG203-R2) - AWS re:Invent 2018
Best Practices for Amazon S3 and Amazon Glacier (STG203-R2) - AWS re:Invent 2018
 
Deep Dive on Amazon Elastic Container Service (ECS) and Fargate
Deep Dive on Amazon Elastic Container Service (ECS) and FargateDeep Dive on Amazon Elastic Container Service (ECS) and Fargate
Deep Dive on Amazon Elastic Container Service (ECS) and Fargate
 
Dynamodb ppt
Dynamodb pptDynamodb ppt
Dynamodb ppt
 
Messaging in the AWS Cloud
Messaging in the AWS CloudMessaging in the AWS Cloud
Messaging in the AWS Cloud
 
AWS Monitoring & Logging
AWS Monitoring & LoggingAWS Monitoring & Logging
AWS Monitoring & Logging
 
Container Security
Container SecurityContainer Security
Container Security
 
Creating Connector to Bridge the Worlds of Kafka and gRPC at Wework (Anoop Di...
Creating Connector to Bridge the Worlds of Kafka and gRPC at Wework (Anoop Di...Creating Connector to Bridge the Worlds of Kafka and gRPC at Wework (Anoop Di...
Creating Connector to Bridge the Worlds of Kafka and gRPC at Wework (Anoop Di...
 
Running Kubernetes on AWS.pdf
Running Kubernetes on AWS.pdfRunning Kubernetes on AWS.pdf
Running Kubernetes on AWS.pdf
 
Cost optimization - Don't overspend on AWS
Cost optimization - Don't overspend on AWSCost optimization - Don't overspend on AWS
Cost optimization - Don't overspend on AWS
 
DockerでCKANを動かそう
DockerでCKANを動かそうDockerでCKANを動かそう
DockerでCKANを動かそう
 
Local Testing and Deployment Best Practices for Serverless Applications - AWS...
Local Testing and Deployment Best Practices for Serverless Applications - AWS...Local Testing and Deployment Best Practices for Serverless Applications - AWS...
Local Testing and Deployment Best Practices for Serverless Applications - AWS...
 
Cost Optimization on AWS
Cost Optimization on AWSCost Optimization on AWS
Cost Optimization on AWS
 
Introduction to AWS Amplify CLI
Introduction to AWS Amplify CLIIntroduction to AWS Amplify CLI
Introduction to AWS Amplify CLI
 
20180220 AWS Black Belt Online Seminar - Amazon Container Services
20180220 AWS Black Belt Online Seminar - Amazon Container Services20180220 AWS Black Belt Online Seminar - Amazon Container Services
20180220 AWS Black Belt Online Seminar - Amazon Container Services
 
AWS Simple Storage Service (s3)
AWS Simple Storage Service (s3) AWS Simple Storage Service (s3)
AWS Simple Storage Service (s3)
 
AWS Lake Formation Deep Dive
AWS Lake Formation Deep DiveAWS Lake Formation Deep Dive
AWS Lake Formation Deep Dive
 

Similar to Securing your EmberJS Application

Securing your AngularJS Application
Securing your AngularJS ApplicationSecuring your AngularJS Application
Securing your AngularJS Application
Philippe De Ryck
 
Owasp web application security trends
Owasp web application security trendsOwasp web application security trends
Owasp web application security trends
beched
 
[2.1] Web application Security Trends - Omar Ganiev
[2.1] Web application Security Trends - Omar Ganiev[2.1] Web application Security Trends - Omar Ganiev
[2.1] Web application Security Trends - Omar Ganiev
OWASP Russia
 
Why Traditional Web Security Technologies no Longer Suffice to Keep You Safe
Why Traditional Web Security Technologies no Longer Suffice to Keep You SafeWhy Traditional Web Security Technologies no Longer Suffice to Keep You Safe
Why Traditional Web Security Technologies no Longer Suffice to Keep You Safe
Philippe De Ryck
 
OWASP Serbia - A5 cross-site request forgery
OWASP Serbia - A5 cross-site request forgeryOWASP Serbia - A5 cross-site request forgery
OWASP Serbia - A5 cross-site request forgeryNikola Milosevic
 
Modern Web Security, Lazy but Mindful Like a Fox
Modern Web Security, Lazy but Mindful Like a FoxModern Web Security, Lazy but Mindful Like a Fox
Modern Web Security, Lazy but Mindful Like a Fox
C4Media
 
Cyber Security Workshop @SPIT- 3rd October 2015
Cyber Security Workshop @SPIT- 3rd October 2015Cyber Security Workshop @SPIT- 3rd October 2015
Cyber Security Workshop @SPIT- 3rd October 2015
Nilesh Sapariya
 
Web Application Scanning 101
Web Application Scanning 101Web Application Scanning 101
Web Application Scanning 101
Sasha Nunke
 
W3 conf hill-html5-security-realities
W3 conf hill-html5-security-realitiesW3 conf hill-html5-security-realities
W3 conf hill-html5-security-realitiesBrad Hill
 
W3 conf hill-html5-security-realities
W3 conf hill-html5-security-realitiesW3 conf hill-html5-security-realities
W3 conf hill-html5-security-realities
Brad Hill
 
Site Security Policy - Yahoo! Security Week
Site Security Policy - Yahoo! Security WeekSite Security Policy - Yahoo! Security Week
Site Security Policy - Yahoo! Security Weekguest9663eb
 
Cross Site Scripting - Mozilla Security Learning Center
Cross Site Scripting - Mozilla Security Learning CenterCross Site Scripting - Mozilla Security Learning Center
Cross Site Scripting - Mozilla Security Learning Center
Michael Coates
 
Browser Security – Issues and Best Practices1Outli
Browser Security – Issues and Best Practices1OutliBrowser Security – Issues and Best Practices1Outli
Browser Security – Issues and Best Practices1Outli
VannaSchrader3
 
Widespread security flaws in web application development 2015
Widespread security flaws in web  application development 2015Widespread security flaws in web  application development 2015
Widespread security flaws in web application development 2015
mahchiev
 
OWASP Top 10 Proactive Controls 2016 - PHP Québec August 2017
OWASP Top 10 Proactive Controls 2016 - PHP Québec August 2017OWASP Top 10 Proactive Controls 2016 - PHP Québec August 2017
OWASP Top 10 Proactive Controls 2016 - PHP Québec August 2017
Philippe Gamache
 
OWASP Top 10 Proactive Controls 2016 - NorthEast PHP 2017
OWASP Top 10 Proactive Controls 2016 - NorthEast PHP 2017 OWASP Top 10 Proactive Controls 2016 - NorthEast PHP 2017
OWASP Top 10 Proactive Controls 2016 - NorthEast PHP 2017
Philippe Gamache
 
They Ought to Know Better: Exploiting Security Gateways via Their Web Interfaces
They Ought to Know Better: Exploiting Security Gateways via Their Web InterfacesThey Ought to Know Better: Exploiting Security Gateways via Their Web Interfaces
They Ought to Know Better: Exploiting Security Gateways via Their Web Interfacesmichelemanzotti
 
Modern Web Application Defense
Modern Web Application DefenseModern Web Application Defense
Modern Web Application Defense
Frank Kim
 
Jan 2008 Allup
Jan 2008 AllupJan 2008 Allup
Jan 2008 Allup
llangit
 

Similar to Securing your EmberJS Application (20)

Securing your AngularJS Application
Securing your AngularJS ApplicationSecuring your AngularJS Application
Securing your AngularJS Application
 
Owasp web application security trends
Owasp web application security trendsOwasp web application security trends
Owasp web application security trends
 
[2.1] Web application Security Trends - Omar Ganiev
[2.1] Web application Security Trends - Omar Ganiev[2.1] Web application Security Trends - Omar Ganiev
[2.1] Web application Security Trends - Omar Ganiev
 
Web Security - CSP & Web Cryptography
Web Security - CSP & Web CryptographyWeb Security - CSP & Web Cryptography
Web Security - CSP & Web Cryptography
 
Why Traditional Web Security Technologies no Longer Suffice to Keep You Safe
Why Traditional Web Security Technologies no Longer Suffice to Keep You SafeWhy Traditional Web Security Technologies no Longer Suffice to Keep You Safe
Why Traditional Web Security Technologies no Longer Suffice to Keep You Safe
 
OWASP Serbia - A5 cross-site request forgery
OWASP Serbia - A5 cross-site request forgeryOWASP Serbia - A5 cross-site request forgery
OWASP Serbia - A5 cross-site request forgery
 
Modern Web Security, Lazy but Mindful Like a Fox
Modern Web Security, Lazy but Mindful Like a FoxModern Web Security, Lazy but Mindful Like a Fox
Modern Web Security, Lazy but Mindful Like a Fox
 
Cyber Security Workshop @SPIT- 3rd October 2015
Cyber Security Workshop @SPIT- 3rd October 2015Cyber Security Workshop @SPIT- 3rd October 2015
Cyber Security Workshop @SPIT- 3rd October 2015
 
Web Application Scanning 101
Web Application Scanning 101Web Application Scanning 101
Web Application Scanning 101
 
W3 conf hill-html5-security-realities
W3 conf hill-html5-security-realitiesW3 conf hill-html5-security-realities
W3 conf hill-html5-security-realities
 
W3 conf hill-html5-security-realities
W3 conf hill-html5-security-realitiesW3 conf hill-html5-security-realities
W3 conf hill-html5-security-realities
 
Site Security Policy - Yahoo! Security Week
Site Security Policy - Yahoo! Security WeekSite Security Policy - Yahoo! Security Week
Site Security Policy - Yahoo! Security Week
 
Cross Site Scripting - Mozilla Security Learning Center
Cross Site Scripting - Mozilla Security Learning CenterCross Site Scripting - Mozilla Security Learning Center
Cross Site Scripting - Mozilla Security Learning Center
 
Browser Security – Issues and Best Practices1Outli
Browser Security – Issues and Best Practices1OutliBrowser Security – Issues and Best Practices1Outli
Browser Security – Issues and Best Practices1Outli
 
Widespread security flaws in web application development 2015
Widespread security flaws in web  application development 2015Widespread security flaws in web  application development 2015
Widespread security flaws in web application development 2015
 
OWASP Top 10 Proactive Controls 2016 - PHP Québec August 2017
OWASP Top 10 Proactive Controls 2016 - PHP Québec August 2017OWASP Top 10 Proactive Controls 2016 - PHP Québec August 2017
OWASP Top 10 Proactive Controls 2016 - PHP Québec August 2017
 
OWASP Top 10 Proactive Controls 2016 - NorthEast PHP 2017
OWASP Top 10 Proactive Controls 2016 - NorthEast PHP 2017 OWASP Top 10 Proactive Controls 2016 - NorthEast PHP 2017
OWASP Top 10 Proactive Controls 2016 - NorthEast PHP 2017
 
They Ought to Know Better: Exploiting Security Gateways via Their Web Interfaces
They Ought to Know Better: Exploiting Security Gateways via Their Web InterfacesThey Ought to Know Better: Exploiting Security Gateways via Their Web Interfaces
They Ought to Know Better: Exploiting Security Gateways via Their Web Interfaces
 
Modern Web Application Defense
Modern Web Application DefenseModern Web Application Defense
Modern Web Application Defense
 
Jan 2008 Allup
Jan 2008 AllupJan 2008 Allup
Jan 2008 Allup
 

Recently uploaded

GraphRAG is All You need? LLM & Knowledge Graph
GraphRAG is All You need? LLM & Knowledge GraphGraphRAG is All You need? LLM & Knowledge Graph
GraphRAG is All You need? LLM & Knowledge Graph
Guy Korland
 
Elizabeth Buie - Older adults: Are we really designing for our future selves?
Elizabeth Buie - Older adults: Are we really designing for our future selves?Elizabeth Buie - Older adults: Are we really designing for our future selves?
Elizabeth Buie - Older adults: Are we really designing for our future selves?
Nexer Digital
 
Assuring Contact Center Experiences for Your Customers With ThousandEyes
Assuring Contact Center Experiences for Your Customers With ThousandEyesAssuring Contact Center Experiences for Your Customers With ThousandEyes
Assuring Contact Center Experiences for Your Customers With ThousandEyes
ThousandEyes
 
Encryption in Microsoft 365 - ExpertsLive Netherlands 2024
Encryption in Microsoft 365 - ExpertsLive Netherlands 2024Encryption in Microsoft 365 - ExpertsLive Netherlands 2024
Encryption in Microsoft 365 - ExpertsLive Netherlands 2024
Albert Hoitingh
 
Epistemic Interaction - tuning interfaces to provide information for AI support
Epistemic Interaction - tuning interfaces to provide information for AI supportEpistemic Interaction - tuning interfaces to provide information for AI support
Epistemic Interaction - tuning interfaces to provide information for AI support
Alan Dix
 
FIDO Alliance Osaka Seminar: Passkeys at Amazon.pdf
FIDO Alliance Osaka Seminar: Passkeys at Amazon.pdfFIDO Alliance Osaka Seminar: Passkeys at Amazon.pdf
FIDO Alliance Osaka Seminar: Passkeys at Amazon.pdf
FIDO Alliance
 
Elevating Tactical DDD Patterns Through Object Calisthenics
Elevating Tactical DDD Patterns Through Object CalisthenicsElevating Tactical DDD Patterns Through Object Calisthenics
Elevating Tactical DDD Patterns Through Object Calisthenics
Dorra BARTAGUIZ
 
GDG Cloud Southlake #33: Boule & Rebala: Effective AppSec in SDLC using Deplo...
GDG Cloud Southlake #33: Boule & Rebala: Effective AppSec in SDLC using Deplo...GDG Cloud Southlake #33: Boule & Rebala: Effective AppSec in SDLC using Deplo...
GDG Cloud Southlake #33: Boule & Rebala: Effective AppSec in SDLC using Deplo...
James Anderson
 
Securing your Kubernetes cluster_ a step-by-step guide to success !
Securing your Kubernetes cluster_ a step-by-step guide to success !Securing your Kubernetes cluster_ a step-by-step guide to success !
Securing your Kubernetes cluster_ a step-by-step guide to success !
KatiaHIMEUR1
 
UiPath Test Automation using UiPath Test Suite series, part 3
UiPath Test Automation using UiPath Test Suite series, part 3UiPath Test Automation using UiPath Test Suite series, part 3
UiPath Test Automation using UiPath Test Suite series, part 3
DianaGray10
 
Empowering NextGen Mobility via Large Action Model Infrastructure (LAMI): pav...
Empowering NextGen Mobility via Large Action Model Infrastructure (LAMI): pav...Empowering NextGen Mobility via Large Action Model Infrastructure (LAMI): pav...
Empowering NextGen Mobility via Large Action Model Infrastructure (LAMI): pav...
Thierry Lestable
 
A tale of scale & speed: How the US Navy is enabling software delivery from l...
A tale of scale & speed: How the US Navy is enabling software delivery from l...A tale of scale & speed: How the US Navy is enabling software delivery from l...
A tale of scale & speed: How the US Navy is enabling software delivery from l...
sonjaschweigert1
 
Quantum Computing: Current Landscape and the Future Role of APIs
Quantum Computing: Current Landscape and the Future Role of APIsQuantum Computing: Current Landscape and the Future Role of APIs
Quantum Computing: Current Landscape and the Future Role of APIs
Vlad Stirbu
 
DevOps and Testing slides at DASA Connect
DevOps and Testing slides at DASA ConnectDevOps and Testing slides at DASA Connect
DevOps and Testing slides at DASA Connect
Kari Kakkonen
 
Assure Contact Center Experiences for Your Customers With ThousandEyes
Assure Contact Center Experiences for Your Customers With ThousandEyesAssure Contact Center Experiences for Your Customers With ThousandEyes
Assure Contact Center Experiences for Your Customers With ThousandEyes
ThousandEyes
 
GenAISummit 2024 May 28 Sri Ambati Keynote: AGI Belongs to The Community in O...
GenAISummit 2024 May 28 Sri Ambati Keynote: AGI Belongs to The Community in O...GenAISummit 2024 May 28 Sri Ambati Keynote: AGI Belongs to The Community in O...
GenAISummit 2024 May 28 Sri Ambati Keynote: AGI Belongs to The Community in O...
Sri Ambati
 
By Design, not by Accident - Agile Venture Bolzano 2024
By Design, not by Accident - Agile Venture Bolzano 2024By Design, not by Accident - Agile Venture Bolzano 2024
By Design, not by Accident - Agile Venture Bolzano 2024
Pierluigi Pugliese
 
Monitoring Java Application Security with JDK Tools and JFR Events
Monitoring Java Application Security with JDK Tools and JFR EventsMonitoring Java Application Security with JDK Tools and JFR Events
Monitoring Java Application Security with JDK Tools and JFR Events
Ana-Maria Mihalceanu
 
FIDO Alliance Osaka Seminar: Overview.pdf
FIDO Alliance Osaka Seminar: Overview.pdfFIDO Alliance Osaka Seminar: Overview.pdf
FIDO Alliance Osaka Seminar: Overview.pdf
FIDO Alliance
 
Observability Concepts EVERY Developer Should Know -- DeveloperWeek Europe.pdf
Observability Concepts EVERY Developer Should Know -- DeveloperWeek Europe.pdfObservability Concepts EVERY Developer Should Know -- DeveloperWeek Europe.pdf
Observability Concepts EVERY Developer Should Know -- DeveloperWeek Europe.pdf
Paige Cruz
 

Recently uploaded (20)

GraphRAG is All You need? LLM & Knowledge Graph
GraphRAG is All You need? LLM & Knowledge GraphGraphRAG is All You need? LLM & Knowledge Graph
GraphRAG is All You need? LLM & Knowledge Graph
 
Elizabeth Buie - Older adults: Are we really designing for our future selves?
Elizabeth Buie - Older adults: Are we really designing for our future selves?Elizabeth Buie - Older adults: Are we really designing for our future selves?
Elizabeth Buie - Older adults: Are we really designing for our future selves?
 
Assuring Contact Center Experiences for Your Customers With ThousandEyes
Assuring Contact Center Experiences for Your Customers With ThousandEyesAssuring Contact Center Experiences for Your Customers With ThousandEyes
Assuring Contact Center Experiences for Your Customers With ThousandEyes
 
Encryption in Microsoft 365 - ExpertsLive Netherlands 2024
Encryption in Microsoft 365 - ExpertsLive Netherlands 2024Encryption in Microsoft 365 - ExpertsLive Netherlands 2024
Encryption in Microsoft 365 - ExpertsLive Netherlands 2024
 
Epistemic Interaction - tuning interfaces to provide information for AI support
Epistemic Interaction - tuning interfaces to provide information for AI supportEpistemic Interaction - tuning interfaces to provide information for AI support
Epistemic Interaction - tuning interfaces to provide information for AI support
 
FIDO Alliance Osaka Seminar: Passkeys at Amazon.pdf
FIDO Alliance Osaka Seminar: Passkeys at Amazon.pdfFIDO Alliance Osaka Seminar: Passkeys at Amazon.pdf
FIDO Alliance Osaka Seminar: Passkeys at Amazon.pdf
 
Elevating Tactical DDD Patterns Through Object Calisthenics
Elevating Tactical DDD Patterns Through Object CalisthenicsElevating Tactical DDD Patterns Through Object Calisthenics
Elevating Tactical DDD Patterns Through Object Calisthenics
 
GDG Cloud Southlake #33: Boule & Rebala: Effective AppSec in SDLC using Deplo...
GDG Cloud Southlake #33: Boule & Rebala: Effective AppSec in SDLC using Deplo...GDG Cloud Southlake #33: Boule & Rebala: Effective AppSec in SDLC using Deplo...
GDG Cloud Southlake #33: Boule & Rebala: Effective AppSec in SDLC using Deplo...
 
Securing your Kubernetes cluster_ a step-by-step guide to success !
Securing your Kubernetes cluster_ a step-by-step guide to success !Securing your Kubernetes cluster_ a step-by-step guide to success !
Securing your Kubernetes cluster_ a step-by-step guide to success !
 
UiPath Test Automation using UiPath Test Suite series, part 3
UiPath Test Automation using UiPath Test Suite series, part 3UiPath Test Automation using UiPath Test Suite series, part 3
UiPath Test Automation using UiPath Test Suite series, part 3
 
Empowering NextGen Mobility via Large Action Model Infrastructure (LAMI): pav...
Empowering NextGen Mobility via Large Action Model Infrastructure (LAMI): pav...Empowering NextGen Mobility via Large Action Model Infrastructure (LAMI): pav...
Empowering NextGen Mobility via Large Action Model Infrastructure (LAMI): pav...
 
A tale of scale & speed: How the US Navy is enabling software delivery from l...
A tale of scale & speed: How the US Navy is enabling software delivery from l...A tale of scale & speed: How the US Navy is enabling software delivery from l...
A tale of scale & speed: How the US Navy is enabling software delivery from l...
 
Quantum Computing: Current Landscape and the Future Role of APIs
Quantum Computing: Current Landscape and the Future Role of APIsQuantum Computing: Current Landscape and the Future Role of APIs
Quantum Computing: Current Landscape and the Future Role of APIs
 
DevOps and Testing slides at DASA Connect
DevOps and Testing slides at DASA ConnectDevOps and Testing slides at DASA Connect
DevOps and Testing slides at DASA Connect
 
Assure Contact Center Experiences for Your Customers With ThousandEyes
Assure Contact Center Experiences for Your Customers With ThousandEyesAssure Contact Center Experiences for Your Customers With ThousandEyes
Assure Contact Center Experiences for Your Customers With ThousandEyes
 
GenAISummit 2024 May 28 Sri Ambati Keynote: AGI Belongs to The Community in O...
GenAISummit 2024 May 28 Sri Ambati Keynote: AGI Belongs to The Community in O...GenAISummit 2024 May 28 Sri Ambati Keynote: AGI Belongs to The Community in O...
GenAISummit 2024 May 28 Sri Ambati Keynote: AGI Belongs to The Community in O...
 
By Design, not by Accident - Agile Venture Bolzano 2024
By Design, not by Accident - Agile Venture Bolzano 2024By Design, not by Accident - Agile Venture Bolzano 2024
By Design, not by Accident - Agile Venture Bolzano 2024
 
Monitoring Java Application Security with JDK Tools and JFR Events
Monitoring Java Application Security with JDK Tools and JFR EventsMonitoring Java Application Security with JDK Tools and JFR Events
Monitoring Java Application Security with JDK Tools and JFR Events
 
FIDO Alliance Osaka Seminar: Overview.pdf
FIDO Alliance Osaka Seminar: Overview.pdfFIDO Alliance Osaka Seminar: Overview.pdf
FIDO Alliance Osaka Seminar: Overview.pdf
 
Observability Concepts EVERY Developer Should Know -- DeveloperWeek Europe.pdf
Observability Concepts EVERY Developer Should Know -- DeveloperWeek Europe.pdfObservability Concepts EVERY Developer Should Know -- DeveloperWeek Europe.pdf
Observability Concepts EVERY Developer Should Know -- DeveloperWeek Europe.pdf
 

Securing your EmberJS Application

  • 1. Securing your EmberJS Application Philippe  De  Ryck Acknowledgements Aad Versteden @    
  • 2. About Me – Philippe De Ryck 2 § Postdoctoral  Researcher  @  DistriNet (KU  Leuven) § Focus  on  (client-­side)  Web  security § Responsible  for  the  Web  Security  training  program § Dissemination  of  knowledge  and  research  results § Target  audiences  include  industry  and  researchers § Main  author  of  the  Primer  on  Client-­Side  Web  Security § 7  attacker  models,  broken  down  in  10  capabilities § 13  attacks  and  their  countermeasures § Overview  of  security  best  practices
  • 3. iMinds-­DistriNet, KU Leuven 3 § Headcount: § 10  professors § 65  researchers § Research  Domains § Secure  Software § Distributed  Software § Part  of  the  iMinds Security  Department § Together  with  COSIC  and  ICRI § Academic  and  industrial  collaboration  in  30+  national  and   European  projects https://distrinet.cs.kuleuven.be
  • 4. Traditional Web Applications 4 POST newItem.phpDescription: Deadline: Add  to  List Create  New  Task Cooking 25/02/2015 25/02/2015 Overview 30/03/2015 Cooking B-­day  party Parse  request Store  data Retrieve  all  data Generate  HTML Send  response Deadline Task Add  New <html> … </html>
  • 5. Traditional Web Applications 5 POST newItem.phpDescription: Deadline: Add  to  List Create  New  Task Cooking 25/02/2015 25/02/2015 Overview 30/03/2015 Cooking B-­day  party Parse  request Store  data Retrieve  all  data Generate  HTML Send  response Deadline Task Add  New <html> … </html>
  • 6. Traditional Web Applications 6 GET sortBy?col=Task Description: Deadline: Add  to  List Create  New  Task Cooking 25/02/2015 25/02/2015 Overview 30/03/2015 Cooking B-­day  party Parse  request Store  data Retrieve  all  data Generate  HTML Send  response Deadline Task Add  New Sorting  API 25/02/2015 30/03/2015 Cooking B-­day  party Deadline Task <table> … </table>
  • 7. Single Page Applications 7 POST /items/ Description: Deadline: Add  to  List Create  New  Task Cooking 25/02/2015 Parse  request Store  data Send  response 25/02/2015 Overview 30/03/2015 Cooking B-­day  party Deadline Task Add  New 25/02/2015 30/03/2015 Cooking B-­day  party Deadline Task OK
  • 8. Single Page Application Architecture 8 API Client-­Enforced   Security  Policies Storage  Backend Client-­Side   Application Server-­Controlled   Security  Policies Client-­Side  Data   Storage Session  Data Static  Application   Files Default  Browser   Security  Policies API Client-­Enforced   Security  Policies Storage  Backend Static  Application   Files JavaScript  APIs
  • 9. Single Page Application Architecture 9 API Client-­Enforced   Security  Policies Storage  Backend Client-­Side   Application Server-­Controlled   Security  Policies Client-­Side  Data   Storage Session  Data Static  Application   Files Default  Browser   Security  Policies API Client-­Enforced   Security  Policies Storage  Backend Static  Application   Files JavaScript  APIs
  • 10. Single Page Application Architecture 10 API Client-­Enforced   Security  Policies Storage  Backend Client-­Side   Application Server-­Controlled   Security  Policies Client-­Side  Data   Storage Session  Data Static  Application   Files Default  Browser   Security  Policies API Client-­Enforced   Security  Policies Storage  Backend Static  Application   Files JavaScript  APIs
  • 11. Single Page Application Architecture 11 API Client-­Enforced   Security  Policies Storage  Backend Client-­Side   Application Server-­Controlled   Security  Policies Client-­Side  Data   Storage Session  Data Static  Application   Files Default  Browser   Security  Policies API Client-­Enforced   Security  Policies Storage  Backend Static  Application   Files JavaScript  APIs Cookie  Security  flags X-­Frame-­Options Content  Security  Policy Cross-­Origin  Resource  Sharing HTTP  Strict  Transport  Security HTTP  Public  Key  Pinning Subresource Integrity …
  • 12. Threats against Modern Web Applications 12 API Client-­Enforced   Security  Policies Storage  Backend Client-­Side   Application Server-­Controlled   Security  Policies Client-­Side  Data   Storage Session  Data Static  Application   Files Default  Browser   Security  Policies API Client-­Enforced   Security  Policies Storage  Backend Static  Application   Files JavaScript  APIs
  • 13. Web Security has Become Complex 13 http://arstechnica.com/security/2015/04/no-­joke-­googles-­april-­fools-­prank-­inadvertently-­broke-­sites-­security/
  • 14. Web Security has Become Complex 14 http://arstechnica.com/security/2015/04/match-­coms-­http-­only-­login-­page-­puts-­millions-­of-­passwords-­at-­risk/
  • 15. Client-­Side Web Security 15 § Browser  security  policies  govern  client-­side  behavior § Default  policies  apply  to  all  applications  running  in  the  browser § Same-­origin  policy  restricts  interactions  within  the  browser § Depended  upon  by  numerous  countermeasures § Modern  client-­side  security  policies  are  server-­driven § Tailored  towards  a  specific  web  application § Prevent  unauthorized  actions  within  the  browser § Often  preceded  by  autonomous  client-­side  countermeasures
  • 16. The Web Security Landscape 16
  • 17. Overview 17 § Cross-­Site  Request  Forgery § Technicalities  and  common  countermeasures § Mitigating  CSRF  in  EmberJS applications § Cross-­Site  Scripting § What  is  it  and  why  should  I  care? § XSS  Protection  in  EmberJS § Content  Security  Policy § CSP,  a  second  line  of  defense  against  injection  attacks § Keeping  tabs  on  your  CSP  deployment § EmberJS and  CSP  in  practice
  • 18. Overview 18 § Cross-­Site  Request  Forgery § Technicalities  and  common  countermeasures § Mitigating  CSRF  in  EmberJS applications § Cross-­Site  Scripting § What  is  it  and  why  should  I  care? § XSS  Protection  in  EmberJS § Content  Security  Policy § CSP,  a  second  line  of  defense  against  injection  attacks § Keeping  tabs  on  your  CSP  deployment § EmberJS and  CSP  in  practice
  • 19. Cross-­Site Request Forgery Illustrated 19 some-shop.com hackedblog.com Login as Philippe Hello Philippe Show orders List of orders Show latest blog post Latest blog post Change email address Sure thing, Philippe
  • 20. The Essence of CSRF 20 § The  server  is  confused  about  the  intentions  of  the  user § Malicious  sites  can  trigger  unintended  requests  from  the  browser § Consequence  of  the  ambient  authority  carried  by  the  cookie § Common  vulnerability § Illustrated  by  cases  at  Google,  Facebook,  eBay,  … § Ranked  #8  on  OWASP  top  10  (2013) § Countermeasures  require  explicit  action  by  the  developer § Often  only  focus  on  POST  /  PUT  /  DELETE
  • 23. CSRF Defense 1: HTML tokens 23 § Hide  token  within  the  page,  and  check  upon  form  submission § Same-­Origin  Policy  keeps  this  token  out  of  reach  for  the  attacker some-shop.com hackedblog.com Account details page Account details Change email address Sure thing, Philippe Show latest blog post Latest blog post Change email address CSRF token sadness L
  • 24. CSRF Defense 1: HTML tokens 24 § Hide  token  within  the  page,  and  check  upon  form  submission § Same-­Origin  Policy  keeps  this  token  out  of  reach  for  the  attacker <form action=“submit.php”> <input type=“hidden” name=“token” value=“qasfj8j12adsjadu2223” /> … </form> TOKEN-­BASED APPROACH
  • 25. CSRF Defense 2: Origin Header 25 § Check  the  origin  header  sent  by  the  browser § Automatically  added  to  state-­changing  requests  (POST,  PUT,  DELETE) some-shop.com hackedblog.com Change email address Origin: some-shop.com Sure thing, Philippe Show latest blog post Latest blog post Change email address Origin: hackedblog.com Stranger danger! L
  • 26. CSRF Defense 3: Transparent Tokens 26 § Transparent  token  stored  in  cookie,  checked  in  header § Security  depends  on  the  ability  to  read  the  cookie  from  JavaScript some-shop.com First request Set-Cookie: session=… Set-Cookie: CSRF-Token=123 Cookie: session=… Cookie: CSRF-Token=123 Only  the  JS  code  on  the  page  can   copy  cookie  value  into  header X-CSRF-Token: 123
  • 27. var csrf = require('csurf'); app.use(csrf()); app.use("/", function(req, res, next) { res.cookie('XSRF-TOKEN', req.csrfToken()); next(); }); TRANSPARENT TOKENS CSRF Defense 3: Transparent Tokens 27 § Transparent  token  stored  in  cookie,  checked  in  header § Security  depends  on  the  ability  to  read  the  cookie  from  JavaScript
  • 28. CSRF Defense 3: Transparent Tokens 28 § Transparent  token  stored  in  cookie,  checked  in  header § Security  depends  on  the  ability  to  read  the  cookie  from  JavaScript export default { name: "CSRFProtection", initialize() { window.$.ajaxPrefilter( function(options, originalOptions, xhr) { if ( ! options.crossDomain ) { var token = /XSRF-TOKEN=([^;]+)/.exec(document.cookie); if(token) { xhr.setRequestHeader('X-CSRF-Token', token[1]); } } })}}; EMBERJS INITIALIZER
  • 29. What with Authentication Tokens? 29 some-shop.com hackedblog.com Login as Philippe Hello Philippe Show orders List of orders Show latest blog post Latest blog post Change email address Dude, where’s your token?
  • 30. What with Authentication Tokens? 30 some-shop.com hackedblog.com Login as Philippe Hello Philippe Authorization: lakdjq9ajzj22 Show orders Authorization: lakdjq9ajzj22 List of orders Show latest blog post Latest blog post Change email address Dude, where’s your token?
  • 31. Overview 31 § Cross-­Site  Request  Forgery § Technicalities  and  common  countermeasures § Mitigating  CSRF  in  EmberJS applications § Cross-­Site  Scripting § What  is  it  and  why  should  I  care? § XSS  Protection  in  EmberJS § Content  Security  Policy § CSP,  a  second  line  of  defense  against  injection  attacks § Keeping  tabs  on  your  CSP  deployment § EmberJS and  CSP  in  practice
  • 32. Overview 32 § Cross-­Site  Request  Forgery § Technicalities  and  common  countermeasures § Mitigating  CSRF  in  EmberJS applications § Cross-­Site  Scripting § What  is  it  and  why  should  I  care? § XSS  Protection  in  EmberJS § Content  Security  Policy § CSP,  a  second  line  of  defense  against  injection  attacks § Keeping  tabs  on  your  CSP  deployment § EmberJS and  CSP  in  practice
  • 33. Cross-­Site Scripting (XSS) 33 § Injection  of  attacker-­controlled  script  into  victim  application § Very  common  Web  vulnerability § Ranked  #3  in  OWASP’s  top  10  (2013) § Referred  to  as  the  buffer  overflow  of  the  Web § Why  is  XSS  such  a  big  deal? § Attacker  can  run  code  with  your  application’s  privileges § Full  access  to  page’s  contents  and  resources § Full  use  of  granted  permissions § Launch  platform  for  attack  escalation  (e.g.  malware)
  • 34. Cross-­Site Scripting Example 34 some-shop.com Show reviews List of reviews Add Review OK Attacker Victim Bleh is awesome! <script> alert(‘haha, NOT’) </script>
  • 35. Cross-­Site Scripting Payloads 35 § XSS  payload  is  often  benign,  just  to  show  a  proof  of  exploit
  • 36. Cross-­Site Scripting Payloads 36 § XSS  payload  is  often  benign,  just  to  show  a  proof  of  exploit § XSS  payloads  are  only  limited  by  your  creativity § Session  hijacking § Defacement § Undermining  defenses  (e.g.  CSRF) § Keylogging § Network  scanning § … § Can  be  used  to  launch  a  more  elaborate  attack
  • 37. Apache.org Compromise 37 1.  Report  bug  with  obscured  URL   containing  reflected  XSS  attack http://tinyurl.com/XXXXXXX 2.  Admin  opens  link,   compromising  their  session 3.  Attacker  disable  notifications   for  a  hosted  project 4.  Attacker  changes  upload   path  to  location  that  can   execute  JSP  files 5.  Attacker  added  new  bug   reports  with  JSP  attachments 6.  Attacker  browses  and  copies   filesystem through  JSP.  Installs   backdoor  JSP  with  webserver privileges http://blogs.apache.org/infra/entry/apache_org_04_09_2010
  • 38. Apache.org Compromise 38 7.  Attacker  installs  JAR  to   collect  passwords  on  login 8.  Triggered  logins  by  sending   out  password  reset  mails 9.  One  of  the  passwords   matched  an  SSH  account  with   full  sudo access 10.  The  accessible  machine   had  user  home  folders,  with   cached  subversion  credentials 11.  From  the  subversion   machine,  privilege  escalation   was  unsuccessful http://blogs.apache.org/infra/entry/apache_org_04_09_2010
  • 39. Different Types of XSS 39 § Different  types  of  script  injection § Persistent:  stored  data  used  in  the  response § Reflected:  part  of  the  URI  used  in  the  response § DOM-­based:  data  used  by  client-­side  scripts http://www.example.com/search?q=<script>alert(‘XSS’);</script> <h1>You searched for<script>alert(‘XSS’);</script></h1> REFLECTED XSS
  • 40. Different Types of XSS 40 § Different  types  of  script  injection § Persistent:  stored  data  used  in  the  response § Reflected:  part  of  the  URI  used  in  the  response § DOM-­based:  data  used  by  client-­side  scripts http://www.example.com/search?name=<script>alert(‘XSS’);</script> <script> name = document.URL.substring(document.URL.indexOf("name=")+5); document.write(“<h1>Welcome “ + name + “</h1>”); </script> <h1>Welcome <script>alert(‘XSS’);</script></h1> DOM-­BASED XSS
  • 41. Mitigating XSS 41 § Secure  coding  practices § Do  not rely  on  simple  filters  (e.g.  removing  <,  >,  &,  “,  ‘) § Use  context-­sensitive  output  encoding • HTML  body <h1>DATA</h1> • HTML  attributes <div id=‘DATA’> • Stylesheet  context body { background-color: DATA; } • Script  context alert(“DATA”); • URL  context <a href=“http://example.com?arg=DATA”> § Additional  layers  of  defense § Browsers  incorporate  reflective  XSS  filters § Content  Security  Policy  allows  servers  to  prevent  inline  script  execution
  • 42. Overview 42 § Cross-­Site  Request  Forgery § Technicalities  and  common  countermeasures § Mitigating  CSRF  in  EmberJS applications § Cross-­Site  Scripting § What  is  it  and  why  should  I  care? § XSS  Protection  in  EmberJS § Content  Security  Policy § CSP,  a  second  line  of  defense  against  injection  attacks § Keeping  tabs  on  your  CSP  deployment § EmberJS and  CSP  in  practice
  • 43. XSS and JS MVC Frameworks 43 § JS  MVC  frameworks  change  the  underlying  architecture § Highly  dynamic  front  ends,  delivered  as  static  application  files § Data-­oriented  back  ends § Difficult  to  match  to  traditional  XSS  countermeasures § Server  lacks  any  context  information  about  the  data § More  security  responsibilities  for  the  client-­side  application § Protect  against  injection  attacks  during  data  binding
  • 44. Example: Allowing User-­Provided Images 44 <img src=”http://some-shop.com/coolcar.png" /> USER INPUT <img src=”http://some-shop.com/coolcar.png" /> RENDERED HTML {{input type=“text” value=x}} <div>{{x}}</div> EMBERJS TEMPLATE
  • 46. And you Find a Solution 46
  • 47. Example: Allowing User-­Provided Images 47 <img src=”http://some-shop.com/coolcar.png" /> USER INPUT RENDERED HTML {{input type=“text” value=x}} <div>{{{x}}}</div> EMBERJS TEMPLATE
  • 48. Example: Allowing User-­Provided Images 48 <img src=”http://some-shop.com/coolcar.png" onerror=“alert(1)” /> USER INPUT GENERATED HTML {{input type=“text” value=x}} <div>{{{x}}}</div> EMBERJS TEMPLATE
  • 49. Example: Allowing User-­Provided Images 49 <img src=”http://some-shop.com/coolcar.png" onerror=“alert(1)” /> USER INPUT GENERATED HTML {{input type=“text” value=x}} <div>{{y}}</div> y: function() { return Ember.String.htmlSafe(this.get(”x")); }.property(”x") EMBERJS TEMPLATE &  CONTROLLER
  • 50. Example: Allowing User-­Provided Images 50 http://some-shop.com/coolcar.png USER INPUT GENERATED HTML {{input type=“text” value=x}} <div><img src={{x}} /></div> EMBERJS TEMPLATE
  • 51. Sanitizing Data in EmberJS 51 § No  built  in  capabilities  to  sanitize  data § Use  an  external  sanitization  library § DOMPurify is  fast  and  reliable {{input type=“text” value=x}} <div>{{sanitize-purify x}}</div> EMBERJS TEMPLATE
  • 52. Sanitizing Data in EmberJS 52 import Ember from 'ember'; import sanitizer from "../utils/dompurify"; export function sanitizePurify(params/*, hash*/) { var text = params[0]; return Ember.String.htmlSafe(sanitizer.sanitize(text || "")) } export default Ember.Helper.helper(sanitizePurify); EMBERJS SANITIZE HELPER {{input type=“text” value=x}} <div>{{sanitize-purify x}}</div> EMBERJS TEMPLATE
  • 53. Data Binding in EmberJS 53 § {{  }}  produces  safe,  escaped  data § Use  this  to  avoid  shooting  yourself  in  the  foot § Use  in  the  correct  context,  and  EmberJS will  do  the  escaping § {{{  }}}  simply  injects  raw  data,  without  escaping § Don’t  use  this…  like  …  ever § Ember.String.htmlSafe(…)  marks  a  string  as  safe § Will  be  injected  without  escaping,  even  when  using  {{  }} § Only  use  when  you  write  the  static  html  code yourself § Use  a  sanitizer  if  you  need  a  selected  set  of  HTML  tags § Allows  markup  but  removes  dangerous  features
  • 54. Overview 54 § Cross-­Site  Request  Forgery § Technicalities  and  common  countermeasures § Mitigating  CSRF  in  EmberJS applications § Cross-­Site  Scripting § What  is  it  and  why  should  I  care? § XSS  Protection  in  EmberJS § Content  Security  Policy § CSP,  a  second  line  of  defense  against  injection  attacks § Keeping  tabs  on  your  CSP  deployment § EmberJS and  CSP  in  practice
  • 55. Overview 55 § Cross-­Site  Request  Forgery § Technicalities  and  common  countermeasures § Mitigating  CSRF  in  EmberJS applications § Cross-­Site  Scripting § What  is  it  and  why  should  I  care? § XSS  Protection  in  EmberJS § Content  Security  Policy § CSP,  a  second  line  of  defense  against  injection  attacks § Keeping  tabs  on  your  CSP  deployment § EmberJS and  CSP  in  practice
  • 56. You Know Content Security Policy … 56
  • 57. The Essence of CSP 57 § CSP  reduces  the  harm  of  content  injection  vulnerabilities § By  telling  the  client  where  resources  should  be  loaded  from § By  disabling  “dangerous  features”  by  default § CSP  is  intended  as  a  second  line  of  defense § A  policy  consists  of  a  set  of  directives § Each  directive  controls  a  different  kind  of  resource § Policy  is  delivered  as  an  HTTP  header  by  the  server § Compatible  browsers  will  enforce  the  policy  on  the  response
  • 58. Introducing CSP by Example 58 <h1>You searched for<script>alert(‘XSS’);</script></h1> XSS  WITH INLINE SCRIPTS <h1>You searched for<script src=“https://evil.com/hackme.js”></script></h1> XSS  WITH REMOTE SCRIPTS eval('alert("Your query string was ' + unescape(document.location.search) //hello%22);alert(1+%22 + '");'); XSS  WITH EVAL
  • 59. Introducing CSP by Example 59 Content-Security-Policy: default-src 'self'; EXAMPLE POLICY Content-Security-Policy: default-src 'self'; script-src ‘self’ https://cdnjs.cloudflare.com; EXAMPLE POLICY
  • 60. Content Security Policy 60 § CSP  started  as  a  research  paper  by  the  Mozilla  team § Aim  to  give  administrator  control  over  appearance  of  site § Aim  to  give  users  some  confidence  where  data  is  sent  to § Even  in  the  presence  of  an  attacker  that  controls  content § By  default,  CSP  will: § Prevent  resources  from  being  loaded  from  non-­whitelisted  locations § The  use  of  eval() § Inline  content  from  being  executed • Scripts  and  styles
  • 61. Introducing CSP by Example 61 Content-Security-Policy: default-src 'self'; script-src ‘self’ https://cdnjs.cloudflare.com; style-src ‘self’ https://cdnjs.cloudflare.com/…/bootstrap.min.css; EXAMPLE POLICY
  • 62. CSP is the Security Policy of the Future 62 § CSP  has  been  well  received,  and  evolved  quickly § Addition  of  plugin  types,  sandbox,  child  contexts,  form  destinations § Additional  spec  adds  UI  Security  Directives § Deprecates  X-­FRAME-­OPTIONS  header § Additional  features  to  overcome  implementation  hurdles § Widely  supported  by  browsers § Chrome  makes  CSP  mandatory  for  its  components § Browser  extensions  and  packaged  apps
  • 63. A Quick Overview of CSP’s Directives 63 § By  default,  CSP  will: § Prevent  resources  from  being  loaded  from  non-­whitelisted  locations § default-­src § Specifies  the  default  sources  of  all  content § Can  be  overwritten  with  more  specific  directives  for  each  type § img-­src,  style-­src,  font-­src,  child-­src,  media-­src,  object-­src § Specifies  the  sources  of  these  content  types § connect-­src,  form-­action § Specifices the  destination  of  these  actions § Sandbox  and  frame-­ancestors
  • 64. Lifting Content Restrictions in CSP 64 § script-­src and  style-­src support  the  lifting  of  restrictions § By  specifying  ‘unsafe-­inline’  and  ‘unsafe-­eval’ § Not  recommended,  as  this  renders  protection  useless   § CSP  1.1  supports  nonces and  hashes § Inline  script  and  style  blocks  can  be  allowed Content-Security-Policy: script-src ‘self’ ‘nonce-RANDOM’; EXAMPLE POLICY WITH A NONCE <script nonce=“RANDOM”>…</script> EXAMPLE USE OF A NONCE
  • 65. Lifting Content Restrictions in CSP 65 § script-­src and  style-­src support  the  lifting  of  restrictions § By  specifying  ‘unsafe-­inline’  and  ‘unsafe-­eval’ § Not  recommended,  as  this  renders  protection  useless   § CSP  1.1  supports  nonces and  hashes § Inline  script  and  style  blocks  can  be  allowed Content-Security-Policy: script-src ‘self’ ‘nonce-a8qzj1r’; EXAMPLE POLICY WITH A NONCE <script nonce=“a8qzj1r”>…</script> EXAMPLE USE OF A NONCE
  • 66. Dynamically Applying Styles without unsafe-­inline 66 § Sometimes,  styles  need  to  be  applied  dynamically  from  JS § Triggers  CSP  warnings,  requiring  the  use  of  unsafe-­inline for  styles
  • 67. Dynamically Applying Styles without unsafe-­inline 67 § Sometimes,  styles  need  to  be  applied  dynamically  from  JS § Triggers  CSP  warnings,  requiring  the  use  of  unsafe-­inline for  styles § Fixed  by  using  DOM  manipulation § Not  inline  style,  because  this  can  not  be  injected  directly § Would  require  a  script  injection  attack  first,  which  CSP  also  covers
  • 68. CSP Examples 68 Goal: Load  no  external  resources Content-Security-Policy: default-src ‘self’; EXAMPLE POLICY Goal: Load  all  content  over  HTTPS Content-Security-Policy: default-src https: ‘unsafe-inline’ ‘unsafe-eval’; EXAMPLE POLICY
  • 69. Overview 69 § Cross-­Site  Request  Forgery § Technicalities  and  common  countermeasures § Mitigating  CSRF  in  EmberJS applications § Cross-­Site  Scripting § What  is  it  and  why  should  I  care? § XSS  Protection  in  EmberJS § Content  Security  Policy § CSP,  a  second  line  of  defense  against  injection  attacks § Keeping  tabs  on  your  CSP  deployment § EmberJS and  CSP  in  practice
  • 70. CSP Violation Reports 70 § CSP  can  report  violations  back  to  the  resource  server § Allows  for  fine-­tuning  of  the  CSP  policy § Gives  insights  in  actual  attacks § Enabled  by  using  the  report-­uri directive § Points  to  a  handler  on  the  server  that  can  process  reports Content-Security-Policy: default-src 'self'; report-uri http://some-shop.com/csp-report.cgi EXAMPLE POLICY
  • 71. CSP Violation Report Example 71 { "csp-report": { "document-uri": "http://some-shop.com/page.html", "referrer": "http://attacker.com/haxor.html", "blocked-uri": "http://attacker.com/image.png", "violated-directive": "default-src 'self'", "effective-directive": "img-src", "original-policy": "default-src 'self'; report-uri http://some-shop.com/csp-report.cgi" } } EXAMPLE VIOLATION REPORT
  • 72. CSP in Report-­Only Mode 72 § CSP  can  be  deployed  in  reporting  mode § No  content  will  be  blocked § Warnings  will  be  generated  in  console § If  report-­uri is  specified,  error  reports  will  be  sent § Great  for  trying  out  policies  before  deploying  them Content-Security-Policy-Report-Only: default-src 'self'; report-uri http://some-shop.com/csp-report.cgi REPORT-­ONLY POLICY
  • 73. Overview 73 § Cross-­Site  Request  Forgery § Technicalities  and  common  countermeasures § Mitigating  CSRF  in  EmberJS applications § Cross-­Site  Scripting § What  is  it  and  why  should  I  care? § XSS  Protection  in  EmberJS § Content  Security  Policy § CSP,  a  second  line  of  defense  against  injection  attacks § Keeping  tabs  on  your  CSP  deployment § EmberJS and  CSP  in  practice
  • 74. So We’re Back to This … 74
  • 75. EmberJS Enables CSP by Default 75 § Taken  care  of  by  ember-­cli-­content-­security-­policy § Also  adds  unafe-­eval in  development  mode § Also  adds  live-­reload  requirements  (not  shown  here) Content-Security-Policy-Report-Only: default-src ‘none'; script-src ‘self’; font-src ‘self’; img-src ‘self’; style-src ‘self’; media-src ‘self’; connect-src ‘self’ http://0.0.0.0:4200/csp-report; report-uri http://0.0.0.0:4200/csp-report; EMBERJS DEFAULT CSP  POLICY
  • 76. Updating the EmberJS CSP Policy 76 § CSP  policy  can  be  updated  through  environment.js ENV.contentSecurityPolicyHeader = "Content-Security-Policy" ENV.contentSecurityPolicy = { 'default-src': "'none'", 'script-src': "'self’ https://", 'font-src': "'self'", 'connect-src': "'self'", 'img-src': "'self'", 'style-src': "'self’ https://maxcdn.bootstrapcdn.com", 'media-src': "'self'” } UPDATING THE EMBERJS CSP  POLICY
  • 77. Overview 77 § Cross-­Site  Request  Forgery § Technicalities  and  common  countermeasures § Mitigating  CSRF  in  EmberJS applications § Cross-­Site  Scripting § What  is  it  and  why  should  I  care? § XSS  Protection  in  EmberJS § Content  Security  Policy § CSP,  a  second  line  of  defense  against  injection  attacks § Keeping  tabs  on  your  CSP  deployment § EmberJS and  CSP  in  practice
  • 78. Overview 78 § Cross-­Site  Request  Forgery § Technicalities  and  common  countermeasures § Mitigating  CSRF  in  EmberJS applications § Cross-­Site  Scripting § What  is  it  and  why  should  I  care? § XSS  Protection  in  EmberJS § Content  Security  Policy § CSP,  a  second  line  of  defense  against  injection  attacks § Keeping  tabs  on  your  CSP  deployment § EmberJS and  CSP  in  practice
  • 79. Action Points for Tomorrow 79 1. Check  whether  your  APIs  are  vulnerable  to  CSRF  attacks § Enable  CSRF  mitigation  through  transparent  tokens 2. Make  sure  you  refrain  from  using  {{{  }}} § Let  EmberJS do  its  contextual  escaping § Use  a  sanitizer  where  necessary 3. Look  into  your  CSP  policy § Try  to  get  rid  of  the  unsafe-­inline and  unsafe-­eval statements § Make  the  policy  as  strict  as  possible § Share  your  findings!
  • 80. Getting Single Page Application Security Right 80
  • 81. Progressive Web Security Training Course 81 § Hardening  your  Applications  for  a  Rocky  Future § 4  one-­day  hands-­on  sessions § We  cover  4  important  Web  security  topics 1. Why  simply  deploying  HTTPS  will  not  get  you  an  A+  grade 2. How  to  avoid  common  pitfalls  in  authentication  and  authorization  on  the  Web 3. Why  modern  security  technologies  will  eradicate  XSS 4. Four  new  browser  communication  mechanisms,  and  how  they  affect  your   application https://distrinet.cs.kuleuven.be/events/
  • 82. Securing your EmberJS Application Special  thanks  to  Aad Versteden for   his  practical  EmberJS insights     Acknowledgements Icons  by  Visual  Pharm  (https://icons8.com)
  • 83. Securing your EmberJS Application Philippe  De  Ryck philippe.deryck@cs.kuleuven.be /in/philippederyck https://distrinet.cs.kuleuven.be/events/websecurity/ @PhilippeDeRyck