This is part 3 of my browser storage series, so please take a look at part 1 and 2 if you have not seen them yet!
As covered earlier in the series, local storage is a way to store information about a user. The information is stored in the user's browser storage on their computer. Local storage differs from cookies by not being sent in the HTTP request. Instead, the frontend can request it by calling on the localStorage object, which is a child of the window. I've written out what the basic local storage methods are in javascript:
localStorage.setItem('currentUser', 'Dawn');
var user = localStorage.getItem('currentUser');
localStorage.removeItem('currentUser');
With just setItem, getItem and removeItem, you can save information about a user that will persist between sessions. A user can come back the next day, and anything saved by that site in the local storage will remain. This is incredibly useful for staying logged in. It moves the burden of holding the information about the user's session from the backend and server, to the local storage. This can work because instead of the user holding onto a session id, they hold all the information that authorizes them to be using the site. This means that there doesn't need to be a look up of the user for every new http request sent.
Can't a user just fake this information?
They could, but that's where signatures come in. We can use JWT (json web tokens) to include a signature from our server based on a secret that only our servers know. This signature is stored in the JWT in the local storage, and can be accessed, sent to the server, and verified without any database calls. The server knows that unless someone else has the secret, the JWT is accurate and this user has certain authorizations.
Using local storage can be faster than using cookies. Not only does it not need a sessions database, but it also works on different servers. If all of your servers have the same secret, then they can all authorize the user for access of all the other servers. This is especially useful for large, distributed sites, as well as sites with multiple services, such as a bank.
To learn more about JWT, JWT.io is the perfect site. Additionally, here is a walkthrough on how to implement this yourself in a rails and react environment.
Top comments (4)
Beware that JWT in local storage is accessible to all websites:
Please Stop Using Local Storage
Randall Degges ・ Jan 30 '18 ・ 11 min read
Yes, please don't ever store sensitive information in local storage, as it's not secure! Local storage is domain specific, so one website's data is not accessible by default to other sites. Local storage is an amazing tool for sites to keep track of if a user is currently logged in.
I am concerning that JWT can actually be decoded without a secret key (although cannot verify). So, it is really safe, esp for public computers?
Don't store sensitive information in local storage, since the data isn't secure! Many sites have a button, "remember me on this pc" to indicate that it is a personal computer.