SVEUC ILIŠTE U ZAGREBU

FAKULTET ELEKTROTEHNIKE I RAČUNARSTVA

ZAVRŠNI RAD br. 5148

Klijentska aplikacija za korisničku autorizaciju i pristup

usluzi igara zasnovanih na računalnom oblaku

Tomislav Šipušić

Zagreb, lipanj 2017.

Zahvaljujem se izv.prof.dr.sc Lei Skorin-Kapov, mag.ing Ivanu Slivaru i dr.sc Mirku Sužnjeviću na pomoći i potpori u izradi ovog rada.

i

Sadržaj

Uvod ................................................................................................................................. 1

1. Igre zasnovane na računalnom oblaku ....................................................................... 2

2. Arhitektura sustava ..................................................................................................... 6

2.1. Klijentska aplikacija za autorizaciju ................................................................. 7

2.2 Virtualizacijski poslužitelj ................................................................................. 9

2.3 GamingAnywhere ............................................................................................ 10

2.4 Sustav za autorizaciju AAI@EduHr ................................................................ 11

3. Oblikovanje web servisa .......................................................................................... 13

3.1. Korisnički zahtjevi .......................................................................................... 13

3.2. Korištene tehnologije ...................................................................................... 15

3.2.1. .NET okruženje ...................................................................................... 15

3.2.2. Entity Framework .................................................................................. 15

3.2.3. HTTP protokol + JSON format ............................................................. 16

3.3. Baza podataka ................................................................................................. 16

3.4. Web servisi ...................................................................................................... 17

4. Klijentska aplikacija za autorizaciju ........................................................................ 21

4.1. Korištene tehnologije ...................................................................................... 21

4.1.1. MVC arhitekturat................................................................................... 21

4.1.2. HTML + CSS ........................................................................................ 22

ii

4.1.3. JavaScript + AJAX + Razor .................................................................. 23

4.2. Grafičko sučelje .............................................................................................. 24

4.3. Integracija AAI@EduHr autorizacije ............................................................. 28

4.4. Instalacija GamingAnywhere klijenta ............................................................ 29

Zaključak .................................................................................................................. 32

Literatura .................................................................................................................. 33

Sažetak ...................................................................................................................... 35

Summary .................................................................................................................. 36

Popis slika ................................................................................................................ 37

Privitak ..................................................................................................................... 38

1

Uvod

Proteklih nekoliko godina velika pažnja se pridaje digitalizaciji obrazovnih

ustanova. Pod time se podrazumijeva opremanje ustanova računalima i ostalim tehničkim

pomagalima kako bi se unaprijedilo izvođenje nastave. Uvođenje digitalizacije tako ima

dvojaku ulogu: pružanje mogućnosti učenicima da steknu konkretna tehnička znanja i

vještine, a s druge strane povećanje efikasnosti i brzine iznošenja nastavnih sadržaja.

Osnovno sredstvo digitalizacije je osobno računalo pomoću kojega je moguće obaviti sve

aktivnosti vezane za učenje i administraciju. Kako bi učenici lakše savladali gradivo

potrebno im je pružiti dodatne nastavne sadržaje. Profesori su na svojim predavanjima

ograničeni na ploču ili projektor da bi učenicima približili gradivo. Računalo može pružiti

puno bolju vizualizaciju nastavnog sadržaja i dodatno zainteresirati učenike za gradivo.

U ovom razmatranju promatrana je jedna kategorija edukativnih digitalnih

sredstava, a to su edukativne računalne igre. To su igre specijalno dizajnirane kako bi

korisnik kroz igru stekao nova znanja ili utvrdio stara. Zadatak ovoga rada je osmisliti

sustav koji bi pružao mogućnost igranja edukativnih igara smještenih u računalnom

oblaku. To znači da su igre instalirane na udaljenom poslužitelju i tamo se izvode kada

korisnik zatraži resurse. Poslužiteljsko računalo sadrži više virtualnih nezavisnih

strojeva, svaki s pripadajućim operacijskim sustavom i softverskom podrškom. Klijentsko

računalo sasvim je neovisno o poslužitelju, potrebno je samo imati pristup Internetu te

programsku podršku za direktni prijenos video sadržaja.

Predloženi sustav ima tri glavne komponente: web aplikaciju za rezervaciju

resursa na poslužitelju, podršku za direktni prijenos slike i ulaznih kontrola te

poslužiteljsko računalo. U sljedećem poglavlju nalazi se motivacija za ovaj rad i opis

računalnog oblaka. Drugo poglavlje sadrži opis svake komponente sustava i pregled

kompletne arhitekture. Treće i četvrto poglavlje opisuju implementaciju sa

demonstrativnim primjerima i ključnim dijelovima koda. Prije opisa implementacije

nalazi se kratki uvod u tehnologije korištene za izradu svih komponenata kao i zahtjevi

koje komponente moraju zadovoljavati. Na kraju je dan zaključak o mogućnostima

računalnog oblaka i njegove primjene u obrazovanju.

2

1. Igre zasnovane na računalnom

oblaku

Korisnici osobnih računala često su ograničeni programskim i hardverskim

resursima koje računalo nudi. Računalna konfiguracija dostupna prije dvije do tri godine

više ne može osigurati nesmetano korištenje najnovijeg softvera. Ubrzani razvoj

tehnologije tjera krajnje korisnike da stalno kupuju nove komponente, što može biti vrlo

skupa investicija. Prilikom izgradnje računalnog sustava biraju se komponente koje

odgovaraju trenutnim zahtjevima. Vrlo je teško predvidjeti kakvi će biti zahtjevi u

budućnosti i hoće li komponente biti prikladne za nove zahtjeve. Primjerice, ako korisnik

kupi računalo sa slabijom grafičkom karticom jer nema namjeru pokretati grafički

zahtjevne programe, u budućnosti je ograničen na sporo procesiranje grafike. Taj problem

donekle je lako riješiti ako se radi o jednom osobnom računalu. Kod većih računalnih

sustava ovaj problem nadogradnje puno je teže i skuplje izvesti. Što se tiče softverske

podrške, vrlo važan faktor je veličina i vrijeme koje nam je softver potreban. Ako je nekom

velikom skupu računala potreban određeni softver u periodu od nekoliko dana, pitanje je

isplati li se instalirati taj softver na sva računala. Zamislimo scenarij gdje imamo učionicu

s dvadesetak računala. Ukoliko profesor želi omogućiti igranje određene igre, u klasičnom

scenariju on mora na svako računalo instalirati igru. Uz to javlja se i problem

kompatibilnosti računala. Možda će biti potrebno instalirati dodatne grafičke drivere,

osloboditi ionako ograničenu memoriju ili u nekom ekstremnom slučaju instalirati drugi

operacijski sustav koji uopće nije prigodan za to računalo. Važno je primijetiti koliko se

mogućih komplikacija može javiti pri naizgled jednostavnom zadatku. Računala u

informatičkim učionicama ne mogu se mijenjati svake godine i pratiti zadnje tehnološke

standarde. Upravo zato potrebno je imati modularni sustav s više nezavisnih

komponenata.

Računarstvo u oblaku je naziv za arhitekturu u kojoj korisnici dijele zajedničke

resurse poslužitelja. Oblak označava skup komponenata i svojstava čija implementacija i

struktura nisu vidljivi ostatku sustava. Krajnji korisnik poznaje samo sučelje preko kojeg

koristi resurse, a ostatak sustava vidi izvana kao apstraktnu cjelinu, tj. oblak.

3

Slika 1.1 Shema računalnog oblaka

Na slici 1.1 prikazana je shema računalnog oblaka i krajnjih korisnika. Komunikacija

između klijenta i usluge uglavnom se odvija putem Interneta. Ubrzani razvoj mrežne

infrastrukture posljednjih godina omogućio je korištenje punog potencijala računalnog

oblaka. Prema tipu usluga koje oblak nudi klijentu razlikujemo sljedeće modele [17]:

Infrastrukturni (engl. Infrastructure as a Service - IAAS)

Platformski (engl. Platform as a Service - PAAS)

Podatkovni (engl. Data as a Service - DAAS)

Softverski (engl. Software as a Service - SAAS)

Infrastrukturni model nudi korisniku hardverske resurse kao što su procesorske jezgre

ili memorija. U platformskom modelu objedinjuje se korištenje hardvera i softvera tako

da korisnik dobije razvojni paket prilagođen svojim potrebama. Takav paket obično

sadrži web poslužitelj, bazu podataka, programski radni okvir itd. Najbolji primjer

ovakve usluge je Windows Azure [18] pomoću koje se web aplikacije mogu

jednostavno pohraniti i izvoditi na poslužitelju. Podatkovni model usko je vezan za

platformski, no njegova primarna zadaća je pružiti infrastrukturu za pohranu

podataka. Korisnici koji žele koristiti gotove aplikacije i programe, a nemaju prikladno

4

računalo za pokretanje, koristit će softverski model. Uz to će se naravno rezervirati i

fizički resursi za pokretanje određenog programa, no korisnik nije svjestan tog

procesa. Ovakav model pogodan je za prethodno opisanu situaciju s učionicom i

omogućavanjem pristupa edukativnim sadržajima.

Na temelju softverskog modela računalnog oblaka razvila se ideja o igrama

zasnovanim na računalnom oblaku. Takve igre instalirane su na poslužiteljsko računalo

i spremne su za pokretanje kada ih korisnik zatraži (engl. play on demand). Računalni

oblak brine se o tome da svaki korisnik dobije dovoljno hardverskih resursa kako bi

bez smetnji pokretao igre.

Slika 1.2 Pokretanje igara preko računalnog oblaka

Slika 1.2 prikazuje povezanost računalnog oblaka sa krajnjim korisnicima. Uređaj pomoću

kojeg korisnik pristupa sadržajima treba imati instaliran program za komunikaciju sa

poslužiteljem i dobru internetsku vezu. Nakon što je korisnik odabrao željenu igru, od

poslužitelja dobiva video sadržaj u stvarnom vremenu. Glavna prednost ove usluge je

potpuna sloboda korištenja na različitim uređajima, što znači da je igre moguće pokretati

na računalu, mobitelu ili tabletu, bez ovisnosti o operacijskom sustavu uređaja.

5

U ovom radu konkretno će se promatrati računalni oblak koji pruža obrazovnim

ustanovama jednostavan pristup edukativnim igrama. Takve igre koriste se većinom kao

pomoć pri nastavi i dodatni poticajni sadržaj za učenike. Dokazana je činjenica da učenici,

pogotovo oni mlađi, puno brže usvajaju gradivo uz neku vrstu interakcije s nastavnim

sadržajem [19]. Igre također sadrže sustav napredovanja i nagrada što učenike motivira

da nastave igru. Kroz razne animacije i interaktivne sadržaje učenicima se nudi stjecanje

novih znanja i utvrđivanja gradiva.

Slika 1.3 Prikaz igre Crazy Machines 3 (Slika preuzeta s [1])

Najzastupljenija kategorija edukativnih igara su matematičke igre koje kombiniraju

rješavanje kratkih zadataka i dinamički scenarij same igre. Drugi primjer su igre koje

simuliraju neke fizičke zakone te omogućavaju učenicima da eksperimentiraju sa raznim

postavkama (Slika 1.3). Potrebno je dakle na jednom mjestu imati nekoliko igara različitih

tematika tako da učitelji i učenici mogu odabrati što ih zanima. Predloženi sustav

omogućio bi nastavnicima da rezerviraju resurse oblaka za odabrane učenike. Za svaku

rezervaciju pokreće se virtualno računalo sa unaprijed instaliranim igrama, a korisnik

jednim klikom dobiva video prijenos sa virtualnog računala. Pristup usluzi bio bi moguć

sa postojećih računala u informatičkoj učionici bez ikakve nadogradnje fizičkih

komponenata. Dodavanje nove igre zahtijevalo bi samo instalaciju na jednom virtualnom

računalu koje se kasnije umnožava posebno za svaku rezervaciju. U poglavlju koje slijedi

detaljnije je objašnjena tehnička izvedba ovog sustava.

6

2. Arhitektura sustava

Za prikaz šire slike sustava i međudjelovanja glavnih komponenti potrebno je

pogledati sliku 2.1. Treba naglasiti kako ova slika ne prikazuje detaljan raspored i

unutarnju strukturu komponenata, već samo apstraktni pregled. U sklopu ovog rada

izrađena ja klijentska aplikacija za autorizaciju, baza podataka i rezervacijski

poslužitelj. U klijentsku aplikaciju integrirano je pokretanje GamingAnywhere [6]

servisa preko kojeg klijent komunicira s virtualnim računalom.

Slika 2.1 Arhitektura sustava

Klijentska aplikacija za autorizaciju sastoji se od skupa web servisa i grafičkog sučelja

preko kojeg korisnik šalje upite. Korisnik putem web aplikacije vrši prijavu u

AAI@EduHr sustav. Aplikacija šalje zahtjev za prijavom na AAI@EduHr autorizacijski

servis koji obavlja autorizaciju. Svi podaci o korisnicima pohranjenu su u LDAP

imeniku. Putem GamingAnywhere usluge korisnik se izravno spaja s jednim virtualnim

7

strojem (oznaka VM). Ova usluga korisniku šalje video i zvuk sa VM, a od korisničke

strane stižu upravljačke kontrole. GamingAnywhere nalazi se na klijentskom računalu

i na virtualnim strojevima, a ovdje ga promatramo u smislu protokola za komunikaciju,

a ne kao fizičku komponentu. Baza podataka služi nam za bilježenje trenutnog stanja

sustava. Tamo su podaci o svim dostupnim virtualnim strojevima i njihovim IP

adresama, podaci o korisnicima i njihovim rezervacijama itd. Detaljniji pregled baze

podataka bit će iznesen u kasnijim poglavljima. S bazom komuniciraju rezervacijski

poslužitelj i sustav za upravljanje virtualnim strojevima. Klijent preko rezervacijskog

poslužitelja šalje upit za rezervacijom nekog virtualnog stroja. Rezervacija zatim

prolazi provjeru i upisuje se u bazu podataka. Servisi za upravljanje i raspoređivanje

virtualnim strojevima periodički čitaju bazu te na temelju podataka o rezervacijama

izvršavaju kod za pokretanje ili gašenje strojeva. Na virtualizacijskom poslužitelju

nalazi se grafička kartica čiji resursi su podijeljeni između virtualnih strojeva. Virtualni

strojevi trebaju imati instaliran operacijski sustav, pokretačke programe za grafičku

karticu, GamingAnywhere poslužitelj te računalne igre po izboru. Korisnik preko

usluge GamingAnywhere može pristupiti igrama koje su instalirane na strojeve.

Prilikom testiranja sustava klijentsko računalo i poslužitelj su smješteni u istu

internetsku podmrežu kako bi se zaobišli sigurnosni problemi.

2.1 Klijentska aplikacija za autorizaciju

Klijentska strana sustava sastoji se od klijentske aplikacije i sustava za prijenos

podataka. Svrha aplikacije je korisniku omogućiti jednostavno i intuitivno rezerviranje

virtualnih strojeva. Uvjeti za pokretanje aplikacije su internetska veza te neka od

novijih verzija bilo kojeg internetskog preglednika. Aplikacija je prilagođena svim

poznatijim pretraživačima kao što su Chrome, Mozilla, Opera, Safari, Edge itd. Potrebno

je naglasiti da aplikacija nije predviđena za mobilne uređaje zbog toga što je grafičko

sučelje izrađeno za standardne veličine ekrana osobnog računala. Rad na aplikaciji

podijeljen je u dva dijela, poslužiteljski i korisnički. U sklopu drugog završnog rada [2]

opisana je implementacija poslužitelja za raspoređivanje virtualnih strojeva. Slika 2.2

prikazuje sastavne dijelove aplikacije:

8

Slika 2.2 Prikaz slojeva aplikacije

U dijagramu je korištena kratica VM (''Virtual Machine'') koja označava virtualni stroj

na poslužitelju. Glavninu ovog sustava čine servisi za obradu podataka koji obavljaju

svu logiku. Tako na primjer postoje servisi koji dohvaćaju sve rezervacije u tekućem

danu, vrše upite nad bazom podataka, provjeravaju dostupnost termina i slično. Opis

servisa i njihova implementacija nalaze se u poglavlju 4. Izgradnjom tankog klijenta sva

logika je prebačena na udaljena sučelja. Klijentska strana mora samo poznavati ime

servisa i parametre koje treba poslati, dakle servisi djeluju kao sučelje. Ovime je

pospješeno načelo nadogradnje bez promjene. To znači da se može promijeniti

funkcionalnost nekog servisa bez da se mijenja implementaciju klijenta. Dok god se

klijent i sučelje drže svojeg ugovora o ulaznim parametrima i metodama, klijentski kod

potpuno je neovisan. Slična stvar vrijedi i za servise koji upravljaju virtualnim

strojevima.

9

2.2 Virtualizacijski poslužitelj

Osnovica cijelog sustava je fizički poslužitelj koji sadrži hardversku i softversku

podršku. Hardver je potrebno prilagoditi konkretnim korisničkim zahtjevima, broju

zahtjeva, načinu prijenosa i slično. U sklopu projekta [3] utvrđeno je da za postizanje

idealnih uvjeta moramo svakom virtualnom računalu dodijeliti 8 gigabajta radne

memorije te 4 procesorske jezgre. Na svim računalima instaliran je operacijski sustav

Windows 10. U slučaju iznimno zahtjevnih igara preporuča se dodijeliti čak 8

procesorskih jedinica jednom virtualnom stroju. Potrebno je instalirati grafičku karticu

koja ima mogućnost dijeljenja svojih resursa u više virtualnih grafičkih procesorskih

jedinica (engl. virtual GPU). Prilikom testiranja korištena je grafička kartica NVIDIA

Grid K1. Kako bi se olakšala administracija poslužitelja koristimo program XenCenter

[4], koji je zapravo grafičko sučelje za upravljanje poslužiteljskim sustavom XenServera

[5]. Nakon stvaranja jednog virtualnog stroja, moguće je isti više puta klonirati.

Detaljniji opis virtualizacijskog poslužitelja nalazi se u drugom radu [2]. Na slici 2.3 sa

lijeve strane vidimo popis svih virtualnih strojeva te njihovo trenutno stanje. U desnom

dijelu prozora pokrenuto je mjerenje performansi procesorskih jedinica odabranog

virtualnog stroja u trenutku prijenosa video sadržaja prema klijentu.

Slika 2.3 Sučelje programa XenCenter

10

2.3 GamingAnywhere

GamingAnywhere je platforma otvorenog koda namijenjena za prijenos

multimedijskih sadržaja u stvarnom vremenu. Usko je specijalizirana za prijenos slike,

zvuka i kontrola za računalne igre. Postoji podrška za Windows, Linux, Mac OS X i

Android. Programski paket sastoji se od poslužiteljskog i klijentskog dijela. Na računalu

koje sadrži resurse za igranje potrebno je preko komandne linije pokrenuti poslužitelj.

Postavke poslužitelja moguće je podesiti preko konfiguracijskih datoteka, koje su

podijeljene u općenite datoteke i konkretne. Općenite datoteke sadrže popis

konkretnih datoteka koje treba uključiti prilikom pokretanja poslužitelja. Konkretne

konfiguracijske datoteke određuju konfiguraciju slike, zvuka i kontrola. Na primjer, u

datoteci ''video-x264-param.conf '' možemo promijeniti brzinu prijenosa (engl.

bitrate), veličinu spremnika za učitavanje (engl. buffer size), broj slika po sekundi (engl.

frames per second, FPS) i još mnogo drugih postavki usluge. Što se tiče kontrola koje

stižu s klijentske strane, one se mogu obrađivati na 2 načina: relativni i apsolutni. Kod

apsolutnog načina rada pozicija korisničkog miša šalje se kao apsolutna koordinata

opisana točkom T(x,y), dok relativni način također šalje koordinatu, međutim on bilježi

pomak miša relativno s obzirom na prethodni položaj. Korisnik prilikom spajanja na

poslužitelj mora u komandnoj liniji odabrati način prijenosa, a on će ovisiti o vrsti igre.

Za prijenos podataka koristi se protokol UDP (engl. User Datagram Protocol). Ovaj

protokol pruža brzo slanje kratkih paketa podataka u stvarnom vremenu, bez potvrde

o uspješnom prijenosu. Kod svakog prijenosa multimedijskog sadržaja uživo prioritet

je što manje kašnjenje, a potencijalni gubitak podataka je uračunati rizik. Gubitak

podataka u našem slučaju manifestira se kao gubitak jednog ili dva okvira slike. Uz

video prijenos od 30 slika u sekundi ovaj eventualni gubitak korisniku ne bi trebao

pokvariti iskustvo. U konfiguracijskoj datoteci moguće je odabrati i druge protokole za

prijenos, kao što je protokol TCP (engl. Transmission Control Protocol). Ovaj protokol

pruža spojnu uslugu i bitno sporije prenosi podatke od prethodno spomenutog UDP-a.

Testovi s TCP protokolom su pokazali da je sustav sasvim funkcionalan, međutim

brzina prijenosa ne zadovoljava standarde kakve korisniku treba isporučiti.

11

Slika 2.4 Video prijenos i klijentska konzola usluge GamingAnywhere

Tijekom trajanja veze s poslužiteljem moguće je u komandnoj liniji pratiti neke

značajne parametre prijenosa, što prikazuje slika 2.4. Periodički se ispisuju broj slika u

sekundi, broj izgubljenih paketa i broj bitova u sekundi. Svaki neočekivani prestanak

rada poslužiteljskog dijela aplikacije automatski povlači za sobom gašenje klijentske

konzole. Preduvjet za ovakav sustav je dobra mrežna infrastruktura. Brzina

preuzimanja podataka trebala bi se kretati između 30 i 40 megabita po sekundi. Za

postizanje visoke kvalitete prijenosa preporučljivo je klijentsko računalo spojiti na

Internet putem žice. Bežična mreža može djelovati ograničavajuće na prijenos paketa,

pogotovo ako istu mrežu koristi veliki broj korisnika.

2.4 Sustav za autorizaciju AAI@EduHr

Svaki učenik, student i djelatnik obrazovnih ustanova u Hrvatskoj ima svoj

osobni jedinstveni identifikator. AAI@EduHr je autorizacijska infrastruktura sustava

znanosti i visokog obrazovanja u Republici Hrvatskoj [7]. Osobe koje su u ovom sustavu

imaju u bazi podataka pohranjen svoj elektronički identitet. Ustanovama je za

spremanje podataka dodijeljen posebni LDAP imenik. LDAP (engl. Lightweight

Directory Access Protocol) je aplikacijski protokol koji omogućava čitanje i pisanje

datoteka koje su organizirane kao imenici. U imeničkom sustavu postoje produkcijski

resursi namijenjeni za široku primjenu, dok se za razvoj i testiranje koriste testni

12

resursi. Za izradu ovog rada zatražen je jedan testni LDAP imenik s pravom unosa i

ažuriranja korisnika. Takav imenik trebao bi simulirati stvarnu bazu učenika i

profesora, a korisnici su ručno unošeni u bazu. Korisnik se prijavljuje sa svojim

identifikatorom i lozinkom koju može sam postaviti. Testne imenike i resurse

objedinjuje usluga AAI@EduHr Lab koji je razvojna inačica gore spomenutog sustava.

Na Internet stranicama moguće je pronaći aplikacijsko sučelje koje služi za spajanje sa

AAI@EduHr uslugom. Uputstva za implementaciju dostupna su za više popularnih

razvojnih platformi kao što su .NET, Java, PHP i Python. Detaljniji postupak kako je ova

aplikacija povezana s uslugom bit će prikazan u kasnijim poglavljima. Dodatna

prednost ove usluge je i takozvani sustav jedinstvene autentikacije korisnika (engl.

single Sign-On, SSO). Ovo omogućuje korisnicima da se prijave na ostale servise koji

koriste SSO bez ponovnog upisivanja lozinke.

13

3. Oblikovanje web servisa

3.1 Korisnički zahtjevi

Svako oblikovanje programske potpore započinje izlučivanjem korisničkih

zahtjeva. Glavni korisnici su profesori koji koriste punu funkcionalnost sustava. Potrebno

je omogućiti prijavu preko sučelja aplikacije, te nakon prijave preusmjeriti korisnika

prema glavnom izborniku. Izbornik treba na jednom mjestu sadržavati pristup svim

opcijama koje aplikacija pruža. Ovisno o tome koja vrsta korisnika se prijavi, neke opcije

će biti nedostupne. Sučelje treba biti jednostavno i intuitivno, uz jasno naglašene opcije i

jednostavan pristup. Prilikom rezervacije korisnik odabire željeni datum i vrijeme, a

paralelno može pregledati ostale rezervacije koje su već zabilježene u sustavu. Nakon

odabira termina prikazuje se popis učenika za koje je profesor nadležan. Popis treba biti

izveden tako da se može odabrati više učenika odjednom i poslati obrazac za rezervaciju

na obradu. U slučaju da odabrani termin nije dostupan ili nema dovoljno slobodnih

računala potrebno je ispisati odgovarajuću poruku. Na info stranicama dostupan je kratki

opis aplikacije te naputak za korištenje. Tamo se nalazi i instalacija desktop aplikacije koja

je dostupna za preuzimanje u zip formatu. Upute za instalaciju dostupne su na info stranici

kao i u samoj zip datoteci. Nakon instalacije trenutno je dostupna usluga spajanja sa

udaljeni virtualni stroj. Korisniku je potrebno prikazati njegove osobne rezervacije i

linkove za spajanje na posebnoj stranici.

Gore navedene korisničke zahtjeve pretvaramo u odgovarajuće UML dijagrame

radi lakšeg snalaženja. Vidljivo je da postoje dva tipa korisnika – profesor i učenik. Između

njih koristimo vezu generalizacije jer profesor može obavljati iste radnje kao i učenik uz

svoje specijalizirane radnje (Slika 3.1).

14

Slika 3.1 Dijagram obrazaca uporabe implementirane usluge

Baza podataka je pasivni sudionik koji sudjeluje u svim operacijama čitanja, brisanja i

ažuriranja podataka. Administrator sustava je posebni sudionik čije funkcije nisu

striktno zadane i on svoje zadatke obavlja izvan ove aplikacije.

Od nefunkcionalnih zahtjeva najvažniji su oni koji se odnose na iskustvo

korisnika. Kako bi smanjili dodatne upite u bazu, važno je korisnika obavijestiti koliko

je slobodnih mjesta u nekom terminu. Algoritam za rezervaciju treba provjeriti sva

moguća preklapanja traženog termina i ostalih termina te javiti korisniku točan

podatak o slobodnim mjestima. Svako polje za unos sadrži validacijska pravila, a

ukoliko nisu zadovoljena ispisuje se određena poruka. Poveznice za spajanje s

virtualnim strojem treba onemogućiti ako korisnik slučajno odabere poveznicu čije

vrijeme ne odgovara trenutnom vremenu. Pretpostavka je da su vremenske zone na

poslužitelju i klijentskim računalima usklađene.

15

3.2 Korištene tehnologije

3.2.1 .NET okruženje

.NET je programsko okruženje razvijeno od Microsofta koje olakšava razvoj

programskih rješenja [8]. Sadrži veliku zajedničku kolekciju biblioteka nazvanu

Framework Class Library u kojoj možemo pronaći standardne biblioteke za ulaz/izlaz,

kolekcije, web sučelja itd. Najvažnija značajka okruženja je mogućnost pisanja rješenja u

različitim jezicima, ovisno o tome kakav problem rješavamo. Napisani kod izvršava se u

CLR sustavu (engl. Common Language Runtime). JIT kompajler (engl. Just in Time) testira

funkcionalnost i prevodi kod u strojni jezik. Prije strojnog jezika potrebno je kod prevesti

u jezik srednjeg sloja, u ovom slučaju MSIL (engl. Microsoft Intermediate Language). To je

skup nezavisnih instrukcija koji nastaje kada kompajler obradi napisani višejezični kod, a

on se potom može pretvoriti pomoću CLR-a u izvršni program. U ovom radu korišten je

jezik C# i paket Entity Framework.

3.2.2 Entity Framework

ADO.NET je Microsoftova tehnologija za komunikaciju sa bazom podataka koju

korisnici koriste kada direktno iz koda žele pristupiti bazi [9]. U ovom slučaju korištena

je relacijska SQL baza koju držimo na lokalnom poslužitelju. Entity Framework razvijen

je u sklopu ADO.NET-a i služi za stvaranje programskog modela baze podataka. To

konkretno znači da se iz entiteta u bazi podataka stvaraju podatkovne i upravljačke klase

koje možemo koristiti kao bilo koje druge klase. Koristeći pristup da se prvo izgradi baza,

a zatim stvori model, programer ne treba ručno povezivati entitete i klase. Svi podatkovni

tipovi, primarni i strani ključevi te dodatne opcije mogu se naknadno mijenjati u modelu.

Korištena je i komponenta LINQ (engl. Language Integrated Query) koja jezicima u .NET

platformi omogućava postavljanje upita u bazu. LINQ izrazi vrlo su slični SQL naredbama

te se lako koriste, a podržavaju sve standardne tipove podataka kao i dohvaćanje

podataka u listama.

16

3.2.3 HTTP protokol + JSON format

Kako bi se ostvarila komunikacija između web servisa i klijenta koristimo

internetski protokol HTTP (engl. HyperText Transfer Protocol). To je protokol

aplikacijskog sloja koji nudi spojnu uslugu s klijentom [10]. Za svaki zahtjev klijenta

otvara se nova konekcija, uobičajeno na portu 80 koji je rezerviran za ovaj protokol.

Pomoću POST metode moguće je podatke zahtjeva upakirati u tijelo poruke koji su

dogovoreni s obje strane, a zahtjev specificira određeni URI – identifikator resursa.

Odgovor prema klijentu šalje se u formatu JSON. JSON (engl. JavaScript Object Notation)

je standardizirani format zapisa podataka, dizajniran tako da je lako čitljiv čovjeku.

Pomoću ovog formata možemo objekt pretvoriti u niz zapisa oblika atribut-vrijednost..

3.3 Baza podataka

Prije implementacije same aplikacije potrebno je izgraditi bazu podataka koja

opisuje sustav. Zbog jednostavnosti i zbog toga što je ovo testni sustav, baza je izgrađena

tako da sadrži minimalni broj atributa. Korišten je alat Microsoft Sql Server Management

Studio, a baza je pohranjena lokalno, opet zbog lakšeg testiranja. Potrebna je tablica u

kojoj bilježimo podatke o svim korisnicima, a njezini atributi prikazani su u tablici

Korisnik na slici 3.2. Korisnik posjeduje dva jedinstvena identifikatora, idKorisnika kao

primarni ključ te hrEduID kao identifikator koji spaja našu bazu podataka sa AAI@EduHr

bazom. Kako bi znali koja je uloga korisnika koristimo atribut id_uloge i šifrarničku tablicu

TipUloge (postoje uloge učenik ili profesor). Također svaki učenik ima atribut koji bilježi

njegovog nadležnog profesora, a profesori imaju atribut postavljen na null. Virtualna

računala su međusobno jednaka tako da se razlikuju samo u imenu i IP adresi. U

rezervacijama su podaci o tome koji korisnik je rezervirao koje računalo, te točno vrijeme

i datum rezervacije. Identifikator rezervacije automatski se povećava nakon svakog

upisivanja nove rezervacije. Slika 3.2 prikazuje entitete, sve njihove atribute i primarne

ključeve te veze među entitetima koje predstavljaju veze stranog ključa.

17

Slika 3.2 Dijagram baze podataka

3.4 Web servisi

Servisi imaju zadaću predati klijentskoj aplikaciji za autorizaciju sve tražene

podatke, pa je tako svaki servis zadužen za jednu vrstu zahtjeva. Ovdje se nalazi popis

svih servisa čija imena daju naputak o njihovoj zadaći:

GetSelectedReservations – dohvati rezervacije za neki datum

GetStudents – dohvati studente od nekog profesora

RequestReservation – obavi rezervaciju termina

GetProfId – dohvati ID profesora s obzirom na ulogirani hrEduID

MyReservations – dohvati korisnikove rezervacije

GetIP – poveži ID računala sa trenutnom IP adresom

18

Sljedeći primjeri prikazat će implementaciju samo nekih karakterističnih servisa, a

ostali su izrađeni po istom modelu. Slika 3.3 donosi cijeli kod servisa za dohvaćanje

svih rezervacija sa traženim datumom.

Slika 3.3 Dohvaćanje traženih rezervacija

Na početku metode treba pročitati parametre koji su poslani putem metode POST u

tijelu poruke od strane korisnika. Zahtjev (Request) sadrži polje pod nazivom

''trazeniDatum'' u kojemu je zapisan formatirani datum u obliku stringa. Na klijentskoj

i poslužiteljskoj strani koristi se standardna klasa za zapis vremena u C# jeziku –

DateTime, pa s obzirom na to treba podatak pretvoriti u taj format koristeći klasu

Convert. Za upite u bazu koristimo ''using'' blok koji se brine o upravljanju

memorijskim prostorom objekata stvorenih kod inicijalizacije bloka. Stvaramo

varijablu konteksta za bazu podataka ''ctx'' unutar bloka koja nam koristi kao spoj

između baze i modela koje je generirao Entity Framework. Čim završi using blok ta će

se lokalna varijabla ukloniti iz memorije, tako da ne zauzima prostor dulje nego je

potrebno. Upit u bazu (varijabla query) generiramo pomoću LINQ izraza nad

varijablom konteksta i stvaramo listu objekata neodređenog tipa. Taj tip nastao je

mapiranjem atributa iz klase modela Rezervacija u atribute neodređene klase.

Konačno, ta lista pretvara se u format JSON i šalje se kao HTTP odgovor prema klijentu.

Da bi klijent uspješno pročitao ovakav odgovor, vrlo je važno na obje strane

19

implementirati identične modele podataka. Klijent mora znati točan naziv i tip

podataka koji prima kao odgovor, što znači da kod mapiranja atributa moramo

pripaziti da se imena podudaraju sa onima kod klijenta. Poslužitelj i klijent koriste

klasu JavaScriptSerializer kako bi objekte ili liste objekata iz jezika C# serializirali u

format JSON.

Algoritamski najsloženiji dio implementacije je obrada zahtjeva za

rezervacijom. Servis zadužen za ovo mora ispitati postoji li dovoljno slobodnih mjesta,

stvoriti nove rezervacije i vratiti povratnu poruku, a ukoliko nema dovoljno slobodnih

računala obavijestiti korisnika koliko računala je slobodno.

Slika 3.4 Obrada zahtjeva za rezervacijom

Na početku je obavljen klasični dohvat podataka iz zaglavlja poruke te pretvorba istih

u odgovarajući tip kao i u prethodnom primjeru, pa je taj dio koda izostavljen. U petlji

iteriramo po svim rezervacijama koje imaju isti datum kao i rezervacija koju je korisnik

zatražio (Slika 3.4). Nakon toga dohvaćamo vrijeme početka i vrijeme kraja tih

rezervacija koji su tipa TimeSpan. Ovaj tip omogućuje nam zapis vremena u obliku

dana, sati i minuta, a pogodan je zbog toga što klasa TimeSpan nudi metodu Convert

pomoću koje se jednostavno mogu uspoređivati dva vremenska zapisa. Kao pomoćne

varijable imamo listu identifikatora slobodnih računala – ''slobodniPCId'' koja je na

početku puna.

20

Svaka iteracija po petlji provjerava moguća preklapanja, a ako dođe do preklapanja

povećava se brojač i iz liste slobodnih računala uklanja se identifikator zauzetog.

Preklapanja u terminima mogu se ostvariti kao lijevo, desno ili puno preklapanje.

Slika 3.5 Prikaz mogućih preklapanja termina

Preklapanja je najlakše naći usporedbom vremena početka i kraja traženog i zauzetog

termina, kao što prikazuje slika 3.5. Broj slobodnih mjesta dobije se oduzimanjem broja

preklapanja od ukupnog broja računala na poslužitelju, te se šalje klijentu u statusnoj

poruci ako broj preklapanja nadmašuje broj traženih rezervacija. Vrlo je važno voditi

računa o tome kako su vremena početka i kraja zapisana u bazi, a kako su prikazana

korisniku. Kada se neka rezervacija uspješno provede u sustavu, prije upisivanja u bazu

podataka vrijeme kraja se uveća za trideset minuta. To dodatno vrijeme omogućava

poslužitelju da ponovno pokrene virtualni stroj i GamingAnywhere poslužitelj. Kada

korisnik dohvaća svoj termin iz baze podataka, spomenuto vrijeme kraja rezervacije

mora se umanjiti za trideset minuta kako bi korisnik dobio stvarni podatak o tome do

kada mu je virtualni stroj dostupan.

21

4. Klijentska aplikacija za autorizaciju

Klijentska aplikacija sadržava sučelje putem kojeg klijent upravlja rezervacijskim

sustavom i pokreće prijenos video sadržaja. U prvoj fazi izrade oblikovalo se grafičko

sučelje za pristup funkcionalnostima, klijentska validacija podataka i sustav za

autorizaciju. Nakon toga izrađeni su modeli koji olakšavaju prikaz podataka na stranici te

pomoćne klase koje obavljaju logičke zadatke. U zadnjoj fazi povezani su web servisi sa

grafičkim sučeljem i testirana je funkcionalnost na pomno odabranim testnim

slučajevima.

4.1 Korištene tehnologije

4.1.1 MVC arhitektura

Model-pogled-upravljač (engl. Model–View–Controller, MVC) je naziv za

oblikovni obrazac koji opisuje način na koji je realizirana arhitektura sustava [11].

Komponente su organizirane tako da pružaju dinamički razvoj grafičkog sučelja i

pozadinske logike, idealno za web i desktop aplikacije. Model obuhvaća sve podatke i

podatkovne strukture, kao što su na primjer klase generirane iz baze podataka.

Korisnik tijekom korištenja aplikacije dohvaća i mijenja podatke pomoću sučelja

upravljača. Upravljač je komponenta zadužena za povezivanje pogleda i modela,

generiranje pogleda i navigaciju kroz poglede. Pozivi metoda upravljača najčešće su

ostvareni u obliku interaktivnih elemenata, poveznica na akcije ili izbornika. Slika 4.1

prikazuje interakciju komponenata MVC arhitekture gdje je vidljivo da korisnik nikada

direktno ne pristupa modelu, već to čini preko upravljača. Pogled ima zadaću korisniku

prikazati podatke iz modela na razumljiv način te omogućiti formu za unos, brisanje i

mijenjanje postojećih podataka.

22

Slika 4.1 Osnovne komponente MVC arhitekture

4.1.2 HTML + CSS

HTML (engl. HyperText Markup Language) najpoznatiji je i najrašireniji jezik za

izradu web stranica [12]. Nudi mogućnosti stvaranja teksta, multimedije, poveznica na

druge stranice i pisanje skripti koje određuju ponašanje stranice. Osnovni element je

HTML oznaka (engl. tag) pomoću koje web preglednik dobiva informaciju koji tip

sadržaja je unutar oznaka i koja su mu svojstva. Kako bi definirali svojstva sadržaja u

kombinaciji sa HTML kodom koristi se CSS (engl. Cascading Style Sheets). CSS je nastao

zbog potrebe da se odvoji stvaranje HTML elemenata od definicije načina prikaza

elemenata [13]. Najčešće se CSS kod nalazi u posebnoj datoteci, a moguće ga je pisati i

direktno u HTML kodu, što se smatra lošom praksom. Svakoj HTML oznaci može se

definirati klasa i identifikator preko kojih CSS kod zna kojem elementu treba pridijeliti

određena svojstva. Kako svaki programer ne bi ispočetka implementirao neke

standardne elemente, često se koristi gotovi web radni okvir. U ovom radu korišten je

radni okvir Bootstrap [20] koji sadrži gotove HTML i CSS uzorke. Najnovije verzije

Bootstrapa imaju implementirano dinamičko prilagođavanje sadržaja s obzirom na

veličinu zaslona.

23

4.1.3 JavaScript + AJAX + Razor

U razvoju web stranica ponekad je potrebno dinamički izvesti neke radnje

nakon nekog događaja (okidača). U tu svrhu koristimo jezike koji mogu mijenjati HTML

i CSS elemente ili ih generirati po potrebi. S obzirom na mjesto izvođenja takvog koda

postoje klijentski i poslužiteljski jezici. JavaScript je jezik koji se izvodi na klijentskoj

strani, tj. u web pregledniku, obično nakon što se učita HTML dio dokumenta. Glavna

značajka mu je mogućnost pronalaženja HTML elemenata na stranici pomoću

posebnog objektnog modela poznatog kao DOM (engl. Document Object Model). Pomoću

ovog modela svakom HTML elementu možemo odrediti svojstva ili postaviti korisničku akciju,

npr. promjena teksta nakon klika mišem [21]. Kako bi se u kombinaciji s JavaScriptom moglo

asinkrono poslati HTTP zahtjev koristi se AJAX (engl. Asynchronous JavaScript and XML). Ovo

je posebno korisno koristiti kada ne želimo da se web stranica ponovno učitava nakon slanja

zahtjeva. Samo ime AJAX-a govori da je u njemu spojeno više tehnologija – HTML, CSS, DOM,

JSON ili XML, JavaScript i HTTP zahtjevi [14]. S druge strane postoje jezici koji se izvode na

poslužitelju prije nego što se korisniku dostavi konačni rezultat.

U okviru ASP.NET-a moguće je unutar HTML koda izvoditi odsječke jezika C# pomoću

posebne Razor sintakse. Razor se najčešće koristi kako bi se podaci iz podatkovnog modela

prikazali na web stranici stvaranjem novih HTML oznaka. Unutar HTML koda potrebno je na

početak linije staviti znak ''@'' i nakon toga slijedi blok C# naredbi. Konkretno, na slici 4.2

korištena je Razor sintaksa za umetanje redaka tablice i formatiranje zapisa vremena.

Slika 4.2 Primjer korištenja Razor sintakse

24

4.2 Grafičko sučelje

U ovom poglavlju sažeto će se prikazati izrada pogleda (web stranica) koji su jedan

dio MVC arhitekture. Nakon što je određeno koje će sve funkcionalnosti aplikacija imati,

moguće je dizajnirati navigacijsku traku. S lijeve strane nalaze se korisničke opcije koje se

svakom tipu korisnika prikazuju drugačije. Kada se u sustav prijavi učenik, na izborniku

će biti samo opcija za početnu stranicu i pokretanje video prijenosa.

Slika 4.3 Navigacijska traka web aplikacije

Desna strana izbornika služi za prijavu u sustav i zajednička je svim korisnicima. Nakon

uspješne prijave korisnik može vidjeti svoje ime i prezime sa desne strane, a poveznica za

prijavu zamjenjuje se sa poveznicom za odjavu. Slika 4.3 prikazuje navigacijsku traku u

trenutku kada se profesor prijavi u sustav. Na slici je također vidljivo da je u web

pretraživač unesena adresa Home/AfterLogin. To znači da je trenutno odabran upravljač

Home i pozvana njegova akcija AfterLogin. Upravljač Home sadrži akcije za prikaz

jednostavnih statičkih sadržaja, kao što su početna stranica, info stranica itd. Reservations

upravljač ima akcije koje korisnik zove pri baratanju s rezervacijama – pretraga

rezervacija, stvaranje nove, dohvaćanje poveznice za prijenos video i slično. Ovako

definirani par upravljača i akcija zove se ruta. Ruta se može podesiti tako da sadrži još

neke dodatne elemente, na primjer varijablu identifikatora iza imena akcije –

upravljač/akcija/id. Stranica AfterLogin pojavljuje se nakon uspješne prijave te se na njoj

nalazi jednostavan pregled korisničkih opcija. Poveznice na korisničke opcije aktiviraju

istu akciju kao i one na navigacijskoj traci.

25

Slika 4.4 Glavni izbornik nakon autorizacije

Dizajn poveznica je u obliku velikih kartica koje slikom i tekstom korisniku na intuitivan

način sugeriraju o kojoj opciji se radi (Slika 4.4). Vrlo korisno svojstvo pri izradi

elemenata koji su poredani jedan do drugoga paralelno je Bootstrap mreža. Ta mreža

podijeljena je u dvanaest jednakih cjelina, a može se odrediti koliko će cjelina zauzimati

pojedini element.

Slika 4.5 Dizajn jedne kartice glavnog izbornika

Na slici 4.5 prikazan je HTML kod prve kartice koja nas vodi na stranicu za rezervacije.

Bootstrap klasa ''col-md-4'' označava da sadržaj unutar oznake <div> zauzima četiri od

mogućih dvanaest prostornih jedinica. Poveznice su ostvarene putem dugmeta (class

''gumb'') koji imaju posebne CSS stilove za animaciju.

26

Na stranici za rezervacije korisniku se mora omogućiti pretraga svih rezervacija po

datumu kako bi mogao lakše pronaći prikladan termin. Nakon odabira za pretragu, sve

rezervacije za taj dan prikazuju se u tablici u donjem dijelu ekrana.

Slika 4.6 Stranica za rezervaciju i pregled termina

Podaci koje je korisnik unio moraju zadovoljavati neke uvjete, na primjer vremena

početka i kraja ne smiju biti jednaka. Za provjeru takvih pogrešaka bez ponovnog

učitavanja stranice brine se JavaScript. Korisniku se na zaslonu prikaže odgovarajuća

poruka i znak upozorenja što je na konkretnom primjeru prikazano slikom 4.6. U nekim

slučajevima potrebno je validaciju podataka obaviti i na poslužitelju i na klijentskoj strani.

Takav primjer je stranica za prikaz svih rezervacija nekog korisnika pri čemu svaka

rezervacija ima poveznicu za aktivaciju video prijenosa.

Slika 4.7 Lista svih rezervacija prijavljenog korisnika

27

Provjera dostupnosti rezervacije najprije se provjerava kod klijenta pomoću posebne

zastavice. Poslužitelj će klijentu poslati listu rezervacija i zastavicu koja označava

dostupnost. Zadaća klijentske aplikacije je da onemogući aktivaciju poveznice ako termin

nije slobodan i pritom ispiše poruku korisniku. Poveznice koje nisu aktivne obojene su

sivo pomoću JavaScripta, a one aktivne zeleno (Slika 4.7). Ako neka rezervacija postane

nedostupna dok korisnik pregledava stranicu, poveznica neće promijeniti boju dok god se

stranica ne osvježi. Upravo zbog toga potrebno je obaviti dodatnu provjeru na poslužitelju

kada korisnik pritisne poveznicu.

Slika 4.8 AJAX poziv za provjeru dostupnosti termina

Provjera se obavlja preko AJAX poziva koji je prikazan na slici 4.8. Identifikator

rezervacije šalje se HTTP zahtjevom poslužitelju koji akcijom DohvatiIP provjerava

dostupnost u stvarnom vremenu. Tek ako rezervacija prođe ovu provjeru korisniku se

omogućava pristup video prijenosu. Povratni parametar HTTP zahtjeva je IP adresa

virtualnog stroja koja se zatim prosljeđuje GamingAnywhere protokolu. Svaka HTML

oznaka za pokretanje GamingAnywhere klijenta ima u svojstvu ''name'' zapisan

identifikator rezervacije koji joj je predan iz modela. U JavaScriptu je postavljena funkcija

koja čeka na klik elementa klase button. Nakon što je funkcija aktivirana moguće je

pročitati sadržaj atributa ''name'' elementa koji je pritisnut. Statusne poruke generirane

su naredbom alert koja kao parametar prima tekst poruke i ispisuje ju na zaslonu u obliku

skočnog prozora.

28

4.3 Integracija AAI@EduHr autorizacije

Poslužiteljsko računalo na kojem se nalazi web aplikacija mora imati postavljen

certifikat. Certifikat omogućava aplikaciji jedinstveni potpis u zaglavljima poruka i

prepoznavanje od strane AAI@EduHr sustava. Generiranje certifikata većinom je

automatizirano, od korisnika se samo traži da upiše mrežno ime svoje aplikacije. Sigurnu

mrežnu komunikaciju osigurava programska biblioteka OpenSSL. To je biblioteka

napisana u jeziku C i sadrži implementaciju sigurnosnih protokola i algoritama kriptiranja

[15]. Davatelj usluge (AAI@EduHr) i klijentska aplikacija imaju zajednički autorizacijski

standard, u ovom slučaju to je SAML 2.0 (engl. Security Assertion Markup Language). SAML

definira format slanja autorizacijskih podataka između dvije strane, a bazira se na XML

zapisu [16]. Programski alat OIOSAML.NET omogućava nam korištenje SAML protokola u

.NET web aplikacijama. Za korištenje tog alata dovoljno je u projektu web aplikacije dodati

reference na vanjske biblioteke OIOSAML-a te podesiti konfiguracijsku datoteku

aplikacije. Konfiguracijska datoteka također sadrži web adresu na koju se korisnik

preusmjerava prilikom prijave, mrežno ime aplikacije, vrstu certifikata i slično.

U programskom kodu možemo pratiti koji korisnik se prijavio i dohvatiti njegova svojstva.

Svi podaci o trenutnom korisniku pohranjeni su u atributu ''Saml20Identity.Current'', a

ukoliko korisnik nije prijavljen vrijednost atributa je prazna (null).

Slika 4.9 Dohvaćanje svojstava prijavljenog korisnika

Na ovaj način može se prije izvođenja neke akcije provjeriti je li korisnik prijavljen u

sustav i po potrebi ga preusmjeriti na stanicu za prijavu (Slika 4.9 prvi redak). Svojstva

korisnika pohranjena su u obliku rječnika, što znači da svako svojstvo ima svoj jedinstveni

ključ (Slika 20 drugi redak). Ova svojstva OIOSAML biblioteka dohvaća direktno s testnog

LDAP imenika gdje je korisnik upisan.

29

Slika 4.10 Pregled najvažnijih korisničkih svojstava u LDAP imeniku

Sva dostupna svojstva mogu se pregledati na administratorskoj stranici imenika, a na slici

4.10 prikazana su najznačajnija svojstva. U zagradama pored imena svojstva nalazi se

vrijednost ključa koju koristimo u OIOSAML biblioteci. Kao jedinstveni identifikator

korisnika koristi se hrEduPersonUniqueID te se on podudara s korisničkom oznakom u

bazi podataka web aplikacije. Za ispisivanje trenutno prijavljenog korisnika u desnom

dijelu navigacijske trake koristi se svojstvo Ime i prezime (cn). Korisnici imaju definiranu

povezanost s ustanovom preko svojstva hrEduPersonPrimaryAffilation. Dohvaćanjem

ovog svojstva u web aplikaciji možemo provjeriti je li korisnik djelatnik ili učenik te na

temelju toga prikazati odgovarajuće grafičko sučelje. Ova provjera dodatno se vrši prije

svake akcije kojoj samo djelatnici imaju pristup, tako da tim akcijama nije moguće

pristupiti niti ručnim unošenjem rute u web preglednik.

4.4 Instalacija GamingAnywhere klijenta

Kako bi se uspješno spojio na virtualni stroj, klijent mora pokrenuti

GamingAnywhere aplikaciju. Ona se jednostavno pokreće izvršavanjem naredbe u

komandnoj liniji, a parametri su IP adresa poslužitelja i putanja do konfiguracijske

datoteke. Korisniku treba omogućiti da jednim klikom pokrene video prijenos pa je

zbog toga naredba komandne linije ukomponirana u izvršnu datoteku. Zadaća izvršne

datoteke je da primi jedan parametar –IP adresu, postavi putanju do standardne

30

konfiguracijske datoteke i pokrene naredbu u komandnoj liniji. Konfiguracijska

datoteka je pohranjena na klijentskom računalu te se može ručno modificirati prema

potrebi.

Slika 4.11 Aplikacija za automatsko pokretanje komandne linije

Odsječak koda na slici 4.11 pomoću klase Process pokreće novu instancu komandne linije.

Koristeći svojstvo ProcessWindowStyle.Hidden komandna linija je sakrivena od korisnika.

Nakon toga stvaraju se dvije slijedne naredbe, jedna za pozicioniranje do direktorija sa

klijentskom aplikacijom i druga za pokretanje aplikacije.

Prvi preduvjet za uspješno korištenje aplikacije je posjedovanje svih

GamingAnywhere datoteka i izvršne datoteke na klijentskom računalu. Drugi preduvjet

je registrirani URL protokol u Windows registru. Web pretraživač će prilikom poziva ovog

protokola provjeriti u registru ima li koji program registriran na to ime. Ukoliko ima,

pokrenut će program na klijentskom računalu bez dodatnih sigurnosnih upozorenja. Da

bi se korisniku olakšalo ostvarivanje ova dva preduvjeta izrađena je kratka instalacijska

skripta. Nakon što skripta registrira protokol slijedi kopiranje GamingAnywhere datoteka

u direktorij ''C:\Program Files\GamingAnywhere''. Pošto skripta zahtjeva pisanje po

Windows registru mora je pokrenuti administrator.

31

Slika 4.12 Upute za instalaciju

Sve potrebne datoteke spremljene su u zip arhivu i mogu se preuzeti sa info stranice uz

jasne upute (Slika 4.12). Instalacija traje svega nekoliko sekundi i može se u slučaju

gubitka nekih datoteka ponovno pokrenuti. Nakon završetka instalacije korisnik može

trenutno koristiti poveznice za spajanje s virtualnim računalom.

32

Zaključak

Računarstvo u oblaku još uvijek je prilično novi pojam. Infrastruktura za

pokretanje igara preko računalnog oblaka postoji i više puta je uspješno realizirana.

Instalacija ovakvog sustava veliki je pothvat koji zahtjeva detaljno planiranje i pokrivanje

svih mogućih rubnih slučajeva. Kvaliteta usluge određena je kvalitetom mrežne

infrastrukture, što znači da je brzina prijenosa podataka proporcionalna kvaliteti video

zapisa. Još jedan važan faktor je udaljenost glavnog poslužitelja i korisnika, budući da

velika udaljenost donosi veća kašnjenja. Malo kašnjenje najvažniji je uvjet da bi se

računalna igra mogla normalno koristiti. Najpogodnija mjesta za instalaciju usluge su

ustanove s dobro provedenim mrežnim planom, na primjer obrazovne ustanove. Unutar

takvog zatvorenog sustava brzine su velike i stabilne, a kašnjenje izuzetno malo.

Osnovna ideja rada je da se učenicima unutar škole pruži usluga pokretanja

računalnih igara u računalnom oblaku. Dobro izveden sustav nudio bi odabir igara razne

tematike i igranje na bilo kojem računalu ili mobilnoj platformi. Rezervacija i pokretanje

obavljaju se preko web aplikacije, a za korištenje video prijenosa potrebna je samo

kratka instalacija desktop aplikacije. Daljnja poboljšanja moguća su u vidu proširenog

korisničkog sučelja, tako da se na primjer korisniku nudi podešavanje postavki video

prijenosa.

33

LITERATURA

[1] Crazy Machines 3, Steam Simulation Games,

http://store.steampowered.com/app/351920/Crazy_Machines_3, 1.6.2017. [2] Orgulan R. Aplikacija za rezervaciju i raspoređivanje virtualiziranih usluga u

računalnom oblaku. Završni rad. Fakultet elektrotehnike i računarstva (2017) [3] Orgulan R. Šipušić T. et al. Razvoj i testiranje platforme zasnovane na cloud

gaming konceptu sa potencijalnom primjenom u školama. Projektna dokumentacija. Fakultet elektrotehnike i računarstva (2016)

[4] XenCenter, XenCenter Development,

https://xenserver.org/partners/developing-products-for-xenserver/21-xencenter-development/88-xc-dev-home.html, 1.6.2017.

[5] XenServer, XenServer features,

https://xenserver.org/overview-xenserver-open-source-virtualization/open-source-virtualization-features.html, 1.6.2017.

[6] GamingAnywhere, Overview, http://gaminganywhere.org/index.html,

1.6.2017 [7] AAI@EduHr, Općenito o sustavu AAI@EduHr,

http://www.aaiedu.hr/o-sustavu/sto-je-aaieduhr, 22.5.2017. [8] Wikipedia, .NET Framework,

https://en.wikipedia.org/wiki/.NET_Framework, 24.5.2017. [9] Microsoft Developer Network Library, Introduction to Entity Framework,

https://msdn.microsoft.com/en-us/library/aa937723(v=vs.113).aspx, 24.5.2017.

[10] Wikipedia, Hypertext Transfer Protocol, https://en.wikipedia.org/wiki/Hypertext_Transfer_Protocol, 24.5.2017. [11] Microsoft Developer Network, ASP.NET MVC 5, https://msdn.microsoft.com/en-us/library/mt227393(v=vs.108).aspx,

25.5.2017. [12] Wikipedia, HTML, https://en.wikipedia.org/wiki/HTML, 25.5.2017. [13] Wikipedia, CSS, https://hr.wikipedia.org/wiki/CSS, 25.5.2017.

34

[14] W3Schools, AJAX Introductionn, https://www.w3schools.com/xml/ajax_intro.asp, 28.5.2017.

[15] Wikipedia, OpenSSL, https://en.wikipedia.org/wiki/OpenSSL, 28.5.2017. [16] Onelogin Developers, Dev overview of SAML,

https://developers.onelogin.com/saml, 30.5.2017. [17] Hassan, Qusay (2011). "Demystifying Cloud Computing", The Journal of

Defense Software Engineering. CrossTalk [18] Microsoft Azure, Azure Products, https://azure.microsoft.com/en-us/services 6.6.2017. [19] Stanford News, Playing to learn,

http://news.stanford.edu/2013/03/01/games-education-tool-030113, 6.6.2017.

[20] Wikipedia, Bootstrap, https://en.wikipedia.org/wiki/Bootstrap_(front-

end_framework), 6.6.2017. [21] Wikipedia, Document object model,

https://en.wikipedia.org/wiki/Document_Object_Model, 6.6.2017.

35

Sažetak

Klijentska aplikacija za korisničku autorizaciju i pristup

usluzi igara zasnovanih na računalnom oblaku

Računarstvo u oblaku novi je oblik računalne arhitekture koji pokušava

podijeliti resurse između poslužitelja i krajnjih korisnika. Glavna ideja je da se

korisniku omogući obavljanje zadataka izvan mogućnosti njegove trenutne

konfiguracije. Posebni model ovakve arhitekture su igre zasnovane na računalnom

oblaku. Poslužitelj ima unaprijed instalirane igre i virtualizacijske resurse na kojima se

igre pokreću. Korisnik dobiva video prijenos i šalje kontrole prema poslužitelju, dok se

igra izvodi na nekom od virtualnih računala u oblaku.

Zadatak ovog rada bio je izraditi aplikaciju preko koje se vrši autorizacija

korisnika i rezervacija virtualnih računala. Sustav je prilagođen obrazovnim

ustanovama gdje bi profesori mogli rezervirati termine svojim učenicima. Aplikacija se

sastoji od web aplikacijskog sučelja koje upravlja sustavom rezervacija i grafičkog

sučelja koje korisnicima nudi jednostavnu rezervaciju kao i upute za korištenje usluge.

Ključne riječi: računalni oblak, igranje u oblaku, edukativne igre, web aplikacija,

autorizacija, sustav rezervacije

36

Summary

A Client Application for User Authorization and Access to Cloud Gaming Services

Cloud computing is a new kind of computing architecture that tries to share

computing resources between users and the central server. The main idea is to enable

users to perform tasks that are too complex for their current configuration. One type

of service in this computing model is called ''cloud gaming''. The cloud consists of pre-

installed games and virtualization resources that are used to run the games. Users send

game commands to virtual machine where the game is running, and in return recieve

a real time video stream of the game.

In this bachelor's thesis, a web application for user authorization and

reservation was developed and tested. The application is customized for educational

institutions where teachers can easily book virtual machines for their students. It

consists of a web application interface that enables authorization and manages a cloud-

based resource reservation system, and a graphical interface that enables easy

reservation and contains simple instructions for installation.

Keywords: cloud computing, cloud gaming, educational games, web application,

authorization, reservation system

37

Popis slika

Slika 1.1 Shema računalnog oblaka ................................................................................................... 3

Slika 1.2 Pokretanje igara preko računalnog oblaka .................................................................. 4

Slika 1.3 Prikaz igre Crazy Machines 3 (Slika preuzeta s [1]) ................................................. 5

Slika 2.1 Arhitektura sustava ............................................................................................................... 6

Slika 2.2 Prikaz slojeva aplikacije ....................................................................................................... 8

Slika 2.3 Sučelje programa XenCenter .............................................................................................. 9

Slika 2.4 Video prijenos i klijentska konzola usluge GamingAnywhere ........................... 11

Slika 3.1 Dijagram obrazaca uporabe implementirane usluge ............................................ 14

Slika 3.2 Dijagram baze podataka ................................................................................................... 17

Slika 3.3 Dohvaćanje traženih rezervacija ................................................................................... 18

Slika 3.4 Obrada zahtjeva za rezervacijom .................................................................................. 19

Slika 3.5 Prikaz mogućih preklapanja termina .......................................................................... 20

Slika 4.1 Osnovne komponente MVC arhitekture ..................................................................... 22

Slika 4.2 Primjer korištenja Razor sintakse ................................................................................. 23

Slika 4.3 Navigacijska traka web aplikacije ................................................................................. 24

Slika 4.4 Glavni izbornik nakon autorizacije ............................................................................... 25

Slika 4.5 Dizajn jedne kartice glavnog izbornika ....................................................................... 25

Slika 4.6 Stranica za rezervaciju i pregled termina .................................................................. 26

Slika 4.7 Lista svih rezervacija prijavljenog korisnika ............................................................ 26

Slika 4.8 AJAX poziv za provjeru dostupnosti termina ........................................................... 27

Slika 4.9 Dohvaćanje svojstava prijavljenog korisnika ........................................................... 28

Slika 4.10 Pregled najvažnijih korisničkih svojstava u LDAP imeniku ............................. 29

Slika 4.11 Aplikacija za automatsko pokretanje komandne linije ...................................... 30

Slika 4.12 Upute za instalaciju .......................................................................................................... 31

38

Privitak

Upute za instalaciju klijentske aplikacije za autorizaciju

Ovaj privitak sadrži upute za instalaciju klijentske aplikacije i integraciju

aplikacije sa GamingAnywhere servisom. Svi postupci podrazumijevaju korištenje

operacijskog sustava Windows.

Klijentska aplikacija priložena je u obliku dva Visual Studio projekta. Prvi

projekt pod imenom ''ProbnaBaza'' sadrži aplikacijsko sučelje za rezervaciju termina i

dohvaćanje korisnika. Drugi projekt naziva ''KlijentskaApp'' sadrži grafičko sučelje

web aplikacije putem kojeg se vrši autorizacija. Tamo se nalaze sve ispravno podešene

konfiguracijske datoteke koje omogućavaju spajanje na AAI@EduHr uslugu

autorizacije. Baza podataka priložena je u obliku datoteke ''TestDatabase.mdf''.

Priložene projekte potrebno je objaviti na nekom web poslužitelju.

Poslužitelj na kojem su objavljena klijentska aplikacija mora imati instaliran

certifikat za korištenje AAI@EduHr autorizacije. Detaljni koraci o instalaciji certifikata

dostupni su ovdje:

http://www.aaiedu.hr/za-davatelje-usluga/za-web-aplikacije/implementacija-

autentikacije-putem-sustava-aaieduhr-u-net-web

Svako korisničko računalo koje želi koristiti uslugu GamingAnywhere mora

pokrenuti skriptu koja će obaviti kratku instalaciju. Skripta pod nazivom

''RegistracijaAplikacije'' nalazi se u direktoriju ''instalacija'' i potrebno ju je pokrenuti

s administratorskim pravima. Isti ovakav instalacijski paket moguće je preuzeti i sa

web aplikacije na info stranici. Nakon ovog koraka klijent može preko poveznice u

aplikaciji pokrenuti video prijenos.