Ukládání dat v prohlížeči a implementace v systému Celebrio Masarykovy univerzity, Fakulta informatiky, Brno Jan Volmut Ukládání dat, které slouží k vyrovnání rychlosti požadavku na systmém a tím zrychluje celkovou odezvu v systému Celebrio probíhá na dvou úrovních. První úrovní je uchovávání často přistupovaných dat třetích stran (např. načítání zpravodajství a počasí z externích zdrojů). Toto je zprostředkováno na strojích, kde funguje Celebrio v podobě ukládání do relativně krátkodobé paměti. Druhou úrovní je uchovávání dat, které uživatel stahuje na svůj počítač ze vzdáleného stroje Celebria (např. obrázky, javascriptové soubory). V této krátké stati se věnuji druhé úrovni a zběžně popisuji důvody, nástroje a implementaci tohoto chování. Důvody pro uchovávání dat na straně uživatele Celebrio je systém, který funguje v prostředí “cloud” a přístup uživatele je realizován přes tenkého klienta (v současné chvíli je tímto klientem webové rozhraní). Pro zajištění funkčnosti systému i při nedostupnosti internetového spojení, bylo zapotřebí řešit problém, jak zobrazovat statická, ale především dynamická data, resp. vytvořit funkcionalitu, která upravuje systém dle nového stavu na základě starých dat. Benefitem z ukládání dat na klientově straně je zvýšení pocitu odezvy systému - data jsou “přednačtena” a při vhodné příležitosti se stáhnou data nová. Jaká data se ukládají Jednotlivé části systému jsou uživateli prezentovány pomocí webového prohlížeče. Ten však implicitně neukládá data tak, aby mohla být použita později (míněno ve smyslu plného offline režimu). Celebrio má za cíl fungovat, byť s určitými omezeními, bez dostupnosti internetu jako plnohodnotný systém. S postupnou implementací jednotlivých částí HTML5 do prohlížečů přicházejí nové možnosti, jak tohoto dosáhnout. Na straně klienta je třeba ukládat následující skupiny: 1. Data potřebná k zobrazení systému v offline režimu Struktura stránky, soubory .js a .css, obrázky, vlastní styly písma a další soubory potřebné ke správnému zobrazení vzhledu systému. 2. Vlastní obsahová data Relevantní data informačního charakteru - například data pro počasí, zpravodajství, přijatá pošta atd. Pro reprezentaci dat je třeba mít uložena i metadata a podle nich uživatele případně informovat o změnách (v pátek již není počasí na středu relevantní, uživateli jej nezobrazujeme). Možné technologie pro ukládání Ačkoli ve všech moderních prohlížečích existuje cache, která si uchovává načtená data pro potřeby Celebria nedostačuje, především proto, že je třeba uložit celou strukturu systému i další data trvale. Celebrio proto využívá některé nové technologie HTML5, jako je AppCache a Local storage ● AppCache (Aplikační cache) Slouží ke zpřístupnění dat prohlížeči i v offline režimu. Soubory, které se uloží u klienta jsou specifikovány v souboru typu manifest na straně serveru. Může obsahovat sekce, které například určí, že se některé soubory mají načítat výhradně ze vzdáleného stroje. Ukázka použití: V hlavičce stránky, která má být uložena je specifikován atribut manifest: Obsahem manifestu je seznam, který specifikuje, které soubory se budou ukládat. Příklad manifestu: CACHE MANIFEST # Weather Cache CACHE: #app based ../images/seniors/ScrollbarBackground.png ● WebStorage Toto úložiště je zpřístupněno prostřednictvím objektu Navigator pomocí jacascriptu. Funguje na bázi klíč-hodnota, tedy podobně jako asociativní pole. Rozhraní pro práci s těmito úložišti poskytuje jen strohý soubor funkcí jako jsou základní getItem(), clean(). Existují dvě varianty: ○ Session storage Data jsou uložena jen po dobu jednoho sezení (teoreticky než uživatel zavře prohlížeč či okno se stránkou). ○ Local Storage Data jsou dlouhodobě uložena, dokud nejsou přepsána nebo smazána. Právě toto úložiště je vhodné pro uložení dat, která uživateli budou zpřístupněna i po přerušení práce a výpadku spojení. Pozn.: Doporučená velikost pro jedno úložiště (vázané na doménu) je 5MB. ● Databáze (Web SQL, IndexedDB) Většina prohlížečů dnes do nových verzí implementuje i podporu nativních databází, které jsou přístupny pomocí javascriptu přímo ve webovém prohlížeči. Ukázka použití: var db = openDatabase('mydb', '1.0', 'my first database', 2*1024*1024); db.transaction(function (tx) { tx.executeSql('CREATE TABLE example (id unique, text)'); }); Problém v použití databází je, že prohlížeče založené na jádru webkit používají implementaci WebSQL, zatímco Firefox používá IndexedDB. Současným trendem se však zdá být spíše odklon od WebSQL. ● Souborový systém V nové verzi HTML byl představen koncept ukládání přímo do souborového systému, což nebylo dříve možné. Ohledně tohoto rozšíření jsou vedeny debaty, zda již javascript, který je k přístupu používán, nezasahuje příliš do “soukromí” počítače. Faktem však je, že JS přistupuje k vlastnímu vyhrazenému místu v souborovém systému a tím pádem by neměl být schopen ovlivnit okolní prostředí. Použití v Celebriu V současné chvíli je offline verze stále ve vývoji, nicméně jsou v systému již patrné výsledky. Konkrétně se jedná o aplikaci Počasí, která je připravena pro offline provoz. V následujícím stručném popisu je uvedeno, co je třeba vykonat a nač je třeba myslet při zavádění podpory offline režimu. Základní myšlenka a požadavky: Aplikace Počasí bude dostupná v offline režimu tak, že data budou uložena u klienta a při případné vícedenní nedostupnosti internetového spojení bude vizuální reprezentace dat upravována, podle aktuálního data. Tedy nebude se zobrazovat aktuální stav počasí (který logicky není dostupný). Navíc budou postupně odstraňovány dny, které již minuly. Při online přístupu se navíc jako první načtou data, která jsou uložena u uživatele a až při korektním získání nových dat budou nahrazena (toto povede k pocitu plynulejší práce se systémem). 1. Připravení aplikační cache Je nutné u klienta uložit stánku samotnou, obrázky pro typy počasí, javascriptové knihovny, kaskádové soubory apod. To obnáší zjistit a zapsat reference do souboru 2. Postup pro zobrazení a uložení dat Při zavádění offline podpory se ukázalo, že je třeba změnit myšlenku toku dat v aplikaci. Původně se data vykreslovala přímo: Kontroler -> Šablona -> Zobrazení. Nyní však tok dat vypadá takto: Zobrazení stránky-> načtení uložených dat -> zobrazení dat -> dotaz na nová data -> zobrazení nových dat -> nahrazení starých dat novými, v úložišti u klienta. Nový postup znamenal zásah do struktury hotové aplikace v servrové části a vykreslování nově přijatých dat obnášelo dynamické uspořádávání prvků na stránce pomocí javascriptu. 3. Udržování Vzhledem k dalšímu rozvoji aplikace, je potřeba rozvíjet i funkcionalitu pro ukládání dat, která je s vývojem úzce spjata - odkazy na stránky s parametry v požadavku musí být pro offline podporu zpracovány jinak - větvení aplikace při různém přístupu na stejné místo. Poznámky Propojení online - offline systému Počasí je aplikace převážně prezentační, uživatel nemá moc prostředků, jak měnit data a ovlivňovat tak systém. Některé aplikace ovšem interakci uživatele předpokládají (např. email, nastavení systému). V případě aplikace Nastavení (změna hesla, nastavení emailu, nastavení pozadí) je patrné, že uživatel bude nějakým způsobem zasahovat do částí, od kterých očekává, že se aktivně změní. Tyto změny se jednak musejí promítnout okamžitě a zároveň po připojení k internetu vypropagovat na vzdálený stroj a tam být dále zpracovány. Nároky na prohlížeč Za pomoci nových technologií je možné efektivně vytvořit aplikaci, která bude pracovat i bez přístupu k internetu, avšak za cenu toho, že budou kladeny velké nároky na prvotní “investici” uživatele, tedy změnu prohlížeče, který používá. Většina technologií je totiž spjata s novějšími verzemi těchto prohlížečů. Další vývoj Vzhledem k tomu, že systém Celebrio dlouhodobě směřuje k offline podpoře, budou i další aplikace přetvořeny podobně, jako Počasí. Z již hotových aplikací, které tak jsou adepty, mohu pro příklad jmenovat například aplikaci Pošta. Zde Bude nutné ukládat doručené maily (v tomto případě by byla velmi vhodná právě databáze v prohlížeči), ukládat právě napsané a odeslané maily a ty poté odeslat, jakmile bude navázáno spojení se vzdáleným strojem. S tím také souvisí udržování offline seznamu kontaktů, na které je možné email odeslat. Další možností v rozvoji offline podpory může být nový klient, který je intenzivně připravován, a který bude mít v operačním systému větší autonomii, než webový prohlížeč a tím I větší možnosti. Použité zdroje: http://www.w3.org/TR/offline-webapps/ Appcache: http://www.zdrojak.cz/clanky/appcache-webove-aplikace-i-bez-pripojeni/ WebStorage: http://www.w3.org/TR/webstorage/ http://www.zdrojak.cz/clanky/webdesigneruv-pruvodce-po-html5-webstorage/ Databáze: http://html5doctor.com/introducing-web-sql-databases/ http://www.zdrojak.cz/clanky/webdesigneruv-pruvodce-po-html5-databaze-v-prohlizecich/