Should i get access-token from sessionStorage for each request?

Question

So basically when I login my backend returns me a token so I store it like:

// var token is global
token = res.data.token;
sessionStorage.setItem("token", token);

And when I logout I just remove the items from sessionStorage and reset the var:

token = '';
sessionStorage.removeItem("token");

Then in all my requests I use the var to create the header

{ headers: { "Authorization": "Bearer " + token } }

But I don't know if i should keep the token var or just access the storage for each request like:

{ headers: { "Authorization": "Bearer " + sessionStorage.getItem("token"} }

Right now I just use the storage in case the user refresh the page, so he doesn't lose javascript context, because I thought is more efficient than accessing the storage for each request, but I don't know what is the best approach security-wise, or what do usually developers do?

Proxy

Answer 1

It makes no difference from a security perspective; neither is more secure than the other.

If you only need the token when doing an ajax call, don't worry about the overhead of getting it from sessionStorage. That operation doesn't take any significant time at all, certainly not compared with doing an ajax call. You'd only need to cache the result in a variable if you were using it in a tight loop doing thousands of operations (or possibly hundreds of thousands) while the user waited for them. You might want it in a variable for other reasons (convenience, for instance), but there's no efficiency argument in the case you describe.

General rule: Worry about performance when you have a performance problem (but, you know, don't be completely silly doing things you know are horribly inefficient...). :-)

Ella

Answer 2

First things first - if you are loading ANY 3rd party JS, don't use local/session storage to store any sensitive data, including tokens (JWTs I guess?). This type of storage is completely unprotected; any JS running on your page can access it. Once any of the 3rd party scripts get compromised, so does your app (potentially sending all your user session data to an attacker). A JWT is somewhat a username + password equivalent and should be handled as such. Use a secure httpOnly cookie to transfer JWTs or store the session data server-side and have the token become a signed session cookie.

The overhead of accessing local/session storage is quite negligible. In case you worry about performance a lot, though, load the token into a variable (or some kind of service or store) on app initialisation, construct the Authorisation header using that and access the storage only when the token changes.

Also, take a peak here:

https://dev.to/rdegges/please-stop-using-local-storage-1i04

https://stormpath.com/blog/where-to-store-your-jwts-cookies-vs-html5-web-storage

Hope this helps a little :-)

Sig