Využití technologie AJAX v Univerzitním informačním systému

Mendelova zemědělská a lesnická univerzita v Brně Provozně ekonomická fakulta

Využití technologie AJAX v Univerzitním informačním systému Bakalářská práce

Vedoucí práce: Ing. Tomáš Majer

Jan Dvořák

Brno 2006

Na tomto místě bych rád poděkoval svému vedoucímu Ing. Tomáši Majerovi za jeho cenné rady, připomínky a nápady. Dále děkuji všem svým kolegům z vývojového týmu za pomoc a psychickou podporu při psaní této práce.

Prohlašuji, že jsem tuto bakalářskou práci vytvořil samostatně dle pokynů vedoucího práce a za použití zdrojů, které jsou uvedeny v závěru práce. Řešení využívá prostředků Univerzitního informačního systému, který vznikl prací desítek členů vývojového týmu.

V Brně dne 13. června 2006

....................................................

Abstract Dvořák, J. Application of the AJAX Technology in the University Information System. Bachelor thesis. Brno 2006. This thesis covers the possibilities of implementing the AJAX technology in the University Information System at MUAF Brno. First, I define the theoretical foundations of my thesis regarding the information systems, the web technology and the HTTP protocol in general. Further on, I analyse the AJAX technology, including its advantages, disadvantages and its application within the UIS. I also include a description of the implementation of searching in the UIS employing the technology.

Abstrakt Dvořák, J. Využití technologie AJAX v Univerzitním informačním systému. Bakalářská práce. Brno 2006. Práce se zabývá možnostmi implementace technologie AJAX v Univerzitním informačním systému MZLU v Brně. Nejprve jsou uvedena teoretická východiska práce tykající se obecně informačních systémů, webových technologií a protokolu HTTP. Dále je podrobně rozebrána technologie AJAX včetně jejích výhod, nevýhod a možností jejího využití v rámci UIS. Součástí práce je také popis implementace vyhledávání v UIS pomocí této technologie.

4

OBSAH

Obsah 1 Úvod a cíl práce 1.1 Úvod . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 1.2 Cíl práce . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .

7 7 7

2 Definice pojmů

8

3 Architektury informačních 3.1 Globální architektura . . 3.2 Dílčí architektury . . . . 3.3 Horizontální struktura . 3.4 Vrstvená architektura . .

systémů . . . . . . . . . . . . . . . . . . . . . . . .

. . . .

. . . .

. . . .

4 Webové technologie 4.1 JavaScript . . . . . . . . . . . . . . . . . 4.1.1 Klientský JavaScript . . . . . . . 4.2 DOM . . . . . . . . . . . . . . . . . . . . 4.2.1 Struktura dokumentu a objektový 4.2.2 Úrovně a moduly . . . . . . . . . 4.3 HTML . . . . . . . . . . . . . . . . . . . 4.3.1 Vývoj jazyka . . . . . . . . . . . 4.3.2 Verze jazyka . . . . . . . . . . . . 4.3.3 Koncepce jazyka . . . . . . . . . 4.3.4 Struktura dokumentu . . . . . . . 4.3.5 Druhy značek . . . . . . . . . . . 4.3.6 Parsování v prohlížečích . . . . . 4.4 XML . . . . . . . . . . . . . . . . . . . . 4.4.1 Vlastnosti XML . . . . . . . . . . 4.5 CSS . . . . . . . . . . . . . . . . . . . . 4.6 XMLHttpRequest . . . . . . . . . . . . .

. . . .

. . . .

. . . .

. . . .

. . . . . . . . . . . . model . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .

. . . .

. . . . . . . . . . . . . . . .

. . . .

. . . . . . . . . . . . . . . .

. . . .

. . . . . . . . . . . . . . . .

. . . .

. . . . . . . . . . . . . . . .

. . . .

. . . . . . . . . . . . . . . .

. . . .

. . . . . . . . . . . . . . . .

. . . .

. . . . . . . . . . . . . . . .

. . . .

. . . . . . . . . . . . . . . .

. . . .

. . . . . . . . . . . . . . . .

. . . .

. . . . . . . . . . . . . . . .

. . . .

. . . . . . . . . . . . . . . .

. . . .

10 10 12 13 13

. . . . . . . . . . . . . . . .

15 15 16 16 17 18 18 19 19 20 20 21 21 22 22 25 26

5 HTTP 27 5.1 Jak pracuje HTTP protokol . . . . . . . . . . . . . . . . . . . . . . . 27 5.2 Rozšíření verze 1. 1 . . . . . . . . . . . . . . . . . . . . . . . . . . . . 28 6 AJAX 6.1 Výhody . . . . . . . . . . . . . . 6.2 Nevýhody . . . . . . . . . . . . . 6.3 Možná řešení některých problémů 6.4 Efektivnost z hlediska uživatelů . 6.5 Konkrétní aplikace v praxi . . . . 6.6 Využití v UIS . . . . . . . . . . .

. . . . . .

. . . . . .

. . . . . .

. . . . . .

. . . . . .

. . . . . .

. . . . . .

. . . . . .

. . . . . .

. . . . . .

. . . . . .

. . . . . .

. . . . . .

. . . . . .

. . . . . .

. . . . . .

. . . . . .

. . . . . .

. . . . . .

. . . . . .

30 32 32 32 33 33 34

5

OBSAH

7 Implementace 36 7.1 Implementační prostředí . . . . . . . . . . . . . . . . . . . . . . . . . 36 7.2 Vlastní realizace . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 37 8 Závěr

39

9 Literatura

40

Přílohy

42

A Vazby DOM modulů

43

B XMLHttpRequest

44

6

1

1 1.1

ÚVOD A CÍL PRÁCE

Úvod a cíl práce Úvod

S rychlým vývojem v oblasti informačních technologií velmi získaly na důležitosti informační systémy. Informační systémy se tak v posledních letech staly nedílnou součástí mnoha organizací, ať už se jedná o organizace řízené státem nebo soukromé firmy a bez ohledu na jejich velikost. K tomuto jevu došlo zejména díky rostoucí potřebě informací. Informační systémy je pomohou získat přesně a rychle. Mnoho lidí si již dnes nedokáže bez informačních systémů představit svůj život a je zřejmé, že takových lidí bude nadále přibývat. Informační systémy nám ulehčují život v mnoha oblastech mimo jiné také ve školství. Mezi školy využívající všech výhod informačních systémů se řadí také Mendelova zemědělská a lesnická univerzita v Brně (dále MZLU v Brně) a to již od roku 2002, tedy od doby, kdy byl spuštěn vlastní Univerzitní informační systém (dále jen UIS). S rostoucím počtem uživatelů informačních systémů vznikají také nové požadavky na tyto systémy a to hlavně ze strany uživatelského komfortu. Nestačí jen zajistit vynikající funkcionalitu systému, ale je třeba též vytvořit uživatelsky přívětivé prostředí. Více o uživatelské přívětivosti pojednává publikace (Netrefová, 2005). Většina vývojářů informačních systémů se tedy snaží nejenom vytvořit výkonný IS, ale také ho „odít do líbivého hávuÿ. K tomuto účelu slouží celá řada nástrojů. Pro webové IS se mezi ně řadí použití moderních webových technologií. Jednou z těchto technologií je také v poslední době mohutně nastupující technologie zvaná AJAX. Tato technologie byla delší dobu opomíjena, ale díky jejímu zpopularizování společností Google dochází nyní k jejímu častému nasazování v mnoha různých webových aplikacích. Díky snaze o stálé zlepšování kvality práce uživatelů s UIS jsem se rozhodl, že zjistím možnosti využití technologie AJAX v tomto komplikovaném prostředí.

1.2

Cíl práce

Hlavním cílem této práce je prozkoumat možnosti technologie AJAX a jejího nasazení v prostředí UIS. V první řadě bude nutné se seznámit obecně s informačními systémy, protože do tohoto prostředí bude výše zmíněná technologie implementována. Dále bude důležité se podrobně seznámit se samotnou technologií AJAX. Pro její pochopení bude nezbytné nastudovat všechny technologie, které AJAX využívá pro svou práci. Poté bude provedena analýza možností nasazení této technologie do UIS a také zhodnocení vlivu na efektivnost práce uživatelů. Závěrem na základě zjištěných informací bude provedena implementace technologie AJAX do UIS.

7

2

2

DEFINICE POJMŮ

Definice pojmů

Podstatná část této práce je věnována problematice informačních systémů a informačních a komunikačních technologií, proto je velmi vhodné hned z počátku definovat některé základní pojmy. Znalost těchto pojmů je důležitá pro plné pochopení této práce. Informace Název informace pochází z latinského informo, což znamená přenášet zprávu, oznámení, poučení a lze ji mimo jiné definovat jako míru množství neurčitosti nebo nejistoty o nějakém náhodném ději odstraněnou realizací tohoto děje. Informace je taktéž pojmem, který je velmi často charakterizován následujícími základními vlastnostmi: • informace je nehmotná, • doplňuje nám poznatky o jistých skutečnostech (snižuje entropii), • může být obsažena jak ve znacích (resp. signálech) tak i v jejich vzájemném uspořádání, • znaky a signály poskytují informaci pouze tomu, kdo jim rozumí, tedy tomu kdo je schopen rozpoznat jejich syntaxi a sémantiku. Data Data můžeme chápat jako informace, které jsou zaznamenány pomocí prostředků výpočetní techniky a dále zpracovávány ve výpočetních systémech. Data se stávají informacemi v momentě, kdy rozšiřují naše znalosti o zkoumané realitě. Můžeme tedy říci, že každá informace je součástí dat, ale každá data nemusí nutně obsahovat informaci. Systém Systém je nejčastěji definován jako komplex prvků nacházejících se ve vzájemné interakci. U systémů zkoumáme dvě základní vlastnosti: strukturu a chování. Struktura systému je množina prvků systému a jejich vzájemných vazeb. Chováním systému pak rozumíme způsob reakce systému na vstupní podněty. Další důležitou otázkou při studiu systému je jeho okolí. Okolí systému chápeme jako účelově definovanou množinu prvků, které do systému nepatří, ale vykazují k němu nějaké vazby, většinou přes hraniční prvky. A konečně hraničním prvkem nazýváme takový prvek systému, který má alespoň jednu vazbu na prvek, který do systému nepatří. Informační systém Informační systém (IS) je identifikovatelný funkční celek zabezpečující cílevědomé a systematické shromaždování, zpracovávání, uchovávání a zpřístupňování informací uložených na hmotném nosiči v údajových základnách a reprodukovatelných technickými prostředky. Informační systém zahrnuje informační základnu (data), technické a programové prostředky, technologie, finanční prostředky, procedury a pracovníky. Informační systém může ale nemusí zahrnovat počítačový systém nebo subsystém. Informační systémy tvoříme na základě současné informační a komunikační technologie. 8

2

DEFINICE POJMŮ

Informační technologie Pojem informační technologie (IT) představuje soubor nástrojů, metod a znalostí sloužících k činnostem, k nimž je informační systém určen (sběr, zpracování, uchování, přenos a prezentace informací). Informační technologie rovněž zahrnují zákonitosti vývoje a výroby informačních produktů – tedy především informačních systémů. Často tento pojem také představuje základní směr myšlení jedné epochy nebo jedné kultury (informační generace, informační kultura, informační společnost). Technologie je správný název pro to, čemu dnes někdy nesprávně říkáme technika (technika jsou pouze hmotné prostředky sloužící určité technologii k dosažení cíle). Internet Internet představuje celosvětový systém propojených počítačových sítí (tzv. síť sítí), které jsou schopny si navzájem vyměnovat informace pomocí protokolu TCP/IP a přenášet tak data mezi libovolnými místy na Zemi. Umožňuje komunikaci mezi lidmi a přístup k širokému spektru služeb a informací. Jedná se o zcela převratný prostředek komunikace na celém světě. Sítě založené na stejném principu jako Internet nazýváme internety a dělíme je na extranety (sítě mimo firmy) a intranety (sítě uvnitř firem). Nejvýznamňejší službou internetových sítí je world wide web. World wide web World wide web (WWW, web) představuje nejrozšířenější službu na internetu. Jedná se o graficky orientované prostředí hypertextových dokumentů zvaných www stránky, využívá moderní multimediální techniky (obrázky, zvuky, animace). Hypertextový dokument umožňuje pomocí odkazů propojit významově blízké dokumenty. Stránky mohou být statické (předem připravené) nebo dynamické (generované v okamžiku požadavku např. webovým informačním systémem). Pro zobrazení informací na webových stránkách se používá internetový prohlížeč. Uživatelská přívětivost Pojem uživatelské přívětivosti je velmi široký a každý si pod ním může představit něco jiného. Slovník říká, že uživatelsky přívětivá je taková ergonomicky propracovaná aplikace, která na uživatele klade minimální nároky související se svojí obsluhou a nezpůsobuje jeho dezorientaci. Uživatelsky přívětivý informační systém je pak takový systém, který poskytuje svým uživatelům maximální komfort při jeho používání. Uživatelská přívětivost má dva základní aspekty. Prvním je pohled uživatelů, kteří vyžadují komfortní uživatelské rozhraní a mají určité požadavky a představy, jak má toto rozhraní vypadat, jaké má mít funkce a chování. Druhým hlediskem je pak pohled vývojářů realizujících informační systém. Sem zahrnujeme rozsáhlou oblast metodiky tvorby aplikací týkajících se uživatelského rozhraní a jejich zakomponování do architektury celého systému.

9

3

3

ARCHITEKTURY INFORMAČNÍCH SYSTÉMŮ

Architektury informačních systémů

Architektura informačního systému zahrnuje jeho budoucí podobu, jednotlivé komponenty systému a vazby mezi nimi. Každý informační systém většího rozsahu by měl obsahovat vnitřní strukturu, která umožní efektivně plnit funkce a cíle, pro něž byl navržen. Aby informační systém splňoval potřebné vlastnosti, musí jeho architektura podporovat: • strategické cíle podniku – trendem je snižování nákladů, zvyšování kvality výrobků a služeb, zlepšení dobrého jména firmy, modernizace pracovního prostředí, • všechny uživatelské požadavky směřující k dosažení strategických cílů podniku, • hardwarovou, softwarovou a datovou integraci – data jsou uložena pouze jednou a přístupná všem aplikacím, uživatelské rozhraní se drží zažitých standardů, jednotlivé softwarové moduly spolu vzájemně komunikují a spolupracují, • systém musí být rozšiřitelný a parametrizovatelný – nebude problém rozšířit stávající systém o další hardwarové a programové komponenty, určité konstanty jsou nastavitelné přes uživatelské rozhraní, • efektivní a spolehlivé zpracování dat – zajištění dostatečně rychlé odezvy operací, zajištění konzistence dat při havárii systému, zabezpečení dat před zneužitím.

3.1

Globální architektura

Globální architektura je základní schéma znázorňující hrubou podobu budovaného informačního systému. Základem globální architektury jsou skupiny aplikací, jejich funkce a datová základna. V globální architektuře jsou vynechány veškeré detaily, aby byla co nejjednodušší a srozumitelná. Architektura vytváří poměrně stabilní rámec pro řízení tvorby informačního systému, do něhož jsou postupně začleňovány jednotlivé technologické a programové součásti v závislosti na potřebách a podmínkách podniku. Globální architektura slouží jako prostředek komunikace mezi zadavatelem a realizátorem informačního systému, pomáhá při definici priorit nasazování informačního systému do provozu. Dobře provedený návrh architektury systému pomáhá minimalizovat dodatečné náklady spojené s chybným zadáním. Jednotlivé komponenty architektury musí být v souladu s podnikovou strategií, funkčními a řídícími postupy v podniku a musí zajišťovat flexibilní přizpůsobení se měnícím se podnikovým procesům. Globální architektura zahrnuje také specifikaci potřebného stupně spolehlivosti – odolnost proti technickým závadám, negativním zásahům obsluhy apod. Postupem času došlo ke značné standardizaci základních stavebních bloků globální architektury. Tato standardní architektura je zobrazována jako pyramida rozdělená podle tří úrovní řízení podniku. Viz obr. 1.

10

3.1

Globální architektura

Obrázek 1: Základní bloky globální architektury

Konkrétní podoba architektury systému je ovlivněna řadou faktorů. Předmět činnosti podniku ovlivňuje vrstvu operativního řízení podniku, organizační struktura (hierarchická nebo plochá, centrálně nebo decentralizovaně řízená) spoluvytváří způsob komunikace mezi řídícími pracovníky. Je nutné brát v úvahu rozmístění jednotlivých pracovišť podniku (jedna lokalita nebo dislokace na více místech), umístění některých pracovišť na území jiných států (jiná legislativa a další odlišnosti zahraničního prostředí). Nezanedbatelným hlediskem je možnost využití stávajícího technologického a technického vybavení a personálních zdrojů v novém systému. Operativní řízení podniku TPS (Transaction Processing System) reprezentuje bloky činností podniku na úrovni operativního řízení. Jejich funkce jsou prováděny rutinně, je požadována vysoká rychlost odezev a spolehlivost. Skladba aplikací je velmi silně závislá na charakteru podniku (výrobní podnik, malosériová nebo kusová výroba, hromadná výroba, podnik poskytující služby, obchodní společnosti). Blok TPS může obsahovat i další podpůrné komponenty jako např. CAD systémy. Taktické řízení podniku MIS (Management Information System) podporuje taktické řízení podniku (střednědobý horizont) a navazuje na vrstvu operativního řízení. Na základě ucelených a sumarizovaných dat z TPS umožňuje kontrolovat a řídit základní podnikové aktivity. Aplikace řeší oblasti: • ekonomiky (účetnictví, evidence majetku, závazků a pohledávek, finanční řízení), • organizace podniku (personalistika a mzdy), • obchodu. Tyto aplikace se podobají ve většině podniků bez ohledu na jejich zaměření.

11

3.2

Dílčí architektury

Strategické řízení podniku EIS (Executive Information System) obsahuje aplikace určené ke strategickému řízení podniku. Aplikace využívají data poskytovaná nižšími vrstvami (tj. TPS a MIS) i data z externích zdrojů k analýze a poskytování informací pro strategická rozhodnutí vrcholového vedení podniku. Data jsou sledována i dlouho do minulosti. Součástí jsou systémy pro podporu rozhodování (DSS – Decision Support System). Kancelářské systémy OIS (Office Information System) zastupuje sadu aplikací zaměřených na podporu kancelářských prací. Obsahuje nejčastěji: • textový procesor, • tabulkový procesor, • software pro tvorbu prezentací, • plánovací kalendář, • aplikace podpory týmové práce, • klienta elektronické pošty, • prohlížeč webových stránek. Komunikace s okolím EDI (Electronic Data Interchange) představuje aplikace zajišťující elektronickou komunikaci s okolím podniku – dodavatelé a odběratelé, zákazníci, banky, státní instituce. V této oblasti se již v širokém měřítku prosadilo využití možností poskytovaných sítí Internet.

3.2

Dílčí architektury

Na globální architekturu navazují dílčí architektury prohlubující návrh do větších detailů – funkční, procesní, datová, technologická, softwarová a hardwarová. • Funkční architektura obsahuje rozklad základních funkčních bloků do menších funkčních celků. Nejvyšším stupněm dekompozice je rozklad funkcí na elementární (atomické) operace (transakce). • Procesní architektura popisuje probíhající činnosti v podniku. Na nejvyšším stupni abstrakce je při modelování využit kontextový diagram, na nižších stupních pak DFD diagramy (Data Flow Diagram). Procesy reprezentují místa transformace dat, jejich činnost je aktivována datovými toky nebo událostmi. Datové toky reprezentují vazby mezi prvky systému, zásobníky dat slouží k uchování potřebných dat a terminátory jsou prvky, které patří do okolí informačního systému. • Datová architektura definuje použitou datovou základnu pomocí entit, jejich atributů a vazeb mezi entitami. Při modelování je použit entitně–relační diagram (ERD). Entity lze chápat jako abstrakce množin objektů se stejnou logickou strukturou (stejnými atributy), vazby definují souvislost mezi objekty jedné, dvou nebo několika entit. Důležitou vlastností vazeb je jejich mohutnost (kardinalita). 12

3.3

Horizontální struktura

• Technologická architektura definuje způsob zpracování dat (interaktivní, dávkové, řízené událostmi, centralizované, distribuované), způsob práce aplikací (klient/server, peer-to-peer) a standardy uživatelského rozhraní. • Softwarová architektura specifikuje, z jakých programových komponent se bude celý systém skládat, určuje funkce jednotlivých komponent, jejich vstupní a výstupní data, algoritmy transformace dat, vývojové prostředí. Softwarová architektura také definuje vzájemnou spolupráci jednotlivých programových modulů. Základními typy softwarové architektury jsou lineární, hierarchická, vrstvená a síťová architektura. • Hardwarovou architekturou je určeno technické vybavení informačního systému. Jedná se nejen o servery, pracovní stanice, tiskárny, ale i jejich vzájemné propojení, použití záložních zdrojů napájení a zálohovacích zařízení.

3.3

Horizontální struktura

Jiným pohledem na strukturu informačního systému je pohled z hlediska jednotlivých složek podniku využívající tento systém. Při členění podniku na několik středisek jsou vytvářeny pro jednotlivá střediska jejich subsystémy. Při dalším členění středisek na oddělení a útvary vzniká stromová struktura. Příkladem můžou být subsystémy Výroba, Marketing, Management, Účetnictví a další členění subsystému Výroba na Nákup surovin, Kontrolu zásob apod.

3.4

Vrstvená architektura

V současnosti do pojmu architektura patří vnitřní systémová architektura a struktura implementačních vrstev umožňující přenášet systém mezi různými prostředími (jiný operační systém, změna databáze). Tato struktura se nazývá vrstvená architektura.

Obrázek 2: Vrstvená architektura

13

3.4

Vrstvená architektura

Nejjednodušším (a nejstarším) případem vrstvené architektury je jednovrstvá architektura, kdy všechny operace řešil jediný subsystém (tedy celý systém). Později vznikaly dvouvrstvé systémy pracující v režimu klient/server. Na straně serveru byla databázová vrstva, na straně klienta fungovala aplikační logika i prezentace dat uživateli. S růstem počtu databázových systémů, operačních systémů, požadavků na tvorbu integrovaných systémů a různých zařízení, pomocí kterých je možno budovat informační systémy, došlo ke vzniku třívrstvé architektury s těmito vrstvami: • prezentační vrstva, • aplikační vrstva, • datová vrstva. Třívrstvá architektura Na nejnižší úrovni je datová vrstva reprezentovaná databázovým systémem poskytujícím společnou datovou základnu různým dílčím systémům integrovaného informačního systému. Datová vrstva zajišťuje funkce pro vkládání, získávání a modifikaci dat, kontroluje integritu ukládaných dat, provádí jejich předzpracování a agregaci. Prostřední vrstvou je vrstva aplikační, která realizuje veškeré transformace (operace a výpočty) vstupních a výstupních dat. Protože leží mezi datovou a prezentační vrstvou, bývá označována pojmem middleware. Middleware je v komerčním světě též používán pro aplikační servery. Nejvyšší vrstvou (tedy nejblíže k uživateli systému) zajišťující prezentaci výsledků a vstup požadavků a povelů od uživatele je prezentační vrstva. Podle rozsahu zajišťovaných funkcí rozlišujeme klientské programy na tlusté a tenké klienty. Činnost tlustého klienta pokrývá prezentační vrstvu a zasahuje také částečně do vrstvy aplikační. Funkcionalita tenkého klienta je omezena na co nejjednodušší zprostředkování vstupů a výstupů mezi informačním systémem a uživatelem. Většinou je možné provozovat tenké klienty na různých zařízeních a operačních systémech. V případě realizace informačního systému v prostředí webu je klientem libovolný internetový prohlížeč (Procházka, 2006).

Obrázek 3: Třívrstvá architektura

14

4

4

WEBOVÉ TECHNOLOGIE

Webové technologie

Webových technologií existuje celá řada, některé se neustále vyvíjejí, jiné zůstávají v nezměněné podobě a samozřejmě vznikají technologie nové. Na tomto místě bych rád zmínil některých z nich. Jejich pochopení je základním teoretickým východiskem k technologii nové, které se týká tato práce, tedy technologie AJAX.

4.1

JavaScript

Jazyk JavaScript vymyslel v roce 1995 Brendan Eich ve firmě Netscape. Byl určen především pro použití v prohlížeči Netscape Navigator 2. 0, ale využíván byl i v serverových produktech firmy. Původně byl vyvíjen pod názvem LiveScript. Ohlášen byl společně se společností Sun 4. prosince 1995 jako doplněk k jazykům HTML (viz kap. 4.3) a Java. JavaScript byl v červenci 1997 standardizován asociací ECMA (Europen Computer Manufacturers Association) jako ECMAScript a v srpnu 1998 ISO (International Standards Organization) jako ISO 16262. Standard, který specifikuje ECMAScript, je standard ECMA-262 a byl vydán ve třech verzích. S první verzí je plně kompatibilní až JavaScript verze 1. 3. S poslední tedy třetí verzí je kompatibilní JavaScript verze 1. 5. Tato třetí verze byla přijata v prosinci 1999. V návrzích již také existuje čtvrtá verze ECMA-262, které by měl odpovídat JavaScript verze 2. 0. Mozilla ve svých produktech Firefox a Thunderbird řady 1. 0. x (vykreslovací jádro Gecko verze 1. 7 a nižší) implementovala JavaScript verze 1. 5. Ve Firefoxu a Thunderbirdu 1. 5 a SeaMonkey 1. 0 (Gecku verze 1. 8) je implementován JavaScript verze 1. 6. Společnost Microsoft uvolnila podobnou verzi JavaScript pod názvem JScript. Ten ve své verzi 5. 5 přibližně odpovídá JavaScriptu ve verzi 1. 5 a plně odpovídá standardu ECMA-262 verze 3. V Internet Exploreru verze 5. 5 je implementován JScript verze 5. 5 a ve verzi 6 JScript verze 5. 6, který se však od předchozí příliš neliší. JavaScript je interpretovaný programovací jazyk se základními objektově orientovanými schopnostmi. Univerzální jádro jazyka bylo vloženo do Mozilly (Netscape Navigatoru), Internet Exploreru a dalších webových prohlížečů. Pro webové programování bylo také rozšířeno přidáním objektů reprezentujících okno webového prohlížeče a jeho obsah. Tato klientská verze JavaScriptu umožňuje vložit do webových stránek proveditelný obsah – to znamená, že stránka na webu již nemusí být jen statickým dokumentem HTML, ale může obsahovat dynamické programy, které komunikují s uživatelem, řídí prohlížeč a dynamicky vytvářejí obsah HTML. Jádro jazyka JavaScript svými programovými konstrukcemi, jako je příkaz if, cyklus while a operátor &&, syntakticky připomíná programovací jazyky C, C++ a Javu. Avšak syntaxí podobnost končí. JavaScript je programovací jazyk bez typové kontroly, což znamená, že proměnné nemusí mít specifikovaný typ. Objekty v JavaScriptu se podobají spíše asociativním polím jazyka Perl, než strukturám v C nebo objektům v C++ a v Javě. Mechanismus dědičnosti objektové orientace Ja15

4.2

DOM

vaScriptu odpovídá prvkům málo rozšířených jazyků Self a NewtonScript a výrazně se liší od dědičnosti v C++ a Javě. Podobně jako Perl je JavaScript interpretovaný jazyk a mnohé myšlenky přebírá z jazyka Perl. Příkladem jsou jeho regulární výrazy a nástroje pro práci s poli. Ačkoli nemají JavaScript a Java mnoho společného, často se na webu využívá „spolupráceÿ těchto jazyků. Tyto dva jazyky mají odlišné sady schopností. JavaScript může řídit chování a obsah prohlížeče, ale nemůže kreslit grafiku nebo pracovat se sítí. Naopak Java má vlastnosti opačné. Java nemá žádnou kontrolu nad prohlížečem jako celkem, ale může vytvářet grafiku a pracovat se sítí. Klientský JavaScript může pracovat s applety Javy vloženými do webové stránky a řídit je. Touto kombinací lze získat mocný nástroj pro webové programování. 4.1.1

Klientský JavaScript

Když je překladač JavaScriptu vložen do webového prohlížeče, výsledkem je klientský JavaScript. Toto je zdaleka nejběžnější forma JavaScriptu. Vetšina lidí, pokud se zmiňuje o JavaScriptu, má obvykle na mysli klientský JavaScript. Klientský JavaScript kombinuje možnost zpracování skriptu interpretem JavaScriptu s objektovým modelem dokumentu (DOM – viz kap. 4.2) definovaným webovým prohlížečem. Tyto dvě odlišné technologie se synergicky doplňují. JavaScript umožňuje distribuci spustitelného obsahu přes web a je srdcem dokumentu dynamického HTML (DHTML). Podobně jako specifikace ECMA-262 definuje standardní verzi jádra jazyka JavaScript, tak organizace World Wide Web Consortium (W3C) publikovala specifikaci (nebo doporučení) DOM určující prvky, které musejí prohlížeče ve svém DOM podporovat (Flanagan, 2002).

4.2

DOM

DOM (Document Object Model) je ve své podstatě pouze sada rozhraní tj. API (Aplication Programming Interface) určených pro prácí s validními HTML a XML dokumenty (viz kap. 4.4). Definuje logickou strukturu dokumentu a prostředky zprostředkující práci s dokumentem. DOM standardizuje přístup a manipulaci s dokumentem a umožňuje programátorovi transparentním způsobem pracovat při tvorbě, procházení a modifikaci dokumentu. Specifikace DOM je popsána sadou programových rozhraní, kterou jsou z hlediska programovacího jazyku nezávislé. Za specifikací DOM stojí konsorcium W3C a myšlenka jednotného a jazykově či platformově nezávislého rozhraní pro práci s dokumentem byla hlavním důvodem vzniku specifikace. K popisu jednotlivých rozhraní specifikace byl použit jazyk IDL (Interface Definition Language). Transparentnost na straně jedné a ochota sjednotit přístup pro práci s dokumentem na straně druhé umožnily brzkou implementaci DOMu v Javě a především v internetových prohlížečích, kde s jazyky ECMAScriptu vytvořil standard pro práci s HTML dokumenty. Omezení proprietárních DHTML

16

4.2

DOM

rozšíření určených pro práci s dokumentem u jednotlivých prohlížečů bylo rovněž jedním z faktorů, které přispěly k specifikaci DOM. 4.2.1

Struktura dokumentu a objektový model

Vyjádření dokumentu pomocí objektů se nazývá objektový model a z pohledu DOM je specifikován následovně: • množinou rozhraní a objektů použitých k reprezentaci a manipulaci s dokumentem, • sémantikou těchto rozhraní a objektů s jejich chováním a vlastnostmi, • vztahy a spoluprácí mezi těmito rozhraními a objekty. Z pohledu DOMu si můžeme dokument představit jako logickou strukturu uzlů, která se podobá rozvětvenému stromu. Na vrcholu struktury je objekt window, reprezentující aktuální okno prohlížeče. Tento objekt obsahuje mnoho vlastností a metod – mezi jinými je zde vlastnost document, odpovídající HTML dokumentu, který je v tomto okně právě načten. Objekt document pak v sobě obsahuje všechny další prvky, které jsou na stránce. Například formuláře jsou uloženy v poli document.forms, hypertextové odkazy v poli document.links atd. Výše popsané můžeme vidět na následujícím obrázku.

Obrázek 4: Objektový model dokumentu

17

4.3

4.2.2

HTML

Úrovně a moduly

Specifikace W3C DOM jsou rozděleny do několika úrovní (DOM level), z nichž každá obsahuje povinné a volitelné moduly. K tomu, aby nějaká aplikace mohla prohlásit, že podporuje určitý DOM level, musí implementovat všechny požadavky dané úrovně a všech nižších. Aplikace mohou též podporovat specifická rozšíření (vendor–specific extensions) za podmínky, že nejsou v konfliktu s W3C standardy. V současnosti existují tři úrovně: Level 1, Level 2 a Level 3. Level 0 Level 0 není formální specifikací publikovanou W3C, ale používá se jako srozumitelná zkratka odkazující na věci existující před standardizačním procesem. Například DHTML Object Model vyvinutý firmou Microsoft, nebo nepojmenovaný Intermediate DOM od Netscape. Level 1 První specifikace DOM přinesla Core (sada základních rozhraní), které bylo rozšířeno moduly XML a HTML, které umožňují navigaci v DOM (HTML a XML) dokumentu (resp. jeho stromové struktuře) a manipulaci s obsahem. Také jsou obsaženy specifické elementy HTML. Level 2 Tato specifikace přinesla kromě drobného rozšíření Core zároveň jeho ustanovení jako modulu a moduly úplně nové – Veiws, StyleSheets, CSS, CSS2, Events, UIEvents, MouseEvents, MutationEvents, HTMLEvents, Range a Traversal. Level 3 Prozatím poslední specifikace DOM přinesla moduly TextEvents, KeybordEvents, MutationNameEvents, LS, LS-Async, DocumentLS, ElementLS, Validation a XPath. Vazby jednotlivých modulů jsou přehledně znázorněny na obrázku viz příloha A.

4.3

HTML

HTML je zkratka z anglického HyperText Markup Language, což v překladu znamená značkovací jazyk pro hypertext. Tento jazyk je jedním z jazyků pro vytváření stránek v systému Worl Wide Web, který umožňuje publikaci stránek na Internetu. Jazyk je podmnožinou dříve vyvinutého rozsáhlého univerzálního značkovacího jazyka SGML (Standard Generalized Markup Language). Vývoj HTML byl ovlivněn vývojem webových prohlížečů, které zpětně ovlivňovaly definici jazyka (Wikipedia, 2006).

18

4.3

4.3.1

HTML

Vývoj jazyka

Hypertext Vývoj hypertextu začal už ve 40. letech 20. stol., kdy Vannevar Bush teoreticky navrhl systém MemEx. Bushův teoretický koncept uskutečnil v praxi Douglas Engelbart, když počátkem šedesátých let vytvořil první hypertextový systém fungující v síťovém prostředí – On-Line Systém (NLS). Termín hypertext zavedl v šedesátých letech Theodor H. Nelson, který chápal hypertext především jako nové médium, jež rozšiřuje možnosti kreativní práce s textem. Popsal hypertext jako nesekvenční, nelineární text s rozvětvenou strukturou, která se skládá z textových bloků propojených různými spojeními a nabízí čtenáři různé čtecí trasy. Své vize se snažil realizovat v celoživotním projektu XANADU, jehož cílem bylo vytvořit totální hypertext – docuversum, který by shromažďoval a propojoval všechny existující texty (Kobíková, 2003). HTML V roce 1989 spolupracovali Tim Berners-Lee a Robert Caillau na propojeném informačním systému pro CERN (Central Européene de Rechere Nucléaire – výzkumné centrum fyziky poblíž Ženevy ve Švýcarsku). V této době se pro tvorbu dokumentů obvykle používal TeX, Postscript a také SGML. Z potřeby nějakého nástroje, který by byl jednodušší, vzešel jazyk HTML. Tento jazyk byl navržen v 1990 a současně s ním také protokol pro jeho přenos v síti – HTTP (HyperText Transfer Protocol – přenosový protokol hypertextu – viz kap. 5). V roce 1991 CERN zprovoznil svůj systém www, jehož hypertextové dokumenty jsou psány právě v jazyce HTML. Současně NCSA (National Center for Supercomputer Applications) vybídlo Marca Andreessena a Erica Binu k vyvinutí prohlížeče Mosaic. Byl vyvinut v roce 1993 pro počítače PC a Macintosh a měl obrovský úspěch. Byl to první prohlížeč s grafickým uživatelským rozhraním. Došlo k velkému rozvoji webu a bylo nutné pro HTML definovat standardy. 4.3.2

Verze jazyka

První verze jazyka HTML byla definována pouze doprovodnou dokumentací k původní distribuci systému WWW z laboratoří CERN. Snaha o standardizaci této verze byla rychle předstižena dalším vývojem a ztratila brzy smysl. Následkem nečekaně rychlého celosvětového rozšíření systému WWW a nekoordinovaného vývoje různých verzí prohlížečů bylo neustálé oddalování přijetí jednotné verze definice jazyka HTML, takže první standardizovanou verzí jazyka HTML je verze 2. 0. • Verze 2. 0 – Zachycuje stav jazyka v polovině roku 1994. Standard vydala komunita IETF (Internet Engineering Task Force). Je to první verze, která plně odpovídá syntaxi SGML. Přidává k původní nespecifikované verzi interaktivní formuláře. • Verze 3. 2 – Byla vydána v květnu 1996 a zachycuje stav jazyka v tomto roce. Připravovaná verze HTML 3. 0 nebyla nikdy přijata jako standard, protože byla 19

4.3

HTML

příliš složitá a žádná firma nebyla schopna naprogramovat její podporu ve svém prohlížeči. Standard už vydalo konsorcium W3C, stejně jako následující verze. Přidává k jazyku tabulky, zarovnávání textu a stylové elementy pro ovlivňování vzhledu. • Verze 4. 0 – Byla vydána 18. prosince 1997. Do specifikace jazyka přidala nové prvky pro tvorbu tabulek, formulářů a nově byly definovány rámy. Tato verze se snaží dosáhnout původního účelu – prvky by měly vyznačovat význam (sémantiku) jednotlivých částí dokumentu, vzhled má být ovlivňován připojovanými styly. Některé prezentační elementy byly zavrženy. • Verze 4. 01 – Tato verze opravuje některé chyby verze předchozí a přidává některé nové tagy. Je to poslední verze HTML, které se již dále nevyvíjí a je nahrazena novějším XHTML, jehož základem je právě tato poslední verze HTML. 4.3.3

Koncepce jazyka

Jazyk HTML je od verze 2. 0 aplikací SGML. Je charakterizován množinou značek a jejich atributů pro danou verzi definovaných. Mezi značky se uzavírají části textu dokumentu a tím se určuje význam (sémantika) obsaženého textu. Názvy jednotlivých značek se uzavírají mezi úhlové závorky (< a >). Část dokumentu uzavřená mezi značkami tvoří tzv. element (prvek) dokumentu. Součástí obsahu elementu mohou být další vnořené elementy. Atributy jsou doplňující informace, které upřesňují vlastnosti elementu. Značky (také nazývané tagy) jsou obvykle párové. Rozlišujeme počáteční a koncové značky. Koncová značka má před názvem značky znak lomítko. Některé značky jsou nepárové – neobsahují žádný text. Pro každou verzi existuje definice pravidel DTD (Document Type Definition). DTD definuje pro určitou verzi, které elementy je možné používat a s jakými atributy. Dokument může mimo značkování obsahovat další prvky: • direktivy – začínají znaky
Struktura dokumentu

Dokument v jazyku HTML má předepsanou strukturu: • Deklarace DTD – je povinná až ve verzi 4. 01, je uvedena direktivou a ) reprezentuje celý dokument. Je nepovinný, ale je doporučeno ho používat. • Hlavička elementu – představuje metadata, která se vztahují k celému dokumentu. Definují např. název dokumentu, jazyk, kódování, klíčová slova, popis nebo použitý styl zobrazení. Hlavička je uzavřena mezi značky a . 20

4.3

HTML

• Tělo dokumentu – obsahuje vlastní text dokumentu. Vymezuje se značkami a 4.3.5

Druhy značek

Značky můžeme z hlediska významu rozdělit na tři základní skupiny: • Strukturální značky rozvrhují strukturu dokumentu. Příkladem jsou odstavce (
), nadpisy (
,
). Tyto značky dodávají dokumentu formu. • Popisné (sémantické) značky popisují povahu obsahu elementu. Příkladem mohou být nadpis () nebo adresa (<address rel="nofollow">). Současný trend je orientován právě na sémantické značky, které usnadňují automatizované zpracovávání dokumentů a vyhledávání informací v záplavě dokumentů na webu. Vyvrcholením této snahy je v současné době jazyk XML. • Stylistické značky určují vzhled elementu při zobrazení. Typickým příkladem je značka pro tučné písmo (<b>). Tento druh značek se nedoporučuje používat, trendem je používání kaskádových stylů oddělených od obsahu dokumentu. Problém je především v tom, že tyto značky jsou orientovány na obrazovku monitoru, potíže mohou nastat při používání dokumentu jiným způsobem – alternativní prohlížeče pro postižené (čtečky pro slepce), v mobilních zařízeních a podobně. Kaskádové styly umožňují definovat rozdílné zobrazení pro různá zařízení. 4.3.6<br /> <br /> Parsování v prohlížečích<br /> <br /> Webové prohlížeče jsou programy, jejichž účelem je prezentovat dokument na zobrazovacím zařízení – převážně monitoru počítače. Dokument je prohlížečem načítán a rozkládán (parsován, syntaktická analýza) na jednotlivé elementy. Prohlížeč obsahuje tabulku značek, které podporuje. Tuto tabulku je možné omezit typem dokumentu (DTD), je-li deklarován. Každému elementu je poté přiřazen styl (způsob zobrazení). Styly mohou být uvedeny ve stylovém předpisu. Vlastnosti stylů, které nejsou předepsány, doplní prohlížeč podle implicitního stylu, který má zabudován. Některé prohlížeče umožňují uživateli implicitní styly definovat. Novější prohlížeče pracují obecně ve dvou základních režimech: • Standardní režim – je dodržována specifikace verze HTML, deklarovaná v dokumentu. Elementy v dokumentu musí odpovídat verzi, neznámé elementy jsou považovány za chybu a nezobrazují se. Netolerují se syntaktické chyby. • Quirk mód – nestandardní režim. Prohlížeč se snaží „napravovatÿ chyby v syntaxi dokumentu, domýšlí si chybějící koncové párové značky, neznámé elementy zobrazuje implicitním formátem. Režim se stanoví obecně podle typu dokumentu, ale rozhodování je dost složité (označuje se výrazem doctype sniffing). Účelem je zachování zpětné kompatibility<br /> <br /> 21<br /> <br /> 4.4<br /> <br /> XML<br /> <br /> pro dokumenty, které nedodržují definici HTML. Tato vlastnost ale umožňuje vytvářet nestandardní dokumenty – autory zatím nic nenutí pracovat bez chyb podle specifikace. Prohlížeče mají různé implicitní styly zobrazování a chovají se různě v quirk módu. Stejný dokument se tedy může v různých prohlížečích zobrazovat různě. Rozdíly jsou i mezi verzemi prohlížeče stejného výrobce. Současné chování prohlížečů je výsledkem vývoje, kdy si výrobci jednotlivých prohlížečů přizpůsobovali definici HTML podle svých potřeb a prohlížeče podporovaly nestandardní elementy a syntaxi. Řada těchto vylepšení byla následně přejímána do standardů, a některé zase v dalších verzích vyřazeny (Wikipedia, 2006).<br /> <br /> 4.4<br /> <br /> XML<br /> <br /> XML (eXtensible Markup Language, rozšiřitelný značkovací jazyk) je obecný značkovací jazyk, který byl vyvinut a standardizován konsorciem W3C. Umožňuje snadné vytváření konkrétních značkovací jazyků pro různé účely a široké spektrum různých typů dat. Jazyk XML je určen především pro výměnu dat mezi aplikacemi a pro publikování dokumentů. Umožňuje popsat strukturu dokumentu z hlediska věcného obsahu jednotlivých částí, nezabývá se sám o sobě vzhledem dokumentu nebo jeho částí. Prezentace dokumentu (vzhled) se potom definuje připojeným stylem. Další možností je pomocí různých stylů provést transformaci do jiného typu dokumentu, nebo do jiné struktury XML. HTML jako původní jazyk pro publikování již přestal vyhovovat především pro svou složitost, která vznikla jeho postupným a svévolným rozšiřováním. Jazyk XML nemá žádné předdefinované značky (tagy, názvy jednotlivých elementů) a také jeho syntaxe je podstatně přísnější než HTML (Wikipedia, 2006). 4.4.1<br /> <br /> Vlastnosti XML<br /> <br /> Standardní formát pro výměnu informací V dnešní době již není možné zasílat dokumenty ve tvaru, který vyžaduje speciální software konkrétní firmy, jako jsou např. formáty DOC, XLS nebo T602. Je používána celá řada operačních a informačních systémů a neexistuje záruka, že každý uživatel vlastní příslušný software. Je tedy potřeba používat nějaký jednoduchý otevřený formát, který není úzce svázán s nějakou platformou nebo proprietární technologií. Tím může být právě XML, který je založen na jednoduchém textu a je zpracovatelný (v případě potřeby) libovolným textovým editorem. Specifikace XML konsorcia W3C je zdarma přístupná všem. Každý tak může bez problémů do svých aplikací implementovat podporu XML. To je velký rozdíl oproti firemním formátům, k nimž není k dispozici žádná dokumentace a navíc se jedná v porovnání s XML o velice složité, často binární, formáty. 22<br /> <br /> 4.4<br /> <br /> XML<br /> <br /> Mezinárodní podpora Tvůrci XML hned od samého počátku mysleli na potřeby i jiných jazyků než je angličtina. Jako znaková sada se implicitně používá ISO 10646 (také Unicode). V XML proto lze vytvářet dokumenty, které obsahují texty v mnoha jazycích najednou a následně přepínat mezi různými jazyky v jednom dokumentu. Současně je přípustné i jiné libovolné kódování (např. windows-1250, iso-8859-2), musí však být v každém dokumentu přesně určeno. Odpadají tak problémy s konverzí z jednoho kódování do druhého. Vysoký informační obsah Pomocí XML značek (tagů) se v dokumentu vyznačuje význam jednotlivých částí textu. Dokumenty tak obsahují více informací, než kdyby se používalo značkování zaměřené na prezentaci (vzhled) – definice písma, odsazení a podobně. XML dokumenty jsou informačně bohatší. To lze samozřejmě s výhodou využít v mnoha oblastech. Snadná konverze do jiných formátů Při používání XML dokumentu potřebujeme také dokument zobrazit. XML samo o sobě žádné prostředky pro definici vzhledu nenabízí. Existuje ale několik stylových jazyků, které umožňují definovat, jak se mají jednotlivé elementy zobrazit. Souboru pravidel nebo příkazů, které definují, jak se dokument převede do jiného formátu, se říká styl. Jeden vytvořený styl můžeme aplikovat na mnoho dokumentů stejného typu, stejně tak můžeme na jeden dokument aplikovat několik různých stylů. Výsledkem může být např. postscriptový soubor, HTML kód nebo XML s obsahem původního dokumentu. Stylových jazyků existuje dnes několik. Mezi nejznámější patří kaskádové styly (CSS viz kap. 4.5). Ty lze použít pouze pro jednoduché formátování, které dobře poslouží pro zobrazení dokumentu na obrazovce. Dalším jazykem je XSL (eXtensible Stylesheet Language). Ten umožňuje dokument různě upravovat a transformovat – vybírat části dokumentu nebo generovat obsahy a rejstříky. Automatická kontrola struktury dokumentu XML neobsahuje předdefinované značky (tagy), je třeba definovat vlastní značky, které budeme používat. Tyto značky je možné (nepovinně) definovat v souboru DTD (Document Type Definition). Potom je možné automaticky kontrolovat, zda vytvářený XML dokument odpovídá této definici. Program, který tyto kontroly provádí, se nazývá parser. Při vývoji aplikací můžeme parser použít, a ten za nás detekuje většinu chyb v datech. Pro různé standardní aplikace byla postupně vytvořena schémata, která definují značky (názvy elementů) pro konkrétní typy dokumentů. Příkladem může být DocBook, který definuje struktury pro vytváření knih, článků, vědeckých publikací a podobně. Výhodou takových aplikací je, že současně s definičními soubory DTD je dodávána sada stylů (XSL souborů) pro následné zpracování a přípravu pro tisk, nebo pro převod do jiných standardních tvarů (PostScript, HTML atd.). 23<br /> <br /> 4.4<br /> <br /> XML<br /> <br /> Další vlastností XML je, že v jednom dokumentu lze současně používat několik na sobě nezávislých druhů značkovaní pomocí jmenných prostorů (namespaces). To umožňuje kombinovat v jednom dokumentů několik různých definic ve formě DTD nebo schémat bez konfliktů v pojmenování elementů. Hypertext a odkazy XML stejně jako HTML umožňuje vytváření odkazů v rámci jednoho dokumentu i mezi dokumenty, má však více možností. Je možné vytvářet i vícesměrné odkazy, které spojují více dokumentů dohromady. Tvorba odkazů je popsána ve třech standardech – XLink, XPointer a XPath. • XPath (XML Path Language) je jazyk, který umožňuje adresovat jednotlivé části dokumentu. Jeho pomocí lze z XML dokumentu vybírat jednotlivé elementy a pracovat s jejich hodnotami a atributy. • XPointer (XML Pointer Language). Je rozšířením XPath. Je to jazyk, který umožňuje jednoznačnou identifikaci libovolné části dokumentu. Rozšířeními jsou např. možnost adresování i v rámci textových uzlů nebo možnost rozlišit adresu bodu (point) a úseku (range) v XML dokumentu. • XLink (XML Linking Language) je samotný jazyk pro tvorbu odkazů. Jednotlivé dokumenty se určují pomocí jejich URL adresy, za kterou lze uvést ještě XPointer pro přesnější určení části dokumentu. Syntaxe XML XML dokument je text obvykle zapsaný v kódování Unicode (UTF-8), ale jsou přípustná i jiná kódování. Na rozdíl např. od HTML je efektivita XML silně závislá na struktuře, obsahu a integritě. Aby byl dokument považován za správně strukturovaný („well-formedÿ), musí mít minimálně následující vlastnosti: • Musí mít právě jeden kořenový (root) element. • Neprázdné elementy musí být ohraničeny startovací a ukončovací značkou. Prázdné elementy mohou být označeny tagem „prázdný elementÿ. • Všechny hodnoty atributů musí být uzavřeny v uvozovkách nebo apostrofech. • Elementy mohou být vnořeny, ale nemohou se překrývat. To znamená, že každý (ne kořenový) element musí být celý obsažen v jiném elementu. Aplikace XML • XHTML – eXtensible HyperText Markup Language, nástupce jazyka HTML. • RDF – Resource Description Framework, specifikace, která umožňuje popsat metadata, např. obsah a anotace HTML stránky. • RSS – Rodina XML formátů sloužící pro čtení novinek na webových stránkách. Tento formát byl vyvíjen více společnostmi, proto zkratka RSS má pro různé verze různý význam. – Rich Site Summary (RSS 0.91), – RDF Site Summary (RSS 1.0), – Really Simple Syndication (RSS 2.0), – Really Simple Syndication 3.0 (RSS 3.0 Lite).<br /> <br /> 24<br /> <br /> 4.5<br /> <br /> CSS<br /> <br /> • SMIL – Synchronized Multimedia Integration Language, popisuje multimedia pomocí XML. • MathML – Mathematical Markup Language je značkovací jazyk pro popis matematických vzorců a symbolů pro použítí na webu. • SVG – Scalable Vector Graphics je jazyk pro popis dvourozměrné vektorové grafiky, statické i dynamické (animace). • DocBook – Sada definic dokumentů a stylů pro publikační činnost. • Jabber – Protokol pro Instant messaging.<br /> <br /> 4.5<br /> <br /> CSS<br /> <br /> CSS je zkratka anglického názvu Cascading Style Sheets, česky tabulky kaskádových stylů. Je to jazyk pro popis způsobu zobrazení stránek napsaných v jazycích HTML, XHTML nebo XML. Jazyk byl navržen standardizační organizací W3C. Zatím byly vydány dvě verze specifikace CSS 1, CSS 2 a revize CSS 2.1. V současné době se pracuje na verzi CSS 3. Některé předpokládané vlastnosti verze 3 jsou již ze strany prohlížečů podporovány, avšak v současné době se jedná téměř výhradně o prohlížeč FireFox. Pro platformu MAC nabízí dobrou podporu CSS 3 prohlížeč Safari. Hlavním smyslem je umožnit návrhářům oddělit vzhled dokumentu od jeho struktury a obsahu. Původně to měl umožnit už jazyk HTML, ale v důsledku nedostatečných standardů a konkurenčního boje výrobců prohlížečů se vyvinul jinak. Starší verze HTML obsahují celou řadu elementů, které nepopisují jenom obsah a strukturu dokumentu, ale i způsob jeho zobrazení. Z hlediska zpracování dokumentů a vyhledávání informací není takový vývoj žádoucí. Používání kaskádových stylů ve srovnání se samotným HTML v praxi přináší výhody: • šírší formátovací možnosti, • snadná tvorba a údržba konzistentního stylu, • oddělení struktury a stylu, • dynamická práce se styly, • formátování XML dokumentů, • větší kompatibilita alternativních webových prohlížečů, • kratší doba načítání stránky. Výhodou CSS oproti starému formátování v HTML je, že kód a obsah webu je uložen v jednom souboru a veškerý design a formátování se načítá ze souboru jiného (.css). Tento soubor je často společný pro celý web. Stylový předpis se skládá z posloupnosti pravidel. Každé pravidlo určuje vzhled některého elementu dokumentu nebo skupiny elementů. Pravidlo začíná tzv. selektorem, který specifikuje skupinu elementů. Selektor je následován seznamem deklarací, které určují vzhled vybrané skupiny elementů. Celý seznam je uzavřen ve složených závorkách a jednotlivé deklarace jsou odděleny středníkem (Wikipedia, 2006).<br /> <br /> 25<br /> <br /> 4.6<br /> <br /> 4.6<br /> <br /> XMLHttpRequest<br /> <br /> XMLHttpRequest<br /> <br /> Objekt XMLHttpRequest je rozhraní (API), které můře být použito skriptovacími jazyky pro přenos a manipulaci z XML daty. Objekt XMLHttpRequest zajišťuje také samotnou komunikaci se serverem. Umožňuje odeslat na server požadavek metodami GET nebo POST protokolu http (bude popsán níže) a po obdržení odpovědi vyvolá na stránce předem nadefinovanou funkci, která posléze výsledek akce zpracuje. V Internet Exploreru je XMLHttpRequest k dispozici jako objekt ActiveX od verze 5. 0. K jeho vytvoření lze použít jeden z následujících konstruktorů: var http request1 = new ActiveXObject(„Msxml2.XMLHTTPÿ); var http request2 = new ActiveXObject(„Microsoft.XMLHTTPÿ); Ostatní prohlížeče (Mozilla 1. 0+, Netscape 7. 1+, Opera 7. 6+, Safari 1. 2+, Konqueror) implementují XMLHttpRequest přímo. V případě jmenovaných prohlížečů lze tedy objekt vytvořit pomocí tohoto konstruktoru: http request = new XMLHttpRequest(); Metody, které jsou k dispozici po vytvoření objektu XMLHttpRequest, jsou uvedeny v příloze B. Dále jsou v této příloze uvedeny také datové atributy tohoto objektu.<br /> <br /> 26<br /> <br /> 5<br /> <br /> 5<br /> <br /> HTTP<br /> <br /> HTTP<br /> <br /> Protokol obecně definuje pravidla pro komunikaci mezi dvěma partnery. Definuje tvar přenášených informací, možnosti a náležitosti požadavku i odpovědi. HTTP (Hypertext Transfer Protokol) se používá pro distribuované hypermediální informační systémy. Pro službu WWW se používá od roku 1990. První používaná verze HTTP 0.9 byla jednoduchá. Zajišťovala pouze přenos dat po Internetu bez dalších doplňkových informací o přenášených datech. Klient musel odhadnou podle koncovky souboru o jaká data se jedná. Brzy se ukázalo, že tato varianta nepostačuje a nastoupila verze nová HTTP 1. 0. Verze 1.0 se snažila doplnit popisující informace do dotazu a odpovědi a použila pro to již existující formát MIME (Multipurpose Internet Mail Extension). Rozšířila tvar dotazu a odpovědi o standardizované doplňující informace charakterizující přenášená data ve tvaru typ/podtyp. HTTP 1. 0 je definováno v RFC 1945. S rozvojem služby WWW se objevovaly další požadavky na HTTP. Jednalo se především o práci s proxy, využívání cache, požadavek na trvalé spojení mezi klientem a serverem a požadavky na virtuální servery. Tyto nedostatky řeší nová verze protokolu HTTP 1. 1, která je definována v RFC 2068 v lednu 1997. HTTP je protokol aplikační vrstvy. Vlastní přenos dat zajišťuje protokol vrstvy nižší většinou TCP. Pomocí HTTP komunikuje na příslušných portech klient se serverem. HTTP server je obvykle spuštěn na portu 80. Je možné ho ale provozovat i na portu jiném (Kabelová, 2002).<br /> <br /> Obrázek 5: Princip HTTP<br /> <br /> 5.1<br /> <br /> Jak pracuje HTTP protokol<br /> <br /> Každá z verzí HTTP protokolu má svá specifika, od kterých se odvíjí také rozdílný způsob práce. HTTP protokol verze 1. 0 vychází z modelu dotaz–odpověď. Klient po27<br /> <br /> 5.2<br /> <br /> Rozšíření verze 1. 1<br /> <br /> šle požadavek na server, server klientovi odpoví a komunikace se uzavírá. Požaduje-li opakovaně klient stejná data od serveru, navazuje se nové spojení a server opět posílá data. Případné uchování některých informací o komunikaci mezi klientem a serverem (např. o tom, která data již dříve klient obdržel) je ponecháno zcela na klientovi. Protokol si informace o již provedených spojeních neudržuje, což znamená, že se jedná o protokol bezstavový. Většina HTTP komunikace je iniciována klientem a sestává z požadavku na nějaký server. Tento jednoduchý příklad může být realizován jedním spojením mezi klientem a serverem. Viz obr. 5<br /> <br /> 5.2<br /> <br /> Rozšíření verze 1. 1<br /> <br /> Trvalé spojení V předchozích verzích protokolu bylo pro každé URL navazováno zvláštní TCP spojení. V případě obrázků vložených v html stránce navazoval klient v krátkém časovém rozmezí několik spojení na stejný originální server. To zvyšovalo zátěž serveru a vytížení linek v Internetu. Verze HTTP 1. 1 zavádí možnost trvalého spojení. V rámci tohoto spojení pak klient posílá všechny své požadavky na server a server mu po tomto spojení posílá své odpovědi. Je definován mechanismus ukončení spojení. Ve verzi HTTP 1. 1 je trvalé spojení chápáno jako implicitní pro všechny HTTP spojení. Není-li tedy řečeno jinak, může klient předpokládat, že server udržuje trvalé spojení a naopak. Spojení zůstává otevřeno do té doby, dokud klient nebo server spojení neukončí. Spojení se ukončuje vysláním hlavičky Connection: close, požadavek obsahující tuto hlavičku je poslední na daném spojení. Je-li signalizováno ukončení spojení od serveru, nesmí již klient poslat po spojení další požadavek. Všechny zprávy posílané v trvalém spojení musí mít definovanou délku v hlavičce Message-length. Zřetězené zpracování Klient, který podporuje trvalé spojení, může řetězit své dotazy, tj. posílat více dotazů, aniž by čekal na odpovědi. Server musí na dotazy odpovídat ve stejném pořadí, ve kterém dotazy dostal. Virtuální WWW servery Starší klienti používající verzi HTTP 1. 0 předpokládali, že jedné IP adrese patří jeden WWW server. HTTP protokol verze 1. 0 s IP adresou ani jménem počítače nepracuje. HTTP 1.1 zavádí hlavičku Host a definuje zpracování této hlavičky na straně klienta i serveru. Pokud tato hlavička chybí, vrací chybu. Pomocí této hlavičky se dostanou informace o jméně počítače až k HTTP serveru a server může vracet na různá jména různé odpovědi. Vyjednávání o obsahu Další novým prvkem v HTTP protokolu je snaha o poslání co nejlepší varianty dokumentu, pokud samozřejmě existuje několik různých variant (např. různý jazyk, 28<br /> <br /> 5.2<br /> <br /> Rozšíření verze 1. 1<br /> <br /> formát, komprese apod.). HTTP 1. 1 poskytuje dva dohadovací mechanismy, které je možné kombinovat nebo použít odděleně: • serverem řízené dohadování, • klientem řízené dohadování, Serverem řízené dohadování Výběr nejlepší varianty dělá algoritmus, který je součástí serveru. Vychází z existujících variant dokumentu a z informací v hlavičkách dotazu. Klientský program může ovlivnit toto rozhodování pomocí následujících hlaviček: Accept, Accept-Charset, Accept-Encoding, Accept-Language, User-Agent. Klientem řízené dohadování Výběr nejlepší varianty provádí klientský program po obdržení první odpovědi od serveru. V odpovědi jsou uvedeny existující varianty v hlavičce Alternates nebo v těle odpovědi jako seznam URL jednotlivých variant. Nevýhodou je potřeba druhého dotazu, kterým klient teprve získá požadovaný dokument.<br /> <br /> 29<br /> <br /> 6<br /> <br /> 6<br /> <br /> AJAX<br /> <br /> AJAX<br /> <br /> Zkratka AJAX znamená Asynchronous JavaScript and XML. AJAX není sám o sobě implementací technologie či softwarovým produktem, ale jedná se o obecný koncept nebo lépe návrhový vzor pro RIA (Rich Internet Application). AJAX je představitel cesty využívající maximální možné hodnoty dnešních technologií. AJAX si můžeme představit jako pomyslný deštník, pod kterým se skrývají následující technologie: • Document Object Model (DOM), • XMLHttpRequest, • HTML, CSS, • JavaScript, AJAX je tedy konceptem využití těchto technologií, které byly výše popsány, a to především objektu XMLHttpRequest k volání serveru (Pichlík, 2005). Na následujícím obrázku je vidět rozdíl mezi klasickým webovým aplikačním modelem a modelem využívajícím technologie AJAX.<br /> <br /> Obrázek 6: Porovnání klasického konceptu s technologií AJAX<br /> <br /> Základním stavebním kamenem je objekt XMLHttpRequest, který umožňuje asynchronní volání serveru. V klasickém webovém modelu každá změna stavu na klientovi vyžaduje obnovení celého uživatelského rozhraní. Vše probíhá v pevně dané posloupnosti kroků. Nejdříve je vygenerována žádost o změnu stavu, pak dochází k odeslání požadavku na server, k vyřízení požadavku a vše končí zasláním kompletního uživatelského rozhraní s daty. Jednotlivé kroky jsou vzájemně synchronizovány. Naopak AJAX, díky XMLHttpRequest, může vyvolat libovolný počet nezávislých 30<br /> <br /> 6<br /> <br /> AJAX<br /> <br /> požadavků, jejichž výsledky mohou ovlivnit pouze patřičné části uživatelského rozhraní, bez nutnosti jeho celkového znovunačítání. Rozdíly ilustrují následující dva obrázky.<br /> <br /> Obrázek 7: Klasický synchronní model<br /> <br /> Obrázek 8: Asynchronní model<br /> <br /> V dnešní době by neměl být problém podobné stránky používat téměř s libovolným prohlížečem jako je Internet Explorer, Firefox, Opera, Safari či Konqueror. Ač se může tato technika zdát jako relativní novinka (a ve své podstatě je, protože masověji je užívána až nyní), její kořeny sahají do roku 1998. Tehdy byly první pokusy provedeny týmem, který vytvářel Outlook Web Access – rozhraní umožňující 31<br /> <br /> 6.1<br /> <br /> Výhody<br /> <br /> přístup k poště v poštovním klientu Outlook pomocí webového prohlížeče. Právě toto rozhraní Outlooku bývá považováno za první komerční AJAX aplikaci.<br /> <br /> 6.1<br /> <br /> Výhody<br /> <br /> • Hlavní výhoda tkví v urychlení práce, protože se nemusí pokaždé načítat nová stránka. Toto chování je daleko blíže tomu, co zná uživatel z klasických desktopových aplikací. Jedním z pravidel dobré použitelnosti je držet se toho, co už uživatel zná. • AJAX šetří datové přenosy. U klasické webové aplikace se s každým požadavkem musí uživateli posílat celý kód stránky, který neobsahuje příliš moho nových a důležitých informací. Naopak s technologií AJAX se posílá jenom to důležité.<br /> <br /> 6.2<br /> <br /> Nevýhody<br /> <br /> • AJAX znemožňuje použití tlačítka zpět v prohlížeči, protože to se používá jen pro statické stránky. Toto se dá bez váhání označit za největší problém technologie AJAX. Uživatelé jsou na tlačítko zpět zvyklí a očekávají od něj určitou funkci. Při použití technologie AJAX však toto tlačítko vrátí uživatele na předcházející stránku, což ovšem neznamená návrat aplikace do předcházejícího stavu. • Při změnách na stránce pomocí technologie AJAX se nemění URL v adresním řádku prohlížeče. Proto není možné takto modifikovanou stránku poslat e-mailem nebo uložit do záložek. • AJAX neřeší vše. AJAX je stále pouze nadstavbou nad stávajícími webovými technologiemi, která se snaží překonat některá jejich omezení. Protokol HTTP vůbec není vhodný pro aplikace spolupracující intenzivně se serverem – problémem je, že se při každém požadavku musí navázat spojení se serverem, které se po jeho vyřízení ukončí. Tímto může dojít ke zpomalení aplikace. • Důležité je si také uvědomit, že AJAX už z té postaty, že je založen na použití JavaScriptu, má omezení v tom, že pokud má uživatel ve svém prohlížeči zakázáno spouštění skriptů, tak AJAX přestává fungovat.<br /> <br /> 6.3<br /> <br /> Možná řešení některých problémů<br /> <br /> Simulace tlačítek zpět a vpřed Pokud chceme, aby naše aplikace byly uživatelsky přívětivé, musí mít uživatelé možnost přesouvat se tam a zpět v historii zobrazených stránek. Ta s technologií AJAX automaticky neexistuje. Klíčovým faktorem je zachycení události, která je představována stisknutím tlačítka zpět, nebo vpřed. K tomu slouží dva způsoby. 1. Iframe – Iframe je rámec vnořený do stránky, v němž lze zobrazit jinou stránku. Řešení problému spočívá v tom, že pokaždé, když je uživateli zobrazen obsah pomocí technologie AJAX, se také změní adresa v nějakém neviditelném iframe, 32<br /> <br /> 6.4<br /> <br /> Efektivnost z hlediska uživatelů<br /> <br /> takže prohlížeč tento bod zaznamená do historie zobrazených stránek. Když pak uživatel stiskne zpět, načte se minulá stránka onoho neviditelného iframu. Ta pak JavaScriptem oznámí skriptu, že má uživateli zobrazit to, co viděl před chvílí. Výhoda – toto řešení funguje ve všech klasických prohlížečích. Nevýhoda – nutnost opakovaně načítat nějakou stránku do iframe. 2. # anchor – česky kotva. Funguje tak, že pokaždé, když uživatel vyprodukuje AJAX request, změní se v adresové řádce kus adresy za znakem #, což nezpůsobí znovunačtení stránky, ale prohlížeč si tuto cestu zaznamená do historie. Tedy v případě, že uživatel stiskne tlačítko zpět, změní se #anchor na předcházející. Obdobným způsobem funguje stisk tlačítka vpřed. Výhoda – výhodou je, že není nutno použít iframe, který by stále načítal nějakou neviditelnou stránku. Další výhoda je zřejmá v situaci kdy jeden uživatel sdělí jinému uživateli odkaz na stránku, kterou zrovna vidí. V takovém případě jiný uživatel uvidí tu stejnou stránku, když si tento odkaz zadá do adresního řádku. Další výhodou je, že když uživatel vyvolá znovunačtení stránky, načte se mu stránka aktuální místo vstupní. Nevýhoda – toto řešení nefunguje v Internet Exploreru (dále jen IE) a tudíž se prakticky nedá použít. Přes neustále zvyšování podílu ostatních prohlížečů si totiž IE stále udržuje majoritní postavení na trhu (asi 75%). Tento nedostatek snad již bude odstraněn v IE verze 7, což ale nevyřeší problém uživatelům starších prohlížečů IE. Fungování stránek i při vypnutém JavaScriptu Protože může nastat případ kdy má uživatel vypnutý JavaScript, je nutné tuto situaci nějak ošetřit. Bohužel se dá tento problém řešit jedině tak, že je nutno udělat dvě verze stránek – jednu s použitím technologie AJAX a druhou bez ní.<br /> <br /> 6.4<br /> <br /> Efektivnost z hlediska uživatelů<br /> <br /> Z toho, co bylo uvedeno výše, lze zhodnotit možný přínos pro práci uživatelů. V zásadě se dá říci, že práce z technologií AJAX je efektivnější. Efektivita spočívá především v rychlosti práce. Nutnou pozornost je třeba věnovat uživatelům z hlediska jejich zkušeností z výpočetní technikou. Pro nezkušeného uživatele který je zvyklý na určité „standardníÿ chování webu, může být použití technologie AJAX i poněkud matoucí, protože se web prostě nechová tak jak je zvyklý z ostatních stránek. Z hlediska prostředí kam se má AJAX implementovat jako výsledek této práce, tedy prostředí UIS, je takto nezkušených uživatelů velmi málo. Z toho plyne, že za použití této technologie by byla efektivita práce jistě vyšší.<br /> <br /> 6.5<br /> <br /> Konkrétní aplikace v praxi<br /> <br /> K prvnímu využití JavaScriptové třídy XMLHttpRequest došlo již v roce 1998 kdy jí společnost Microsoft Corp. rozšířila svůj produkt Outlook Web Acces. K velkému zpopularizování této technologie došlo v roce 2005 kdy ji začala využívat společnost<br /> <br /> 33<br /> <br /> 6.6<br /> <br /> Využití v UIS<br /> <br /> Google. Od té doby se objevilo již mnoho dobrých aplikací technologie AJAX. Zde jsou uvedeny vybrané z nich. • Google Groups – archiv Usenetových diskusních skupin, • Google Maps – mapy celého světa, • Google Suggest – vyhledávač s našeptávačem, • Gmail – webový poštovní klient, • Kiko – online kalendář, • Meebo – multiclient instant mesenger, • Basecamp – online služba pro správu projektů, • Writely – online textový editor, • Time tracker – nástroj pro osobní time management.<br /> <br /> 6.6<br /> <br /> Využití v UIS<br /> <br /> Aplikací, kde lze využít této technologie v rámci UIS, je celá řada. Rámcově lze říci, že je vhodné AJAX použít v situacích, pro které je typické zpracování dat z databáze. Pokud by mělo dojít nejprve k zobrazení celé tabulky a poté k aplikaci omezujících podmínek, jejichž výsledkem je modifikovaná tabulka, je jistě užitečné přenést pouze modifikovaná data bez nutnosti přenosu celé stránky. Další možností jsou též vícekrokové výběry. Například pokud by měl uživatel vybírat fakultu, program a obor studia. Nejprve se zobrazí jedna rozbalovací nabídka sloužící k výběru fakulty. Poté, co uživatel vybere fakultu, dojde k zobrazení další nabídky, která by již obsahovala studijní programy zvolené fakulty atd. Jako vhodné se jeví též použití upraveného odkazu tak, aby zobrazoval stránku, na kterou ukazuje přímo do stránky, na které se nachází. To samozřejmě bez nutnosti znovunačtení celého rozhraní. Tento odkaz by bylo vhodné použít třeba pro zobrazení nápovědných textů. S výhodou lze také implementovat tzv. našeptávače. Našeptávače jsou užitečným pomocníkem při vyhledávání. Jedná se vlastně o textové vstupní pole kam uživatel zadává hledaný výraz a ihned se mu zobrazují možné výsledky na základě dotazů na databázi. V prostředí UIS se také nachází aplikace, kde se vyhledávání používá. Aplikací, kde by bylo použití takto vylepšeného vyhledávání přínosem, je určitě vyhledávání v dokumentech dokumentového serveru nebo také v publikacích vědecko výzkumného subsystému. Návrhy použití, které byly uvedeny výše, jsou obecné a lze je využít v celé řadě aplikací UIS. V UIS však existují aplikace, kde by se dalo technologie AJAX využít, ale jeho použití již není tak obecné jako v předchozích případech. Příkladem takové aplikace, kde by bylo velice vhodné využít AJAX, ale toto řešení by nebylo možno příliš široce využít v ostatních aplikacích, je jedna z aplikací osobního managementu – Dokumentový server. Konkrétně zobrazení dokumentového serveru jako stromu složek dokumentů. V současné době je strom dokumentů implementován tak, že v případě přístupu uživatele do konkrétní složky, musí být vygenerován požadavek na server, v jehož odpovědi klient obdrží celou stránku. Dochází tedy 34<br /> <br /> 6.6<br /> <br /> Využití v UIS<br /> <br /> ke zbytečnému přenosu dat, protože jedinou změnou na stránce je rozbalení jedné složky. Tento přenos celé stránky způsobený jejím znovunačtením by za použití technologie AJAX odpadl a aplikace by se stala uživatelsky přívětivější a rychlejší. Řešení tohoto problému však jistě není triviální. Jednu věc je ale třeba znovu připomenout. Jak bylo uvedeno v podkapitole, která pojednávala o nevýhodách technologie AJAX, není možné tuto technologii využívat v případě nepodporování JavaScriptu konkrétním prohlížečem. Vzniklou situaci je nutno ošetřit v aplikacích UIS tak, aby zakázáním JavaSciptu uživatel přišel o uživatelský nadstandard v podobě přívětivějšího prostředí, ale ne o základní funkce aplikací. Ty musí bezpodmínečně zůstat zachovány.<br /> <br /> 35<br /> <br /> 7<br /> <br /> 7<br /> <br /> IMPLEMENTACE<br /> <br /> Implementace<br /> <br /> Jako první způsob užití technologie AJAX v UIS jsem vybral našeptávač tedy pomocník při dohledávání. Důvodem k této volbě bylo, že implementace našeptávače není příliš složitá a dá se tak jednoduše ověřit, jestli je z praktického hlediska použití technologie AJAX v UIS vůbec možné.<br /> <br /> 7.1<br /> <br /> Implementační prostředí<br /> <br /> Operační systém Na aplikačních serverech byl jako operační systém zvolen Linux – volně šiřitelný operační systém typu Unix. U jeho vzniku v roce 1991 stál finský student Linus Torvalds. Díky rychlému vývoji v rámci internetové komunity je Linux v současnosti jedním z nejrozšířenějších serverových operačních systémů. Linux klade především důraz na bezpečnost, stabilitu a naprosto přirozenou práci v multiuživatelském a heterogenním prostředí. Právě bezpečnost je důležitým kritériem pro serverové nasazení. Rychlý vývoj a rozsáhlá uživatelská základna zaručují včasnou opravu odhalených chyb. Na databázových strojích je nasazen operační systém Solaris. Jedná se o implementaci Unixu firmy Sun Microsystems. Solaris umožňuje plně využít všech pokročilých vlastností serverů Sun, na kterých je databázový systém provozován (Linux dokumentační projekt, 1998). Databázový systém Jako databázový systém pro UIS byl zvolen SŘBD Oracle Database Release 10g. Představuje dostatečně stabilní a robustní systém relační databáze s rychlou dobou odezvy a řadou doplňkových funkcí. Obsahuje rozšíření v podobě procedurálního jazyka PL/SQL vhodného pro tvorbu procedur, funkcí a triggeru. Součástí produktu je řada podpůrných nástrojů pro správu a zálohování databáze. Programovací jazyk Pro vývoj aplikací UIS je používán programovací jazyk Perl (Practical Extraction and Report Language), jehož autorem je Larry Wall. Perl byl původně navržen jako jazyk pro zpracování textových souborů. V současné verzi 5.8 představuje moderní, objektově orientovaný jazyk vhodný mimo jiné i k tvorbě internetových aplikací. Mezi hlavní výhody patří blízkost k přirozenému jazyku a přehlednost zdrojového kódu. K oblibě Perlu přispívá snadná dostupnost pro mnoho operačních systémů (různé typy Unixu, MS Windows, OS/2 a další) a velké množství rozšiřujících programových modulů, které usnadňují použití jazyka v mnoha oblastech informačních technologií (Klein, 2004).<br /> <br /> 36<br /> <br /> 7.2<br /> <br /> 7.2<br /> <br /> Vlastní realizace<br /> <br /> Vlastní realizace<br /> <br /> Jak již bylo uvedeno výše, konkrétní realizací technologie AJAX v UIS bude pomocník při vyhledávání – našeptávač. Na implementaci bylo stanoveno několik požadavků: • řešení bude obecné pro různé druhy vyhledávání (uživatelé, publikace, pracoviště, předměty, . . . ), • programátor, který se rozhodne upravené vyhledávání použít, nebude muset nijak zasahovat do kódu vyhledávacích funkcí, • uživatel musí mít možnost nastavit si, jestli chce našeptávač používat nebo ne, • musí být možné povolit nebo zakázat použití rozšířeného vyhledávání globálně pro celý UIS. Změny na úrovni aplikací Vzhledem k požadavku, aby programátor, který bude chtít vyhledávání s pomocí technologie AJAX použít, nemusel zasahovat do kódu vyhledávácích funkcí, byla v aplikacích používajících služby modulu Vyber.pm provedena jediná změna. Když chce programátor použít rozšířené vyhledávání, zavolá metodu Vyber::add formular, která vytváří vstupní textové pole a tlačítko pro vyhledání s volitelným parametrem -ajax=>1. Pokud se tento parametr nepoužije, funguje vyhledávání standardním způsobem. Konstruktor objektu reprezentující třídu Vyber.pm zůstal nezměněn. Takto je zajištěno velice jednoduché použití pro ostatní programátory. Další změnou bylo vytvoření skriptu, jehož výstupem jsou data, která budou nabízena uživateli jako možné výsledky hledání. Aby se nemuselo znovu programovat vyhledávání nad databází, používá tento skript již hotové metody modulu Vyber.pm. Tento skript pracuje na základě parametrů, které jsou mu předány, takže funguje obecně pro různé druhy hledání. Při volání konstruktoru objektu reprezentujícího třídu UIS.pm je tento volán s parametry -img=>1 (nedochází k nastavení některých údajů v databázi) a -wlog=>’no’ (potlačen zápis do logu). Samotný výběr dat realizuje metoda Vyber::vyber. Výstupem tohoto skriptu jsou textové řetězce oddělené středníky. Pokud by mělo dojít ke změnám ve funkci, která výstup zpracovává, je možné jej podle potřeby jednoduše změnit. Tato situace by mohla nastat zejména v případě požadavku na rozšíření výstupu o další hodnoty. Např. kromě názvu pracoviště by bylo nutné získávat i jeho kód. Změny na úrovni modulů Největších změn doznal modul Vyber.pm a jeho metoda Vyber::formular. Tato metoda musela být rozšířena o podporu technologie AJAX a zároveň bylo nutné zachovat její funkce, aby mohla být používána i bez něj. Proto byla pouze doplněna o určité prvky, jejichž použití je podmíněno parametrem -ajax=>1, globálním povolením technologie AJAX v UIS a také nastavením uživatelských preferencí. Tato metoda vytváří na stránce vstupní textové pole a dohledávací tlačítko, a to pomocí metod z modulu UIS.pm.<br /> <br /> 37<br /> <br /> 7.2<br /> <br /> Vlastní realizace<br /> <br /> Volání metody vytvářející vstupní pole (UIS::textfield) bylo doplněno o prarametry -id, -onkeyup a -autocomplete. Hodnota parametru id umožňuje jednoznačnou identifikaci objektu na stránce, hodnotou parametru onkeyup je funkce, která zajišťuje obsluhu události při uvolnění tlačítka. Parametr autocomplete s hodnotou off vypíná zobrazování dříve zadávaných hodnot zapamatovaných prohlížečem pod vstupním textovým polem. Nejdůležitější změnou je doplnění kódu vraceného metodou Vyber.pm::formular o funkci request(), která zajišťuje obsluhu události onkeyup vstupního textového pole. Tato funkce obstarává vytvoření objektu XMLHttpRequest, odeslání požadavku na vyhledávací skript, přijetí odpovědi a její zpracování. Vytvoření objektu je popsáno v kapitole 4.6 a jeho metody a datové atributy jsou přehledně uvedeny v příloze A. Pro zobrazení výsledků vytváří metoda Vyber::formular nečíslovaný seznam a to pomocí metody UIS::ul. Tento seznam je pak modifikován funkcí request(). Funkce získá jako odpověď na svůj požadavek text v předem známém formátu. Text je dostupný jako hodnota datového atributu responseText objektu reprezentujícího XMLHttpRequest. Textový řetězec je poté rozdělen a převeden do pole, aby s ním bylo možno jednoduše pracovat. Následně je provedena modifikace seznamu a to pomocí metod removeChild a appendChild rozhraní Node. Toto rozhraní je definováno standardem W3C Level 1 DOM v modulu Core (W3C, 2006). Tyto metody umožňují odebrání resp. přidání položek seznamu. Seznam je vizuálně upraven pomocí CSS stylu. Drobných změn dostál i modul UIS.pm. Jednalo se o doplnění výše zmíněných parametrů do metody UIS::textfield a parametru -id do metody UIS::ul. Při implementaci jsem nenarazil na žádné závažnější potíže. Jedinou nepříjemností byla nutnost psát některé části kódu dvakrát z důvodů nekompatibility Internet Exploreru a ostatních prohlížečů. Na datové vrstvě nebylo třeba provádět žádné úpravy.<br /> <br /> 38<br /> <br /> 8<br /> <br /> 8<br /> <br /> ZÁVĚR<br /> <br /> Závěr<br /> <br /> Cílem této práce bylo analyzovat možnosti využití technologie AJAX v UIS a v návaznosti na to implementovat tuto technologii do některé z aplikací UIS. Práce se skládala z těchto částí: • studium problematiky informačních systémů, • studium webových technologií, které tvoří základ technologie AJAX, • studium práce protokolu http, • studium vlastní technologie AJAX, zjištění jejích výhod a nevýhod při použití v praxi, • analýza možností využití této technologie v UIS, • implementace do UIS. Po teoretickém nastudování uvedených problematik jsem provedl analýzu možností využití v UIS. Z té vyplynulo, že by bylo vhodné implementovat AJAX např. pro zobrazování nápovědných textů, vícekrokové výběry, zobrazování stromu dokumentů nebo pro vyhledávání. Právě posledně zmíněné využití jsem vybral pro ověření všech teoretický poznatků v praxi. Většina změn, která se týkala implementace AJAXového vyledávání se dotkla modulu Vyber.pm. Řešení tohoto problému splnilo všechny požadavky na ně kladené a je jednoduše použitelné v kterékoli aplikaci UIS. Jednoduchá použitelnost je dána voláním metody standardním způsobem pouze s jedním doplňkovým parametrem přičemž vnitřní implementace zůstává skryta. Důležité je, že dokázalo použitelnost technologie AJAX ve složitém prostředí informačního systému a přispěje ke zvýšení komfortu práce uživatelů UIS. V tomto ohledu dokonce předčilo mé očekávání, zejména co se týče zvýšení rychlosti odezvy aplikace. Při tvorbě jsem získal celou řadu zkušeností a znalostí. Tyto zkušenosti bych v budoucnu rád využil pro další integraci technologie AJAX do UIS. Existuje totiž mnoho dalších aplikací, ve kterých by použití této technologie zvýšilo uživatelskou přívětivost UIS, a jak již bylo řečeno v úvodu přívětivost informačního systému je velmi důležitá pro jeho celkové kladné hodnocení z pohledu uživatelů. Tyto znalosti však také jistě budou velkým budoucím přínosem jak v dalším studiu tak i v zaměstnání.<br /> <br /> 39<br /> <br /> 9<br /> <br /> 9<br /> <br /> LITERATURA<br /> <br /> Literatura<br /> <br /> Crane, D., Pascarello, E., James D. Ajax in action. Greenwich: Manning Publications, 2006, 650 s., ISBN 1-932394-61-3. Cascading Style Sheets [online]. World Wide Web Consortium. c1994, poslední revize 25. 05. 2006. [cit. 2006-05-29]. Dostupné z http://www.w3.org/TR/XMLHttpRequest/. CSS [online]. Wikipedia, otevřená encyklopedie. c2001, poslední revize 13. 05. 2006. [cit. 2006-05-15]. Dostupné z http://cs.wikipedia.org/wiki/CSS. Dařena, F. Jádro Univerzitního informačního systému. Diplomová práce, Brno: MZLU v Brně, 2002. Document Object Model (DOM) [online]. World Wide Web Consortium. c1994, poslední revize 19. 01. 2006. [cit. 2006-05-27]. Dostupné z http://www.w3.org/DOM/. Document Object Model [online]. Wikipedia, otevřená encyklopedie. c2001, poslední revize 18. 05. 2006. [cit. 2006-05-28]. i Dostupné z http://cs.wikipedia.org/wiki/Document Object Model. Extensible Markup Language (XML) [online]. World Wide Web Consortium. c1994, poslední revize 22. 04. 2006. [cit. 2006-05-29]. Dostupné z http://www.w3.org/XML/. Filípek, O. Historie počítačů – hypertext [online] c2000. [cit. 2006-05-25]. Dostupné z http://historie.ondrejfilipek.com/htmlverze/ mainbc3a.html?file=hypertext. Flanagan, D. JavaScript Kompletní průvodce, 2. aktualizované vydání. Brno: Computer press, 2002, 842 s., ISBN 80-7226-626-8. HyperText Markup Language (HTML) [online]. World Wide Web Consortium. c1994, poslední revize 31. 01. 2006. [cit. 2006-05-27]. Dostupné z http://www.w3.org/MarkUp/. HTML [online]. Wikipedia, otevřená encyklopedie. c2001, poslední revize 17. 05. 2006. [cit. 2006-05-18]. Dostupné z http://cs.wikipedia.org/wiki/Html. Kabelová, A. HTTP [online]. [cit. 2006-05-25]. Dostupné z http://www.cpress.cz/knihy/tcp-ip-bezp/HTTP/http1-1.htm. Klein, T. Rozšírení Záznamníku učitele o mechanismy zpětné vazby. Diplomová práce, Brno: MZLU v Brně, 2004, 75 s. Kobíková, Z. Hypertext [online] c2001. [cit. 2006-05-25]. Dostupné z http://fss.muni.cz/rpm/Revue/Heslar/hypertext.htm. 40<br /> <br /> 9<br /> <br /> LITERATURA<br /> <br /> Linux dokumentační projekt. Brno: Computer Press, 1998, 1020 s., ISBN 80-7226-114-3. Netrefová, H. Nové postupy uplatňované při návrhu uživatelsky přívětivých informačních systémů. Brno: MZLU v Brně, 2005, 132 s. Šorm, M. Univerzitní informační systém. Diplomová práce, Brno: MZLU v Brně, 2002. Šorm, M. Využití principu skládání komponent při návrhu webového informačního systému. Disertační práce, Brno: MZLU v Brně, 2005, 169 s. Pichlík, R. Poznáváme DOM [online]. c2002, poslední revize 1. 04. 2004. [cit. 200605-10]. Dostupné z http://www.sweb.cz/pichlik/archive/ 2004 01 04 archive.html#107324883230029650. Pichlík, R. Rich Internet Application [online] poslední revize 14. 06. 2005. [cit. 2006-05-13]. Dostupné z http://interval.cz/clanky/rich-internet-application/. Procházka, T. Nové způsoby získávání a prezentace dat z informačních systémů. Rozpracovaná disertační práce, Brno: MZLU v Brně, 2006. XML [online]. Wikipedia, otevřená encyklopedie. c2001, poslední revize 17. 05. 2006. [cit. 2006-05-17]. Dostupné z http://cs.wikipedia.org/wiki/XML. The XMLHttpRequest Object [online]. World Wide Web Consortium. c1994, poslední revize 04. 05. 2006. [cit. 2006-05-29]. Dostupné z http://www.w3.org/TR/XMLHttpRequest/.<br /> <br /> 41<br /> <br /> Přílohy<br /> <br /> A<br /> <br /> A<br /> <br /> VAZBY DOM MODULŮ<br /> <br /> Vazby DOM modulů<br /> <br /> Obrázek 9: Vazby DOM modulů<br /> <br /> 43<br /> <br /> B<br /> <br /> B<br /> <br /> XMLHTTPREQUEST<br /> <br /> XMLHttpRequest<br /> <br /> Tabulka 1: Metody XMLHttpRequestu<br /> <br /> Metoda abort() getAllResponseHeaders() getResponseHeader(název hlavičky) send(data)<br /> <br /> Popis zruší právě probíhající požadavek vrátí všechny příchozí HTTP hlavičky v jednom řetězci vrátí řetězec obsahující hodnotu požadované HTTP hlavičky odešle požadavek na server; může obsahovat též POST data (ve tvaru jmeno1=hodnota1&jmeno2=hodnota2) nastaví hlavičku HTTP požadavku<br /> <br /> setRequestHeader(název hlavičky, hodnota) open(metoda, adresa nastaví XmlHttpRequest: skriptu, async, login, heslo) • metoda: GET / POST / PUT • adresa skriptu: v relativním nebo absolutním tvaru • async: – je-li true, pak JavaScript nečeká po odeslání požadavku na odpověď (asynchronní režim) – je-li false, pak se čeká, než ze serveru dorazí odpověď (synchronní režim) • login a heslo se používají při HTTP autentifikaci; v případě potřeby prohlížeč zobrazí klasické přihlašovací okno<br /> <br /> 44<br /> <br /> B<br /> <br /> XMLHTTPREQUEST<br /> <br /> Tabulka 2: Datové atributy XMLHttpRequestu<br /> <br /> Datový atribut onreadystatechange readyState<br /> <br /> responseBody responseStream responseText responseXML<br /> <br /> status statusText<br /> <br /> Popis umožňuje nastavit funkci, která se zavolá vždy, jakmile se změní stav objektu XMLHttpRequest obsahuje jednu z těchto hodnot stavu objektu: 0 – objekt zatím není nastavený (nebylo voláno open()) 1 – objekt již je nastavený, ale ještě nebyla zavolána metoda send() 2 – byla zavolána metoda send(), je k dispozici atribut status a lze číst hlavičky 3 – data ještě nejsou plně stažena, ale atributy responseBody a responseText již obsahují nějaká data (zatím ne všechna) 4 – byla obdržena kompletní odpověď serveru a je plně k dispozici obsahuje tělo odpovědi ve formě bytů (unsigned bytes) obsahuje proud bytů obdržených ze serveru obsahuje text odpovědi (řetězec) obsahuje odpověď ve formě XML objektu, k obsahu lze přistupovat pomocí standardních DOM metod (server musí v tomto případě vrátit validní XML) obsahuje kód odpovědi serveru (číslo, například 200 pro OK, 404 pro Nenalezeno) obsahuje kód odpovědi ve formě řetězce, např. „OKÿ nebo „Not Foundÿ<br /> <br /> 45<br /> <br /> </div> </div> </div> </div> </div> </div> </div> </div> <div class="modal fade" id="report" tabindex="-1" role="dialog" aria-hidden="true"> <div class="modal-dialog"> <div class="modal-content"> <form role="form" method="post" action="https://adoc.pub/report/vyuiti-technologie-ajax-v-univerzitnim-informanim-systemu" style="border: none;"> <div class="modal-header"> <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button> <h4 class="modal-title">Report "Využití technologie AJAX v Univerzitním informačním systému"</h4> </div> <div class="modal-body"> <div class="form-group"> <label>Your name</label> <input type="text" name="name" required="required" class="form-control" /> </div> <div class="form-group"> <label>Email</label> <input type="email" name="email" required="required" class="form-control" /> </div> <div class="form-group"> <label>Reason</label> <select name="reason" required="required" class="form-control"> <option value="">-Select Reason-</option> <option value="pornographic" selected="selected">Pornographic</option> <option value="defamatory">Defamatory</option> <option value="illegal">Illegal/Unlawful</option> <option value="spam">Spam</option> <option value="others">Other Terms Of Service Violation</option> <option value="copyright">File a copyright complaint</option> </select> </div> <div class="form-group"> <label>Description</label> <textarea name="description" required="required" rows="3" class="form-control" style="border: 1px solid #cccccc;"></textarea> </div> <div class="form-group"> <div style="display: inline-block;"> <div class="g-recaptcha" data-sitekey="6LcEnMcZAAAAAFHzKKgaE-Qh57XzUTzpfRElD4dP"></div> </div> </div> <script src='https://www.google.com/recaptcha/api.js'></script> </div> <div class="modal-footer"> <button type="button" class="btn btn-default" data-dismiss="modal">Close</button> <button type="submit" class="btn btn-primary">Send</button> </div> </form> </div> </div> </div> <script> $(document).ready(function () { var inner_height = $(window).innerHeight() - 250; $('#pdfviewer').css({"height": inner_height + "px"}); }); </script> <footer class="footer" style="margin-top: 60px;"> <div class="container-fluid"> Copyright © 2024 ADOC.PUB. All rights reserved. <div class="pull-right"> <span><a href="https://adoc.pub/about">About Us</a></span> | <span><a href="https://adoc.pub/privacy">Privacy Policy</a></span> | <span><a href="https://adoc.pub/term">Terms of Service</a></span> | <span><a href="https://adoc.pub/copyright">Copyright</a></span> | <span><a href="https://adoc.pub/contact">Contact Us</a></span> | <span><a href="https://adoc.pub/cookie_policy">Cookie Policy</a></span> </div> </div> </footer>  <div class="modal fade" id="login" tabindex="-1" role="dialog" aria-labelledby="myModalLabel"> <div class="modal-dialog" role="document"> <div class="modal-content"> <div class="modal-header"> <button type="button" class="close" data-dismiss="modal" aria-label="Close" on="tap:login.close"><span aria-hidden="true">×</span></button> <h4 class="modal-title" id="add-note-label">Sign In</h4> </div> <div class="modal-body"> <form action="https://adoc.pub/login" method="post"> <div class="form-group"> <label class="sr-only" for="email">Email</label> <input class="form-input form-control" type="text" name="email" id="email" value="" placeholder="Email" /> </div> <div class="form-group"> <label class="sr-only" for="password">Password</label> <input class="form-input form-control" type="password" name="password" id="password" value="" placeholder="Password" /> </div> <div class="form-group"> <div class="checkbox"> <label class="form-checkbox"> <input type="checkbox" name="remember" value="1" /> <i class="form-icon"></i> Remember me </label> <label class="pull-right"><a href="https://adoc.pub/forgot">Forgot password?</a></label> </div> </div> <button class="btn btn-primary btn-block" type="submit">Sign In</button> </form> </div> </div> </div> </div>  <script async src="https://www.googletagmanager.com/gtag/js?id=UA-177279549-1"></script> <script> window.dataLayer = window.dataLayer || []; function gtag(){dataLayer.push(arguments);} gtag('js', new Date()); gtag('config', 'UA-177279549-1'); </script> <script src="https://adoc.pub/assets/js/jquery-ui.min.js"></script> <link rel="stylesheet" href="https://adoc.pub/assets/css/jquery-ui.css"> <script> $(function () { $("#document_search").autocomplete({ source: function (request, response) { $.ajax({ url: "https://adoc.pub/suggest", dataType: "json", data: { term: request.term }, success: function (data) { response(data); } }); }, autoFill: true, select: function( event, ui ) { $(this).val(ui.item.value); $(this).parents("form").submit(); } }); }); </script>  <div id="ADOCPUB_cookie_box" style="z-index:99999; border-top: 1px solid #fefefe; background: #FFC107; width: 100%; position: fixed; padding: 5px 15px; text-align: center; left:0; bottom: 0;"> Our partners will collect data and use cookies for ad personalization and measurement. <a href="https://adoc.pub/cookie_policy" target="_blank">Learn how we and our ad partner Google, collect and use data</a>. <a href="#" class="btn btn-success" onclick="accept_ADOCPUB_cookie_box();return false;">Agree & close</a> </div> <script> function accept_ADOCPUB_cookie_box() { document.cookie = "ADOCPUB_cookie_box_viewed=1;max-age=15768000;path=/"; hide_ADOCPUB_cookie_box(); } function hide_ADOCPUB_cookie_box() { var cb = document.getElementById('ADOCPUB_cookie_box'); if (cb) { cb.parentElement.removeChild(cb); } } (function () { var ADOCPUB_cookie_box_viewed = (function (name) { var matches = document.cookie.match(new RegExp("(?:^|; )" + name.replace(/([\.$?*|{}\[\]\\\/\+^])/g, '\\$1') + "=([^;]*)")); return matches ? decodeURIComponent(matches[1]) : undefined; })('ADOCPUB_cookie_box_viewed'); if (ADOCPUB_cookie_box_viewed) { hide_ADOCPUB_cookie_box(); } })(); </script>  </body> </html>

Využití technologie AJAX v Univerzitním informačním systému

Recommend Documents

,