Upgrade to Pro — share decks privately, control downloads, hide ads and more …

Don't Cross Me! Same Origin Policy and all the ...

ropnop
February 04, 2020

Don't Cross Me! Same Origin Policy and all the "cross" vulns: XSS, CSRF, and CORS

All too often, even seasoned web security professionals get mixed up by the subtle differences between cross site scripting (XSS), cross site request forgery (CSRF) and cross origin resource sharing (CORS). In this talk, I’ll start at the basics and discuss the browser security model and same origin policy - the security boundary that protects and limits JavaScript’s power within the browser. After covering the basics of origins and JavaScript, I’ll walk through each of the three “cross” attacks and explain in depth what is happening, why they work - and what an attacker can do with them. The talk will feature code samples and discussions of how to mitigate these vulnerabilities by leveraging the SOP. Whether you are a pentester, security engineer, developer or product manager, this talk should help everyone design, implement and test secure web applications.

ropnop

February 04, 2020
Tweet

More Decks by ropnop

Other Decks in Technology

Transcript

  1. 1 Ronnie Flathers – @ropnop - ChiBrrCon 2020 Don’t Cross

    Me! Same Origin Policy and all the “cross” attacks – XSS, CSRF, and CORS
  2. 2 Introduction • Ronnie Flathers • Chicago, IL • NetSec/AppSec/ProdSec/DevSecOps

    • Application Security Lead @ Motorola Solutions 2 @ropnop github.com/ropnop blog.ropnop.com
  3. Agenda •Why this talk? •Web Technologies Crash Course • Back

    to basics! •Same Origin Policy •The “Cross” Vulns • Walkthroughs and Examples •Defensive Takeaways 3
  4. Why this talk? • A lot of web app security

    education is based on attacks rather than the underlying security principles • Fixing security bugs in webapps is like “whack a mole” when you don’t understand the core underlying issues • Even very experienced security testers mix up CORS, CSRF and XSS 4 By understanding why attacks work, you can learn how to defend against them
  5. Web Technologies Overview • HTTP • Plaintext protocol that powers

    the web • Well defined protocol with accepted verbs and headers • Generally TCP over ports 80/443 • HTML • Markup language that describes to the browser how to render a page • Not a “programming language” just a format (like XML or JSON) • CSS • Style metadata associated with HTML; tells the browser how to display the HTML • Document Object Model (DOM) • The browser parses HTML and CSS into a Document Object Model (DOM) • The DOM is ultimately what gets displayed and clicked on by the end user 6 HTML CSS Document Object Model (DOM) www.example.com
  6. Web Technologies Overview • A complete programming language • Browsers

    have their own JS engine that executes loaded JS code • Has full read and write control of the DOM • Modern pages make heavy use of DOM manipulation with JS (e.g. animations) • Has full access to browser storage • Can access cookies • Can talk to browser APIs • E.g. webcam, microphone, location • Browser executes JS in a sandbox to limit its power 7 HTML CSS Document Object Model (DOM) www.example.com JavaScript Storage Browser APIs Cookies In the world of web, JavaScript is king
  7. HTTP Basics • HTTP is plaintext • Everything is in

    ASCII • Uses common words and verbs • HTTP is stateless • There is no concept of “state” between clients and servers • HTTP requests and responses must be completely “standalone” and include their own identifying information 8 Request Response Body Headers
  8. HTTP Session Management “In the beginning, HTTP was created as

    a stateless protocol. So cookies were invented. This has made a lot of people very angry and been widely regarded as a bad move.” (Just kidding. Sort of) 9 • HTTP is a stateless protocol. • Servers have no way of remembering or determining who they are talking to • Servers must accept every request sent to them, and decide every time whether to process it • Cookies were invented in the early 90s as a way to hack session information into HTTP • Browsers send/receive cookies in HTTP Headers and store them in a “cookie jar”, organized by domain
  9. Cookie State and Security • Cookies are usually an identifier

    used to correlate a client’s state server side • Also used for tracking clients (i.e. advertising) • Browsers are extremely “helpful” and will send any matching cookies automatically with every request • Problem? • Cookies have some flags to improve security: • HttpOnly – don’t let JavaScript read/write the values • Secure – never send the value over plaintext HTTP • SameSite – new flag, more on this later ☺ 10
  10. Making HTTP Requests The “traditional” way: • The browser loads

    a resource • The browsing context changes • i.e. navigate away from a page • These include cookies automatically! 11 Browsers make HTTP requests in two distinctly important ways Some happen automatically when a page loads: Some require an event, like a user clicking: The user sees this happen – the page will change I call these “HTML requests” – they are usually triggered through HTML elements
  11. Making HTTP Requests The “JavaScript” way: • Running JS calls

    the browser API XMLHttpRequest • Or the “fetch” API on newer browsers • JavaScript can make requests and read responses silently in the background, without the user’s interaction • Used in AJAX Programming • Asynchronous JavaScript and XML • Update the page without having to request a new one! 12 Browsers make HTTP requests in two distinctly important ways I call these “AJAX requests” – they run in the background, invisible to the user These AJAX requests are subjected to the SOP
  12. Same Origin Policy (SOP) • Any site you visit on

    the internet can load and execute JavaScript in your browser • Obviously some big security concerns • Browsers address this by limiting what JavaScript can do. • Two main security boundaries: • Sandbox • JavaScript should never escape the browser and access your host • Same Origin Policy (SOP) • JavaScript should only see and access data associated with the origin it was loaded from 13 Browsers recognized the danger of executing arbitrary JavaScript HTML CSS Document Object Model (DOM) www.example.com JavaScript Storage Browser APIs Cookies Origin
  13. Same Origin Policy (SOP) • Same Origin Policy restricts what

    JavaScript can see/access to only the origin it is loaded from 14 Without the SOP, the web would be a very, very dangerous place HTML CSS www.example.com Origin A HTML CSS www.chase.com Origin B
  14. Cookies and Storage 15 • Besides cookies, browsers also have

    Storage APIs that can be leveraged by JS to store information • Two main types of browser storage: • LocalStorage • Persistent and available to the entire origin • SessionStorage • Available only to the current window • While Cookies can be “protected” from JS with the HttpOnly flag set, browser storage is always available to JS • But browser storage is never automatically sent! Cookies are scoped to a domain, but only available to JS within that origin Browser storage is isolated entirely by the origin Strictly speaking, the SOP doesn’t apply to cookies and browser storage, but the origin is still the security boundary
  15. If we didn’t have the Same Origin Policy 16 Without

    the SOP, the web would be a very, very dangerous place • Without the SOP, any site you visit could load malicious JavaScript that interacted with sites you are logged in to • You visit attacker.ropnop.com and as soon as the page loads: • A request is made to Chase to transfer money • A request is made to Amazon to order a new Macbook • etc… • An attacker would just force your browser to do some very bad things
  16. Origins Cookies are scoped to a domain, but origins have

    a stricter definition 17 Assume JavaScript is loaded from https://www.example.com/home/homepage.html, which of these resources are considered to be the same origin? a) https://example.com/login b) https://www.example.com/api/profile c) http://www.example.com/images/profilepic.png d) https://api.example.com/v1/users e) https://www.example.com:8443/db/update/php
  17. Origins Cookies are scoped to a domain, but origins have

    a stricter definition 18 Assume JavaScript is loaded from https://www.example.com/home/homepage.html, which of these resources are considered to be the same origin? a) https://example.com/login b) https://www.example.com/api/profile c) http://www.example.com/images/profilepic.png d) https://api.example.com/v1/users e) https://www.example.com:8443/db/update/php Answer: B only Origins must match on three parts: • Scheme (https) • Host (www.example.com) • Notice the subdomain (www)! • Port (443)
  18. How is JavaScript “loaded” from an Origin? • It must

    be included somewhere in the HTML that was returned from the server • Most commonly in a <script> tag, but JavaScript can be loaded in a number of other ways as well 19
  19. The “Cross” Vulns Cross Site Scripting, Cross Site Request Forgery,

    and Cross Origin Resource Sharing* 20 * CORS is not a vuln, but misconfigurations are!
  20. The “Cross” Vulnerabilities • Cross Site Scripting (XSS) • Terrible

    name; devastating vulnerability • Abuses: content injection to bypass SOP • Cross Site Request Forgery (CSRF) • Good name; annoying vulnerability • Abuses: stateless HTTP, cookies and that SOP doesn’t apply to HTML elements • Cross Origin Resource Sharing (CORS) Misconfigurations • Confusing concept; common misconfiguration • Abuses: developers’ misunderstandings of SOP 21 With an understanding of SOP, HTTP and JavaScript, common web app vulnerabilities make more sense
  21. Cross Site Scripting • Cross Site Scripting occurs when an

    attacker is able to force a victim’s browser to execute JavaScript within a trusted origin • It’s a terrible name. Don’t think about “cross-site” – it’s all about loading and executing JavaScript within the same site (“origin”) • XSS allows an attacker to completely bypass the Same Origin Policy by getting their JavaScript to run in the same origin as the site they wish to target • This is accomplished through content injection in which malicious JS is injected in a valid HTTP response from the origin 22
  22. Cross Site Scripting • In an XSS attack, malicious JS

    is “smuggled” inside a legitimate HTTP response so it is executed inside the origin 23 SOP disallows an attacker’s script from interacting cross-origin HTML CSS www.chase.com Origin A Attacker Origin B Victim
  23. Cross Site Scripting • In an XSS attack, malicious JS

    is “smuggled” inside a legitimate HTTP response so it is executed inside the origin 24 If the JS comes from the origin, however, SOP is off the table HTML CSS www.chase.com Origin A Attacker Origin B Victim
  24. Cross Site Scripting – 3 Main Types Reflected XSS •

    An attacker is able to load JavaScript from a trusted origin by reflecting it up to and back from the server • Usually through sending a crafted link to a victim with the JS payload embedded 25 There are three main “techniques” for content injection www.chase.com www.chase.com/XSS Hey click this link! XSS comes from trusted origin and is executed
  25. Cross Site Scripting – 3 Main Types Stored XSS •

    An attacker is able to load JavaScript from a trusted origin by storing it on the server to be returned in responses • Usually through embedding a payload in a persistent field (e.g. comments) • Affects any user who visits the correct page 26 There are three main “techniques” for content injection www.chase.com XSS XSS comes from trusted origin and is executed
  26. Cross Site Scripting – 3 Main Types DOM Based XSS

    • An attacker is able to load JavaScript from a trusted origin by passing it in to dynamic JS that is already loaded and executing • Usually through embedding a XSS payload in a field that becomes a JS variable and is parsed and executed 27 There are three main “techniques” for content injection www.chase.com www.chase.com/foo#XSS XSS is loaded into already trusted JS from the origin Hey click this link!
  27. alert(1) – So What? • Pentesters love to user alert(1)

    as their XSS payloads, but it really doesn’t demonstrate any severity by itself • It’s very visual and easy to spot • The most important part isn’t actually the “1” – it’s the page that says it • A better payload would be: • alert(window.origin) 28 The origin is https://www.chase.com An alert box is just a visual way to demonstrate you have JS code execution loaded inside that origin
  28. XSS – What can you do? • SOP no longer

    applies – the basis of web security is over • JavaScript controls everything in that origin – and the attacker controls the JavaScript • Read sensitive data: • Cookies • Session/Local Storage • Make requests: • AJAX without user knowledge 29 HTML CSS www.chase.com The origin is “infected” with malicious JavaScript
  29. Summary - XSS • Cross Site Scripting is really “content

    injection” • An attacker is able to inject malicious JavaScript into an origin’s response • Since the malicious JavaScript comes from the origin, the browser trusts it and the Same Origin Policy does not apply • JavaScript is all powerful and if an attacker takes control of it, they can pretty much do anything a normal, logged in user can do on the site • XSS = Full read/write access within an origin 30
  30. Cross Site Request Forgery (CSRF) • CSRF can be thought

    of as another “bypass” of the Same Origin Policy • According to SOP, resources loaded from one origin should not be able to write data to another origin • There are two notable exceptions to SOP however: • HTML Requests • Cookies • CSRF abuses these both 32 ww.chase.com Origin A Attacker Origin B SOP
  31. Anatomy of a CSRF Attack • Requires: • “State changing”

    request • e.g. a POST that writes data or performs an action • Cookie based authentication • No cookies == no CSRF • User interaction • Victim must visit attacker’s site or click a link 33 • Abuses: • HTTP’s stateless nature • Server can’t distinguish legitimate request from a forced one • Browser’s cookie behavior • Cookies are automatically sent to matching domains • HTML Requests • Not subject to SOP • No JavaScript/AJAX requests
  32. Anatomy of a CSRF Attack 34 www.chase.com The POST to

    www.chase.com includes the user’s cookies. The server thinks it is a legitimate request and processes it Hey click this link! www.attacker.com www.attacker.com/csrf
  33. Example CSRF Payload When the victim visits this HTML page,

    a form is automatically submitted to https://www.chase.com/account/transfer This POST request automatically includes any associated cookies 35
  34. Example CSRF Payload When the victim visits this HTML page,

    a form is automatically submitted to https://www.chase.com/account/transfer This POST request automatically includes any associated cookies 36
  35. CSRF Prevention • Because of the browser’s overly helpful behavior

    with cookies, it is up to the server to verify the request • Traditional defense is through “synchronizer tokens” • A random value is appended to each form • When the form is submitted, the server syncs the tokens to make sure they match • Requires remembering state server side. Frameworks help a lot here • Better/easier method is to use the Same Origin Policy! • SOP only applies to JavaScript • If each form submission requires some JavaScript, SOP kicks into action and helps us out 37
  36. CSRF Prevention with SOP • Don’t accept state-changing requests via

    “pure” HTML • Must require a little JavaScript for SOP to apply • Two approaches: • Double Submit Cookies • A random value must be submitted in both a cookie and the body • JavaScript reads the CSRF Cookie value and appends it to the request • Custom Headers • A random, custom header must be submitted with each request • JavaScript sets a custom header on the outgoing form submission • Third approach? • Don’t use cookies at all! If your app doesn’t use cookies for authentication, CSRF goes away 38
  37. CSRF – Double Submit Example • Use JavaScript to send

    the form • onClick() • JavaScript reads the CSRFTOKEN cookie value and adds it to the form • Because of SOP, this form can now only ever be successfully run from within that origin • Otherwise JS couldn’t read the cookie! • SOP defeats CSRF! 39 Modern client side frameworks can do this automatically! Angular will always read and send the XSRF-TOKEN cookie in all requests
  38. CSRF – Double Submit Example • Use JavaScript to send

    the form • onClick() • JavaScript reads the CSRFTOKEN cookie value and adds it to the form • Because of SOP, this form can now only ever be successfully run from within that origin • Otherwise JS couldn’t read the cookie! • SOP defeats CSRF! 40 Modern client side frameworks can do this automatically! Angular will always read and send the XSRF-TOKEN cookie in all requests Server only needs to check if these 2 values match. If they do, the request must have come from the same origin
  39. CSRF – Custom Header Example • Another option is to

    forgo cookies entirely and just use custom headers • Only JavaScript can set custom headers on outgoing requests • An AJAX request and a custom header trigger the SOP • If custom header makes it to the server – the form was submitted from the same origin! 41 Modern client side frameworks can do this automatically! Angular will always read and send the XSRF-TOKEN cookie in all requests
  40. CSRF – Custom Header Example • Another option is to

    forgo cookies entirely and just use custom headers • Only JavaScript can set custom headers on outgoing requests • An AJAX request and a custom header trigger the SOP • If custom header makes it to the server – the form was submitted from the same origin! 42 Modern client side frameworks can do this automatically! Angular will always read and send the XSRF-TOKEN cookie in all requests Server only needs validate if that custom header is there. If it is, the request must have come from JavaScript and therefore the same origin
  41. CSRF Summary • Cross Site Request Forgery abuses legacy HTML

    and Cookie behavior to not invoke the Same Origin Policy • It requires: • Cookie based authentication to only be used • HTML forms/requests only (no JavaScript!) • It allows an attacker to write data cross-origin without invoking the SOP • It can easily be prevented by forcing the SOP to be enforced via using JavaScript to read cookies or set custom headers 43
  42. Cross Origin Resource Sharing (CORS) • The Same Origin Policy

    is very powerful and by default very restrictive • There are plenty of legitimate use-cases for loosening the SOP: • Public facing API where you want clients on other origins to read your data • Application split up across multiple origins • E.g. app.example.com needs to communicate with api.example.com • Browsers have a method to bypass the SOP by setting special HTTP Headers for Cross Origin Resource Sharing • CORS is not a vulnerability, however anytime you loosen the SOP you should know what you are doing • CORS is confusing and this leads to a lot of misconfigurations – even disabling SOP entirely! 45
  43. CORS Headers • Whenever a cross-origin JS request is made,

    the browser reads headers in the server’s response to determine whether to allow it: • Access-Control-Allow-Origin • What origins are explicitly allowed to interact with this server? • Access-Control-Allow-Methods • What HTTP methods are allowed for the cross origin requests? • Access-Control-Allow-Headers • What HTTP headers are allowed for the cross origin requests? • Access-Control-Allow-Credentials • Should the browser send credentials (i.e. cookies) with the requests? • It is entirely up to the server to decide what origins and options to allow • Misconfiguring CORS options can lead to disastrous side-effects 46 There’s a few other CORS headers, but these are the most important
  44. CORS – Simple and Preflight Requests • For some cross-origin

    requests, the browser will just send it and then make a security decision after receiving the response (“simple requests”) • Simple requests are considered “safe” to make by the browser: • GET, HEAD and POST only; no credentials; no custom headers; basic content-type • The browser will automatically send these requests, but it will not return the response to the page unless the CORS Response headers allow it • Non-simple requests are considered sensitive and require a “preflight request” • Browser will send an OPTIONS request to the server first • Depending on CORS Headers in Response, browser will then decide whether to actually make the request 47
  45. CORS Real World Example These headers tell the browser: •

    I will only communicate with https://www.chase.com • I will only allow POST, GET, OPTIONS • I will accept cookies • I will only allow these headers: • x-jpmc-csrf-token • Content-Type • origin 48 HTTP Response from analytics.chase.com This is a well configured CORS policy that is not overly- permissive
  46. CORS Example 49 Sending Simple CORS Requests attacker.ropnop.dev api.chase.com The

    browser sends the request, and the server sends a response. But the browser blocks the response data from reaching the requesting page because the ACAO header does not allow attacker.ropnop.dev
  47. CORS Example 50 Pre Flight CORS Requests attacker.ropnop.dev api.chase.com JavaScript

    tries to send a POST request with cookies. The browser intercepts it and sends a preflight request. The response does not allow the origin, so the browser never sends the original POST request
  48. Wildcard Allow Origins • The CORS spec does allow specifying

    a wildcard (“*”) in the ACAO header • This allows any origin to read data from the server • Wildcards should only be used for public, unauthenticated data • Browsers, fortunately, know that this can be dangerous • They will never send credentials when a wildcard is specified 51 This combination is a recipe for disaster. That’s why browsers will never allow it. If a wildcard is set, the Allow Credentials is ignored
  49. Dynamically Setting Allowed Origins • CORS can be major pain

    for developers who are prototyping or working in multiple environments • Setting wildcards is common to “get rid of the errors” • A really bad antipattern arises when developers “hack” CORS to allow credentials from any origin • Servers can be configured to dynamically set the requesting origin in the ACAO header and specify ACAC 52 Many StackOverflow answers and even tutorials have developers configure this for ease of use
  50. Dynamic ACAO Headers 53 It is easy for testers to

    spot by putting in bogus origins and seeing the response headers Don’t ever do this! This combination effectively disables SOP entirely
  51. CORS Misconfiguration Example 54 Dynamic Origin With Allow Credentials attacker.ropnop.dev

    api.chase.com There is essentially no SOP anymore with this configuration. An attacker can execute JavaScript on their origin, but have full read/right access to a different origin. XSS is no longer even necessary
  52. CORS Vulnerabilities Summary • Cross Origin Resource Sharing is a

    method for servers to loosen the SOP and allow explicit origins to access them • When CORS is misconfigured to be overly permissive, all the base protections of SOP fly out the window • A CORS misconfiguration can allow a cross-origin, authenticated read or write from a different origin 55
  53. Defensive Takeaways – XSS and SOP • Traditional defenses still

    apply – never trust user input and always sanitize your outputs! • Use origins as defense in depth! • What happens after I log into www.chase.com ? 57 The most secure aspects of online banking are on a completely separate origin! This means a discovered XSS attack against www.chase.com will not affect the secure dashboard Chase can also rely on tightly configured CORS policies to limit access to the secure portal from other pages/sites under the Chase umbrella.
  54. Defensive Takeaways – XSS and SOP • If you allow

    untrusted user input (e.g. uploads or hosting) – serve them from a different origin! • Most large cloud sites do this as an added security measure: • *.googleusercontent.com vs google.com • *.amazonaws.com vs amazon.com • *.azurewebsites.net vs azure.com • Utilize iframe sandboxes • Add the “sandbox” attribute to iframes when loading untrusted content • This will randomly generate an origin for the content – letting you take advantage of SOP security controls even though everything is coming from the same server 58
  55. Defensive Takeaways – CSRF and SOP • Don’t use “legacy”

    HTML forms and cookie based auth if you don’t have to • You miss all the great security controls with SOP • Use JavaScript to send forms, credentials and headers • Automatically triggers SOP and CORS checks • Defeats nearly all CSRF attacks • Use the “SameSite” flag • New flag, not all browsers support yet • Tells browsers to not send this cookie cross-origin (finally!) • Don’t use cookies at all • Using custom headers (e.g. JWTs) enforces SOP and CORS – less chance for slip ups! 59
  56. Defensive Takeaways - CORS • SOP is your friend when

    it comes to security – loosen it wisely • CORS can be confusing, but it can also be extremely powerful for protecting against attacks • Lock down your sensitive APIs with explicit whitelists of origins, headers and methods • Only use wildcard origins when it is truly meant to be fully public to the world • Never fully disable SOP by setting insecure CORS headers • Dynamic origins + Allow-Credentials 60