Best practice for storing tokens?

[dasveloper]

I'm still trying to learn JWT best practices and I'm wondering if someone could explain, in the context of this boilerplate, what would be the best way to store tokens so that the user doesn't get logged out on every refresh.

1. Local storage - This boilerplate returns both tokens after register/login, so it would be trivial to store the tokens in local storage. However, apparently that is considered insecure because it's vulnerable to XSS attacks. Also I don't believe it would make much sense to store the refresh token right next to the access token in local storage anyway.
2. Memory + Cookie - An alternative could be to store the access token in memory on the browser, and store the refresh token in a secure httpOnly cookie. The refresh token could be vulnerable to CSRF but the access tokens would just get sent to memory and would not be available. If the user refreshes or the access token expires then the cookie can be checked for the refresh and if valid issue a new one. This option seems reasonable, but then it'd be modifying a good bit of this repos code so it seems like this is not the intended way.

So I'm curious, what is the route people are taking here? Local storage, cookie, other?

[hagopj13]

Hi @dasveloper you have raised a really important point here. In this boilerplate, we're not using cookies (so that basically means storing the refresh token in the local storage). However, I also agree that storing the JWT refresh token in a httpOnly and secure cookie would be more secure and hence better. That, however, does mean that some parts of the code need to change. Might as well create an issue for this and see what people think ;)

Btw, if you want a good (short) article about this: https://dev.to/cotter/localstorage-vs-cookies-all-you-need-to-know-about-storing-jwt-tokens-securely-in-the-front-end-15id