Jak korzystać z localStorage w JavaScript

Jak korzystać z localStorage w JavaScript

Mechanizm localStorage zapewnia rodzaj obiektu magazynowania sieci Web, który umożliwia przechowywanie i pobieranie danych w przeglądarce. Możesz przechowywać i uzyskiwać dostęp do danych bez wygaśnięcia; dane będą dostępne nawet po zamknięciu witryny przez użytkownika.





Zwykle uzyskujesz dostęp do localStorage za pomocą JavaScript. Za pomocą niewielkiej ilości kodu możesz zbudować przykładowy projekt, taki jak licznik wyników. To pokaże, w jaki sposób można przechowywać i uzyskiwać dostęp do trwałych danych przy użyciu tylko kodu po stronie klienta.





Co to jest localStorage w JavaScript?

Obiekt localStorage jest częścią interfejsu API magazynu WWW obsługiwanego przez większość przeglądarek WWW. Za pomocą localStorage możesz przechowywać dane jako pary klucz-wartość. Unikalne klucze i wartości powinny być w formacie UTF-16 DOM String.





Jeśli chcesz przechowywać obiekty lub tablice, musisz przekonwertować je na ciągi za pomocą JSON.stringify() metoda. Możesz przechowywać do 5 MB danych w localStorage. Ponadto wszystkie okna o tym samym pochodzeniu mogą udostępniać dane localStorage tej witryny.

Przeglądarka nie usunie tych danych, nawet gdy użytkownik je zamknie. Będzie on dostępny dla serwisu, który go utworzył, podczas każdej przyszłej sesji. Nie należy jednak używać localStorage do poufnych danych, ponieważ inne skrypty działające na tej samej stronie mogą uzyskać do nich dostęp.



localStorage a sessionStorage

The localStorage i sessionStorage obiekty są częścią interfejsu Web Storage API, który przechowuje lokalnie pary klucz-wartość. Wszystkie nowoczesne przeglądarki obsługują je obie. Dzięki localStorage dane nie wygasają nawet po zamknięciu przeglądarki przez użytkownika. Różni się to od sessionStorage, która czyści dane po zakończeniu sesji strony. Sesja strony kończy się po zamknięciu karty lub okna.