26

I'm building a JWT-based (JSON Web Token) authentication mechanism for an browser-based Javascript web app, working with a stateless server (no user-sessions!) and I want to know, once and for all, if using storing my JWT token in a cookie will protect my token from XSS attacks, or if there is no protection, so there's no real advantage over using browser local storage in my Javascript app.

I have seen this question asked and answered in SO and in many blogs, but I've never seen an answer that really satisfies me.


This question was originally held on the basis that it solicits opinion - and given my original wording, rightly so. So let me make it clear here and now that I don't want an opinion based on vague notions of developer laziness or such - that's what the ground rules are meant to eliminate. What I want is an evidence-backed Yes/No answer. Either:

  • "Yes, cookies can be protected from XSS and CSRF and here's how" or
  • "No, by protecting your cookies from CSRF, you always open them up to the same kind of XSS attack that made cookies a good idea in the first place"

So I'm going to restate the question, with some simplifying ground-rules, and point out the holes in advance, so that you, the experts, can set me straight.

Ground rules

  • Your app is a javascript browser app - it might be in AngularJS, but it might be custom-built. It communicates with the server via REST calls. Let's say, jQuery $ajax calls.

  • The server is stateless: there is no session management.

  • The app users JWTs as the main authentication token ('access token' in OAuth2 parlance) and validates them on the server using a secret signing key

  • Ignore other important advantages of cookies: browser management, less chance of coding poorly, etc. For this battle, I want to consider the absolute security, and assume we can competently code either mechanism.

  • Ignore other disadvantages of cookies, such as non-browser apps, etc. For this battle we are only concerned with a browser-based javascript app.

  • It doesn't matter whether you use a header or a request body to transmit tokens in the non-cookie approach; nor does it matter if you're using local storage vs session storage - ignore any security differences there. And yes I know that technically Cookies use headers, ignore that.


In a nutshell, we're only interested in comparing browser-handles-tokens vs your-javascript-handles-tokens and the comparative XSS and CSRF security risks.


The contestants

In the red corner, Auth0: Local Storage beats Cookies, because XSS is easier to fix than CSRF

In the blue corner, Stormpath: Cookies beats headers, because actually CSRF is easier to fix than XSS.

(excerpts of both arguments in detail below)

Weapons of choice

XSS and CSRF (we'll use CSRF and XSRF interchangeably: the C seems to be more popular in documentation, the X in code)

Here's my super-simplified summary of the attack types:

Let's assume your stateless, JWT-authenticated, javascript browser app is for online banking and the attacker, "Evil Corp", wants to submit an AJAX REST call that transfers funds to their account by impersonating your users.

XSS (Cross-site scripting)

(As Stormpath points out, there are many attack vectors - I'll pick one)

Evil Corp buys the github account rights for the nifty text field widget you use for password entry. They know your bank site uses it, so they update it to submit AJAX requests to transfer funds to their account when you type in your passord and hit enter. Your build system foolishly pulls the update and puts in production.

CSRF (Cross-Site Request Forgery)

Evil Corp knows your bank site uses JWTs in cookies to authenticate transactions, so they write a web app that submits AJAX requests to transfer funds to their account. They host this on their own evil.com site, and lure you there with an email (phishing) or some other way, when you happen to be logged into your bank site in another tab. The browser submits the request from evil.com, but attaches your JWT becaues it's going to the correct site: the bank.

Standard defences

The defence against XSS is to be very careful about the code in your site so that you never let the browser process something the user types in without sanitizing it (removing javascript and html) and that all the 3rd party libraries (Evil's text field widget) are vetted before being used. As Stormpath rightly points out, this is hard, bordering on impossible.

The defence against CSRF is to use a form of double-submit-cookie. This means our server creates a token (securely random string) and sends it to our Javascript browser app in a readable cookie (call it "XSRF-TOKEN" by convention), and our Javascript sends it back in a header or body with every request.

Actually, double-sumbit-cookie's are only one defence agasint CSRF, but some others require stateful server sessions and no other (I think!) offers any better protection. The statelessness can be achieved by also putting the token in the JWT and comparing it on the server side with the one that comes in the header or body.

But the real CSRF-busting quality of this defence, is that same-origin-policy mean that only the javascript that our app loaded from our domain can read that cookie. So even if the javascript on evilcorp.com can send our cookies with its requests, it can't embed our XSRF-TOKEN because it can't read it in the first place.

To really simplify CSRF:

  • CSRF attacks work because a browser attaching a cookie depends only on the destination of a request.
  • CSRF defences work because Javascript access to a cookie depends on the origin of the Javascript.

Auth0's argument

It's easier to deal with XSS than XSRF Cookies have this feature that allows setting an HttpOnly flag from server side so they can only be accessed on the server and not from JavaScript. This is useful because it protects the content of that cookie to be accessed by injected client-side code (XSS). Since tokens are stored in local/session storage or a client side cookie, they are open to an XSS attack getting the attacker access to the token. This is a valid concern, and for that reason you should keep your tokens expiration low.

But if you think about the attack surface on cookies, one of the main ones is XSRF. The reality is that XSRF is one of the most misunderstood attacks, and the average developer, might not even understand the risk, so lots of applications lack anti-XSRF mechanism. However, everybody understands what injection is. Put simply, if you allow input on your website and then render that without escaping it, you are open to XSS. So based on our experience, it is easier to protect against XSS than protecting against XSRF. Adding to that, anti-XSRF is not built-in on every web framework. XSS on the other hand is easy to prevent by using the escape syntax available by default on most template engines. https://auth0.com/blog/2014/01/27/ten-things-you-should-know-about-tokens-and-cookies#xss-xsrf

Stormpath's argument

Stormpath recommends that you store your JWT in cookies for web applications, because of the additional security they provide, and the simplicity of protecting against CSRF with modern web frameworks. HTML5 Web Storage is vulnerable to XSS, has a larger attack surface area, and can impact all application users on a successful attack. https://stormpath.com/blog/where-to-store-your-jwts-cookies-vs-html5-web-storage/

Also:

I see a lot of discussions where cookies are pitted against access tokens. While we’ve all been burned by systems that store a session ID in a cookie, and that cookie is not secured and thus gets stolen. That sucks, but its not a reason to use tokens. Its a reason to avoid non-secure, non-https cookies. https://stormpath.com/blog/token-auth-spa/

My take

Stormpath's argument in favour of cookies is pretty convincing, but there's a hole in it that I don't see them addressing clearly:


The double-submit CSRF defence relies on the fact that my CSRF attacker cannot access my cookie: the one with the XSRF-TOKEN in it. But isn't that cookie just as vulnerable in an XSS attack as local storage?


An XSS exploit can run javascript on my domain, so it can read the same cookies my javascript can. (The browser doesn't know that it isn't my Javascript)

To look at it from the other side: local storage is protected by the same-origin-policy just as much as a readable cookie. If I'm using the Auth0 approach, and an XSS attacker knows how to find my JWT in local storage and use it. Can't that same attacker use that same XSS script to grab my XSRF-TOKEN cookie and use that?

Both attacks require them to read and understand my javascript app, but that's out there in their browser.

So what's the difference? Is one really more secure than another, and why?

6
  • 1
    This appears to be a very well thought out question, but it also appears to be asking people to offer theories, which is likely to draw close votes for the question being too opinionated.
    – Claies
    May 2, 2016 at 10:31
  • 2
    I think the tangible question is, "What happens if my anti-CSRF token is compromised by an XSS attack"? If the original question could be modified accordingly and re-opened that would be excellent. As the author of the linked resource, Token Based Authentication for Single Page Apps (SPAs), I would really like to answer this question :)
    – robertjd
    May 2, 2016 at 18:49
  • This is too broad as well as opinionated; "is X better than Y, and why" is a design question that needs to be answered in a blog post.
    – TylerH
    May 3, 2016 at 19:01
  • You are right that the wording of the question seems to solicit opinion. I've reworded it accordingly and would like to resubmit. To be clear though, despite my title, getting an opinion was never my goal here. I've found plenty of opinions, and I have quoted those with the best arguments. I really want a Yes/NO answer with evidence.
    – Rhubarb
    May 4, 2016 at 9:21
  • 2
    Perhaps consider asking this on Security?
    – Ian Kemp
    May 9, 2016 at 12:16

1 Answer 1

5

Abandon all hope unless you can secure against XSS!

Or

Choose the approach that suits you based on other criteria because both are equally secure, equally insecure.


If you use cookies, you should definitely use the double-submit-cookie defence, or something similar, because it does protect you against CSRF in the absence of XSS. That is, if you don't do this, you're definitely open to CSRF attacks - from other domains - that don't even require XSS exploits to work.

But either way, your source code is publicly available (JavaScript in your browser) so for a motivated hacker, there is no significant difference in effort between finding which token to pull from local storage and reading your XSRF-TOKEN cookie. If Evil Corp can get some JavaScript running in your domain - that's XSS - then you're hosed.

Non-security-related criteria you might want to consider for your choice:

  • Cookies are convenient because you don't have to write JavaScript code to manage the token - only the XSRF.

  • Redirection becomes a little more automatic too, if you want to use it.

  • Local storage is easier to adapt to non-browser apps - from the server perspective that is, because if you write say, an Android app in Java that doesn't want to deal with cookies, your server doesn't need to make any distinction between in and the browser, since it's not using cookies.

Anyway, make up your own mind, but be careful about the JavaScript you write and the 3rd party JavaScript you use!

1

Not the answer you're looking for? Browse other questions tagged or ask your own question.