Gebruik van localStorage - browsers mini database

Wat is localStorage

Met de localStorage, vertaal het maar eens naar het Nederlands, kan je lokaal dingen opslaan in de webbrowser. Dit kan handig zijn als je de naam van een gebruiker wilt opslaan, de high-score van de speler, todo-items of steden in een weather API.
Het gebruik van localStorage doe je via het window object: window.localStorage na de localStorage komt een van de volgende opties: .setItem(), .getItem(), removeItem(), clear()

Alleen per computer/ browser!

Let op, de localStorage is gelimiteerd per computer en per webbrowser (tenzij synchronisatie dit ondersteund). Dat betekend dat als je op dezelfde computer een andere browser gebruikt, bijvoorbeeld FireFox in plaats van Chrome, dat de localStorage niet gelijk is. De localStorage is ook per domein (URL) apart, je kan bijvoorbeeld geen localStorage ophalen van https://google.com op deze website van MBO-SD.

Opslaan - .setItem()

Om informatie op te slaan kan je window.localStorage.setItem(<key>, <value>) gebruiken.

window.localStorage.setItem('username', 'MBO-SD'); //Slaat MBO-SD op als username

Ophalen - .getItem()

Om informatie weer op tehalen gebruik je window.localStorage.getItem(<key>).

const currentUserName = window.localStorage.getItem('username'); //Haalt de opgeslagen waarde van MBO-SD op

Verwijderen - .removeItem()

Als jij of de gebruiker bepaalde informatie wil wissen gebruik je window.localStorage.removeItem(<key>).

window.localStorage.removeItem('username'); //Verwijderd de opgeslagen informatie

Alles verwijderen - .clear()

Wil je alle lokaal opgeslagen informatie wissen dan gebruik je window.localStorage.clear().

window.localStorage.clear(); //Verwijderd alles

Beperkingen/ aandachtspunten met localStorage

Er zijn situaties waarin je localStorage niet moet gebruiken of wanneer localStorage niet toereikend is;

• Je kan maximaal 5Mb opslaan aan data
• Sla nooit gevoelige informatie op zoals wachtwoorden, creditcard informatie en (zeer) persoonlijke gegevens
• Het is geen vervanger van het extern opslaan van informatie in bv. een database
• localStorage is geen veilige opslag manier, alle data is nietgecodeerd en kan door alle code op een website opgehaald worden