Web storage

Web storage (česky „webové úložiště“) je HTML API umožňující webovým aplikacím ukládat data do webového prohlížeče na straně uživatele. Data jsou ukládána ve formátu klíč – hodnota. Webové úložiště může být využíváno pro dočasné či trvalé uložení parametrů spojených s daným uživatelem v souvislosti s jeho aktivitami na vybraném webu. Jsou definovány dva typy web storage: local storage a session storage. Liší se životností a rozsahem. Na první pohled by se mohlo zdát, že web storage a cookies jsou jedno a to samé, avšak web storage má oproti souborům cookies mnoho výhod (viz Rozdíl mezi web storage a Cookies). Web storage je standardizován konsorciem World Wide Web Consortium (W3C) a je podporováno většinou moderních webových prohlížečů.

Rozdíl mezi web storage a Cookies

Sobory cookies slouží, stejně jako web storage, k ukládání dat na straně klienta. Jsou přenášeny prostřednictvím HTTP protokolu. Uživatel si na většině webových stránek může nastavit své preference, tedy jaké soubory cookies si přeje ukládat a poskytovat webovým aplikacím, a jaké soubory mají být naopak vynechány či zakázány.

Soubory cookies se převážně využívají za účelem personalizace webových aplikací. Ty tak zaznamenávají návštěvníkovy předvolby a aktivity a při opětovné návštěvě pomáhají načíst data z poslední relace, případně zobrazovat relevantní obsah a hlavně jednoznačně identifikovat návštěvníka. Soubory cookies lze upravovat pomocí HTTP hlavičky nebo pomocí JavaScriptu.

Oproti web storage mají však soubory cookies několik podstatných nevýhod. Webové úložiště má ve srovnání s cookies mnohem větší kapacitu pro ukládání dat. Cookies mají k dispozici 4 KB paměti, zatímco web storages mají k dispozici v průměru od 5 do 10 MB. Důvodem, proč mají tak nízký limit je, že jsou přenášeny každým HTTP požadavkem, naopak web storage uchovává data na straně klienta v jeho prohlížeči, odkud lze s těmito daty operovat pomocí JavaScriptu. Web storage tak umožňuje uchovávat na straně klienta objemná data, jako jsou celé dokumenty či poštovní schránka uživatele. Pro řešení tohoto konkrétního případu je vhodné využít local storage.

Cookies nedokážou řešit situaci, kdy uživatel webové aplikace provádí operace na jedné a té samé webové stránce ve dvou oknech webového prohlížeče zároveň. Praktickým příkladem je nákup realizovaný pomocí e-shopu. Klient by bez využití web storage mohl závazně potvrdit objednávku dvakrát, aniž by na to byl upozorněn. Tento problém řeší session storage.

Local storage a Session storage

Existují dva typy webových úložišť: local storage a session storage.

Local Storage

Umožňuje uchovávat větší množství dat na dobu neurčitou, tedy do doby, než jsou webová úložiště odstraněna uživatelem. V případě vypnutí prohlížeče či samotného zařízení nedochází k vymazání těchto dat. Data uložená v local storage jsou k dispozici ve všech oknech daného webového prohlížeče a jsou přístupná pouze pro webové stránky, které mají s local storage stejný původ.

Způsob přístupu k local storage pomocí java scriptu

Metoda pro ukládání dat do local storage:

localStorage.setItem(key, value);

Metoda pro získávání dat z local storage:

localStorage.getItem(key);

Metoda pro získání klíče na základě pořadí:

localStorage.key(number);

Metoda pro odebrání konkrétních dat na základě klíče:

localStorage.removeItem(key);

Metoda pro vymazání local storage:

localStorage.clear();

Vypisování počtu uložených dvojic klíč a hodnota v local storage:

localStorage.length;

„Key“ představuje proměnnou klíče objektu vkládaného do local storage, díky tomuto klíči je poté možné daný objekt uložený v proměnné „value“ z local storage vyzvednout.

„Number“ reprezentuje číselnou proměnnou pořadí záznamu v local storage.

Session Storage

Umožňuje ukládat data na straně klienta jen po dobu trvání relace. V momentě, kdy uživatel opustí stránku, či je relace ukončena nějakým jiným způsobem, je toto úložiště vymazáno. Session storage zpřístupňuje data napříč všemi okny prohlížeče webovým stránkám, jež mají stejný původ jako data uložená v session storage. Tato vlastnost přináší velkou výhodu oproti užívání cookies souborů, které nedokážou dynamicky reagovat na změny realizované v jiném okně prohlížeče na stejné webové stránce.

Způsob přístupu k session storage pomocí java scriptu

Metoda pro ukládání dat do session storage:

sessionlStorage.setItem(key, value);

Metoda pro získávání dat ze session storage:

sessionStorage.getItem(key);

Metoda pro získání klíče na základě pořadí:

sessionStorage.key(number);

Metoda pro odebrání konkrétních dat na základě klíče:

sessionStorage.removeItem(key);

Metoda pro vymazání session storage:

sessionlStorage.clear();

Vypisování počtu uložených dvojic klíč a hodnota v session storage:

sessionStorage.length;

„Key“ představuje proměnnou klíče objektu vkládaného do session storage, díky tomuto klíči je poté možné daný objekt uložený v proměnné „value“ ze session storage vyzvednout.

„Number“ reprezentuje číselnou proměnnou pořadí záznamu v session storage.

Podpora u webových prohlížečů

Web storage má podporu ve většině moderních prohlížečů. Podrobnější informace jsou uvedeny v následujících tabulkách.

Local storage

Typ prohlížeče	Prohlížeč	Verze, od které je podporován
Desktopový prohlížeč	Chrome	4
	Edge	12
	Firefox	3.5
	Internet Explorer	8
	Opera	10.5
	Safari	4
Mobilní prohlížeč	Android webview	<=37
	Chrome for Android	18
	Firefox for Android	4
	Opera for Android	11
	Safari on iOS	3.2
	Samsung Internet	1.0

Obsah tabulky čerpán z webu developer.mozilla.org.

Session storage

Typ prohlížeče	Prohlížeč	Verze, od které je podporován
Desktopový prohlížeč	Chrome	5
	Edge	12
	Firefox	2
	Internet Explorer	8
	Opera	10.5
	Safari	4
Mobilní prohlížeč	Android webview	<=37
	Chrome for Android	18
	Firefox for Android	4
	Opera for Android	11
	Safari on iOS	3.2
	Samsung Internet	1.0

Obsah tabulky čerpán z webu developer.mozilla.org.

Local storage, session storage a utajený režim

Většina moderních prohlížečů nabízí svým uživatelům funkcionalitu pro soukromé procházení webu. Tato funkcionalita se často nazývá jako „soukromý režim“ nebo „inkognito režim“ a jejím hlavním cílem je zabránit ukládání souborů cookies a historie prohlížení.  Způsob, jakým se prohlížeče vyrovnávají s web storage v tomto režimu, není jednotně stanoven, a tak každý prohlížeč řeší tuto problematiku jinak.

U většiny prohlížečů je v tomto režimu web storage stále dostupný, ale po uzavření prohlížeče nebo soukromého okna se veškeré údaje z úložišť vymažou. Prohlížeč Safari se s web storage vypořádává tak, že sice jeho funkci podporuje, nicméně úložišti je vyhrazena paměť o velikosti 0 bajtů. V důsledku toho není možné do úložiště cokoliv zapsat.

Bezpečnost web storage

Web storage, stejně jako cookies soubory, lze modifikovat, a tak útočník může data v těchto úložištích pozměnit. Proto je potřeba přistupovat k datům uloženým ve web storage jako k datům z uživatelských vstupů, to znamená před uložením dat na straně serveru nebo vypsáním dat přímo do stránky provést vždy ošetření speciálních znaků, aby nedošlo k cross-site scripting či SQL injection útokům.

Web storage rovněž nemá žádnou ochranu proti cross-directory útokům. Pokud se o jednu doménu dělí vice uživatelů, mohou všichni tito uživatelé přistupovat stejným způsobem k web storage klienta.

Další riziko zneužití web storage může nastat, pokud internetová stránka dovoluje webům třetích stran číst a zapisovat data náležící jiné doméně. Tento typ útoku se nazývá information spoofing. Weby třetích stran tak mohou sledovat aktivitu uživatelů na napadené internetové stránce.

Reference

Portály: Internet