Jaká bude náhrada za cookies?

Webové aplikace často potřebují ukládat data u klienta mezi jednotlivými požadavky a sezeními. Zatím se pro tento účel využívají cookies. Na některé úkoly však cookies nestačí. Čím je tedy v budoucnu nahradíme?

Nevýhody cookies

Jejich maximální velikost je velmi skromná (4 kB na jeden cookie) a mohou uchovávat jenom textové řetězce. Webové aplikace dnes už ale potřebují ukládat větší objem dat, a to v komplexnější podobě. Tato potřeba časem jistě poroste.

Nepříjemné je také to, že cookies jsou součástí každého HTTP požadavku, a tím dochází k jejich odesílání přes Internet.

Další problém se může projevit, když budeme pracovat ve více oknech s jednou a tou samou webovou aplikací, ovšem v každém okně vždy na jiném úkolu – průběžně ukládaná data se budou ukládat do jednoho cookie a vzájemně se přepisovat.

Storage API

Rozhraní Storage, které je je definováno ve formátu IDL, definuje dva typy virtuálního úložiště – sessionStorage a localStorage. První z nich je určený k uchovávání dat platných po dobu aktuální relace (tj. do zavření okna nebo panelu prohlížeče). Prohlížeče, které umožňují relace obnovovat však budou tato data uchovávat dokud bude relace obnovitelná. Každá relace disponuje svou vlastní kopií úložného datového prostoru, což řeší výše zmíněný problém s přepisováním dat.

Druhý typ úložiště zase představuje časově nelimitovaný úložný prostor. Prohlížeče by data v něm neměli automaticky mazat, jakmile dojde alokovaný prostor, ale navrhnout uživateli tento prostor rozšířit. Prakticky se bude jednat o celou sadu úložišť, protože každá stránka bude moci mít své vlastní lokální úložiště.

Data v těchto úložištích jsou uskladněna v podobě seznamu položek. Každá položka je tvořena dvojicí klíč : hodnota. Počet položek v daném úložišti zjistíme pomocí vlastnosti length.

alert(localStorage.length); // v dialogovém okně zobrazí údaj o počtu položek

Kromě této vlastnosti mají objekty sessionStorage a localStorage i řadu metod.

sessionStorage.nazev_klice = "nová hodnota"; // změní hodnotu asociovanou ke klíči nazev_klice

alert(sessionStorage.nazev_klice); // zobrazí hodnotu asociovanou ke klíči nazev_klice

Stejně jako ostatní javascriptové objekty lze i objekty localStorage a sessionStorage považovat za jakési asociativní pole. Tudíž se pro přístup k jednotlivým položkám dají využít hranaté závorky jako v tomto příkladě:

sessionStorage["nazev_klice"] = "nova hodnota";

Změna v objektu, např. přidání nebo smazání položky, vyvolá událost onstorage na daném objektu. Funkci, která je na tuto událost navázána se pak předává objekt StorageEvent (v IE to tak funguje až od 9. verze), který má tyto užitečné vlastnosti:

Tato datová úložiště podporuje od osmé verze i Internet Explorer.

Databáze

Vysvětlili jsme si, že do sessionStorage a localStorage lze ukládat pouze položky v podobě párů asociovaných řetězců. Ne vždy ale takové jednoduché schéma dostačuje. Pro ukládání strukturovanějších dat by bylo určitě vhodnější nějaké databázové schéma. Stručně si teď popíšeme jeden z návrhů tohoto schématu.

Každá databáze má jméno a aktuální verzi. Ve jméně se rozlišuje velikost písmen. Verze je číslo, které se inkrementálně navyšuje a není možné jej libovolně přepisovat. Tímto způsobem je zabráněno tomu, aby existovalo současně více databází stejného jména a shodné verze. Nemělo by se díky tomu ani stávat, že nové údaje budou přepisovány starými.

Metoda openDatabase(), která používá a vytváří databázi, má následující argumenty: jméno databáze, jméno verze, titulek, odhad objemu ukládaných dat (v bytech) a volitelně funkci, která zjišťuje, zda už byla databáze vytvořena. Odhad objemu ukládaných dat je tím důležitější, čím větší množství dat se ukládá, aplikace se tak může pokusit alokovat potřebný prostor naráz. Callback (tj. funkce s návratovou hodnotou) v posledním argumentu má význam zejména ve spojení s metodou changeVersion(), která ověří číslo verze databáze a případně ho updatuje na aktuální.

Samotné zapisování nebo načítání dat je realizováno za pomoci SQL požadavků. Ty jsou vloženy do prvního argumentu metody executeSql() objektu SQLTransaction, která je zase volána přes první argument metod transaction() a readTransaction() u objektu Database, který reprezentuje danou databázi. Metoda readTransaction() je omezena na mód read-only.

Prohlížeče by měly uživatelům umožnit nastavit restriktivní pravidla pro ukládání dat a přístup k nim. A to hlavně z toho důvodu, že se v těchto databázích mohou ocitat i citlivé údaje typu e-mailů, zdravotních záznamů apod. Stejně tak by měli mít uživatelé kontrolu nad objemem dat, která na svůj disk ukládají.

Toto řešení nepodporují prohlížeče Firefox a Internet Explorer. Pro ukládání strukturovaných dat bude tedy lepší využít IndexedDB.