2012
Rezervační systém Tvorba WWW stránek Vytvoření rezervačního systému pro hosting a pronájem herních serverů
Radek Fryšták Gmrhosting.cz 28.12.2012
Fakulta elektrotechniky a informatiky Návrh a tvorba WWW stánek a databázové systémy 2
Obsah 1.Základní charakteristika ....................................................................................3 2.Architektura aplikace ........................................................................................5 3.Funkčnost ..........................................................................................................7 4.Popis tříd systému .............................................................................................8 5.Ukázky zdrojového kódu ..................................................................................10 6.Diagramy .........................................................................................................12 a) Rich Picture .............................................................................................12 b) Aktivity diagram .....................................................................................13 c)Use case diagram ....................................................................................14 d)Diagram Tříd ...........................................................................................15 e) Adresářová struktura..............................................................................16
Vypracoval: Radek Fryšták 2012/2013
Stránka 2
Fakulta elektrotechniky a informatiky Návrh a tvorba WWW stánek a databázové systémy 2
1.Základní charakteristika Téma této smíšené semestrální práce pro předmět IDAS2 a IWWW je zaměřený na pronajímání dedikovaných herních serverů a s tím spojený webhosting. Hosting nabízí seznam předních herních titulů které si může uživatel pronajmout, pokud sám nemá prostředky nebo veřejnou IP adresu s dostatečnou konektivitou, ale přesto chce mít založený vlastní privátní nebo veřejný herní server pro své přátele s vlastní konfigurací pod svou kontrolou. Při objednávce může uživatel vybrat více her s různým počtem slotů a různou délkou pronájmu. Objednávku uživatel může dokončit jedině jako regulérně registrovaný uživatel s vyplněnými údaji které jsou nutné pro eventuální komunikaci administrátorů s klientem a fakturaci. V posledním kroku pak ještě bude mít uživatel možnost zvolit jestli chce pouze game hosting nebo bude chtít také provozovat i webhosting. Po zaplacení dostane k dispozici uživatelský panel s možností svoje servery spustit, restartovat, zastavit, nakonfigurovat nebo sledovat logy. Uživatelé mají v rámci své uživatelské administrace oprávnění: guest: obyčejný návštěvník webu který si jen prohlíží stránky registrovaný: registroval se a má oprávnění dokončit objednávku her moderátor webu: registrovaný po objednávce web, nebo editor existujícího webu správce her: registrovaný po objednávce her, bez webu moderátor + správce: registrovaný po objednávce her a webu, editaci webu může delegovat
Vypracoval: Radek Fryšták 2012/2013
Stránka 3
Fakulta elektrotechniky a informatiky Návrh a tvorba WWW stánek a databázové systémy 2
Aplikace je ještě stále ve vývoji protože celá sama o sobě bude spravovat jak stránky který uvidí každý návštěvník tak i její backgroud, tj správa stroje, her a systému. Databáze je použita jak jinak než open-source MySQL, v budoucnu pokud korporace Oracle začne příliš šlapat na vývojáře tak MariaDB což je zatím binárně kompatibilní open-source klon. Aplikace se od svého původního návrhu který začínal na 20 tabulkách rozrostl na aktuálních téměř 50 tabulek. Strategie mazání záznamů z tabulek databáze je řešena pomocí nastavování data a času do sloupce smazano, sql dotazy si pak počítají s tím že platné záznamy mají sloupec smazano NULL. Neplatné udaje které expirují po nastavené době, budou automaticky smazány pomocí metod k tomu určených, při volání Cronu. Stránky jsou momentálně optimalizovány pro FF a Chrome, celý layout využívá css framework bootstrap. Celá webová aplikace vyžaduje k běhu PHP 5.3.x, zásuvné moduly jako třeba: PDO, gettext, image magick. Celý systém je vytvořený nad linuxovým apache2 a PHP5 a některé části vysloveně počítají s linuxovým systémem. Celá aplikace je postavena nad frameworkem, který je klonem např: známého Nette, šablonovacího systému RainTpl, pro systém jsem se inspiroval ze zmíněných systémů, některé třídy byly buď implementovány přímo a nebo úplně přepsané v podobném duchu s elementárně rozdílnou logikou. Rozdíly jsou například proti čistému nette v rychlosti aplikace dosti znatelné, uvedu příklad: stránky srovnatelné velikosti na jednom stroji v nette zabraly téměř 1s generování, tak v tomto systému byla doba v rozmezí 100~200ms, tím neříkám tak či onak, stejně každý z těchto systémů ve finále používá komplexní cachování, které aplikace urychlí ještě více.
Vypracoval: Radek Fryšták 2012/2013
Stránka 4
Fakulta elektrotechniky a informatiky Návrh a tvorba WWW stánek a databázové systémy 2
2.Architektura aplikace Tento systém stránek je postavený na systému který je již asi 3. v pořadí php systém. První verze systému byla určitá variace systému wordpress, kde se celý systém skládal z modulů a každý web takto vytvořený měl určitou základní sadu modulů a moduly obsluhující unikátní sekce ve stránkách, tento systém měl roztříštěný a značně primitivní databázový model, kde většina modulů využívala pouze databáze SQLite2, které s upgradem na PHP 5.3 přestaly fungovat. Tento systém, ale měl své hranice a při složitějších webech se už musely některé bázové moduly dostatečně upravovat protože nebyli schopni vyhovět požadavkům zákazníka na konkrétní funkčnost. Další verze začínala v podstatě na zelené louce, dalo by se říct, kde již byla snaha dělat samostatně menší jednotky (třídy), s použitím autoloadingu a principem jedné třídy na jednu stránku, s tím že se url adresa stránky zanášela do samotné třídy. Tento systém se ani nedočkal tak potřebného databázového konektoru, poslední verze systému uměly ukládat maximálně do XML souboru nebo JSON souboru. Aktuální verze systému jak již bylo naznačeno je do jisté míry inspirovaná frameworkem Nette pro bázové třídy, některé třídy byli přebrány, ale budou do budoucna přepsány, Nette používá vlastní šablonový systém, tento systém taky používá šablonový systém založený RainTpl. Ať se již jedná o Nette nebo RainTpl žádný kód není převzat 1:1, a pokud ani tak bude v nejbližší době přepsán. Výjimkou jsou snad jen některé postupy, jména tříd a konfigurační třída načítající neon syntax. V systému je v konfiguracích a zkompilovaných souborech používán Heredoc. Celý systém je založen na OOP PHP5.3.x a databázový konektor optimálně potřebuje PHP 5.3.6. Filozofií celého systému je to, že každá z tříd systému má svoji úlohu plnit dobře a při nejlepším s co nejméně závislostmi na ostatních třídách. Systém se sám stará o načítání potřebných tříd pomocí systému autloading, jediní include který je ve stránkách je ten který načítá třídu Loading které je registrovaná pomocí SPL jako autoloading method.
Vypracoval: Radek Fryšták 2012/2013
Stránka 5
Fakulta elektrotechniky a informatiky Návrh a tvorba WWW stánek a databázové systémy 2
Princip skládání webu v tomto systému začíná vytvořením instance třídy MainClass v indexu, která dědí od bázové třídy BaseMainClass která se stará o ukládání hodnot do vnitřního pole a přístup k nim, z této instance se se pak volá inicializační metoda ve které se načítá konfigurace, nastavuje časovou zónu, vytváří instanci konektoru do databáze, skládá instance Session, UserStorage, která vstupuje do třídy uživatele User, dále se nastavuje ACL oprávnění z třídy Permission. Poté se vytváří instance třídy Tpl které se stará o obsluhu template systému. Nakonec se v inicializační metodě ještě připravuje globální tvar formuláře, který si pak jednotlivé trídy stránek rozšiřují o vlastní elementy a podmínky. Poté co skončí inicializace vrací se kód zpět do indexu kde se vytváří instance Cache, která se následně stará a cachování hlavních částí stránek, kde se buďto stránka načítá z cache souboru nebo se renderuje ze třídy HtmlPage a template. Stránky samotných sekcí se vkládají přes StaticWeb a HtmlPage do template, kde se do indexu vkládá jednotný obsah html body a do toho se pak vkládá obsah stránek přednačtený ze tříd samotných sekcí, tím je zaručeno že se záhlaví a zápatí dokumentu nebude nikde opakovat. Samotné třídy jsou navíc psány proti php Unit testům, případně se na třídy testy dodatečně píšou, tím je zaručena integrita systému pokud se budou bázové třídy postupem času nějak měnit, takže pokud by provedené změny narušily stávající funkčnost tak se na eventuální problém lze dojít už na úrovni testu a ne až na úrovni stránek kde by takový problém mohl mít fatální následky.
Vypracoval: Radek Fryšták 2012/2013
Stránka 6
Fakulta elektrotechniky a informatiky Návrh a tvorba WWW stánek a databázové systémy 2
3.Funkčnost Aktuální funkčnost webu je taková aby splňovala zhruba zadání semestrální práce do předmětu IWWW. Na stránkách je dvojí přihlašování. První je pro administrátory a neplatí zde žádné práva, všichni administrátoři vidí vše. Druhé přihlašování je pro registrované uživatele, kde se už práva rozlišují na registrované, moderátory webu, správce her, nebo moderátor a správce v jedné osobě. Jelikož tento projekt je velice obsáhlý tak jsou určité části zjednodušené nebo vypuštěné. Databáze a systém je připravený na to že při registraci uživateli přijde potvrzovací email a nebo systém resetování hesla pokud naopak uživatel heslo ztratí, aktuálně tam tato funkčnost není protože projekt jako celek je časově dost náročný a ještě několik měsíců bude jen trvat než ho s realizačním týmem dokončím do podoby kdy si budou moc uživatelé plnohodnotně a pohodlně zaregistrovat a objednat hru včetně všech náležitostí. Když už je uživatel registrovaný může se v této verzi rovnou přihlásit a může si měnit své osobní údaje. Podle práv, které se dají prozatím měnit jen manuálně z administrace, se zobrazuje část stránek která je určena pro moderátora webu, správce nebo moderátora a správce. Využití wysiwyg editoru TinyMCE je pak možné najít v sekci administrace novinky, které se zobrazují na úvodní stránce a jdou následně pak rozklepnout na konkrétní novinku nebo na výpis všech novinek, ikona u novinek se přiděluje dle ID administrátora který ji přidal. Jak jsem již zmínil údaje uživatele jsou změnit z administrace, ale nejde změnit heslo, avatar a firemní údaje. Poslední sekcí je zde sekce nabídka her, což je nabídka her které budeme schopni hostovat, aktuální koncepce ještě není zdaleka úplně domyšlená protože hodně prvků se vymýšlí a ladí za pochodu. Jelikož nabídka nemusí být řazená podle abecedy je zde aplikovaný z jQuery dragable a sortable a ajaxový post pro ukládání pořadí do databáze. Vypracoval: Radek Fryšták 2012/2013
Stránka 7
Fakulta elektrotechniky a informatiky Návrh a tvorba WWW stánek a databázové systémy 2
Celá administrace je uspořádaná do několika sekcí které se budou v administraci nalézat, prozatím je zde jen funkční web admin, ale přibude server admin na fyzickou správu stroje, faktury jako fakturační systém pro výkaz výdělku kvůli úřadům , případné statistiky ať už serveru nebo hostovaných serverů a v neposlední řadě přechod na stránky webu bez odhlášení a logout pro odhlášení z administrace.
4.Popis tříd systému Jak již bylo zmíněno systém se skládá z většího počtu tříd, takže jen stručně popíši co dělají a jaké mají případně závislosti. Popíši zde jen třídy použité v aktuálním projektu protože tříd samotného jádra tohoto systému je víc, ale né všechny jsou zde použity. BaseMainClass: bázová třída pro zakládání třídy tupu MainClass Cache: třída obsluhující cachování části stránek, závisí na Route, urychluje celý systém Configurator: je převzatá a upravená třída na parsování Neon konfigurací Core: je abstraktní třída se statickými metodami, které jsou obecně potřebné ve většině tříd DateAndTime: upravený klon třídy DateTime z nette, je rozšiřující třída pro metody s datem a časem Debugger: je hlavně vývojová knihovna pro měření časové náročnosti webových stránek Form: je sada tříd starajících se o renderování a vyhodnocování podmínek formulářů, s výchozím renderovacím jádře založeným na třídě Html Html: je nejvyužívanější třída pro generování html kódu který je zapsán na úrovni php pomocí flow interface HtmlPage: třída využívající třídu Html pro renderování základní validní html kostry stránek do kterých se pak vloží samostatně přichystaný obsah, title a jiné prvky IAuthenticator: je rozhraní pro třídu authenticatoru která validuje uživatele při vstupu do administrace, předepisuje jednu základní metodu Vypracoval: Radek Fryšták 2012/2013
Stránka 8
Fakulta elektrotechniky a informatiky Návrh a tvorba WWW stánek a databázové systémy 2
IPage: je rozhraní pro třídy stránek a předepisuje jim 2 základní metody PDOHelper: je sada tříd starajících se o připojení do databáze pomocí jednotné php třídy PDO, struktura třídy vychází z tříd Androidu starajících se o připojení k SQLite dazabázi Response: je třída taktéž inspirované nette, zpracovává hlavičky a cookie Route: je routovací třída, která vlastně obchází rewrite pravidla na úrovni Apache, takže pak pro rewrite stačí naprosto jednoduché pravidlo Session: třída pro zpracování session a session section nejen pro User StaticWeb: třída starající se o skládání menu a obsahu stránek, využívá Route Tpl: třída zajišťující překlad template šablon do php kódu a jeho následnou interpretaci User: je sada tříd starající se o přihlášení, odhlášení uživatele, obsahuje ještě Identity a ACL Permission UserStorage: je třída využívající Session pro ukládání dat a expirací dat nad session, třída je inspirována nette
Vypracoval: Radek Fryšták 2012/2013
Stránka 9
Fakulta elektrotechniky a informatiky Návrh a tvorba WWW stánek a databázové systémy 2
5.Ukázky zdrojového kódu Zde jsou útržky zdrojového kódu významnějších částí aplikace. MainClass (obsluha připojení databáze): // obsluha databaze $handle = new DBHandler($db_conf['name']);
// vytvoreni db handleru
$_driver = $db_conf['driver']; //nacteni driveru, pak jeho volani a predani konfigurace pole $handle->$_driver($db_conf[$_driver]);
// univerzalni konektor databaze
//samotne pripojeni k databazi $db = $handle->getDatabase($db_conf['autoinstall']); //autoinstall je defaultni false $this['handle'] = $handle;
// predani halndleru tride MainClass
$this['db'] = $db; // predani databazoveho objektu tride MainClass Zpracování php metody volané z ajaxu: // data prochazejici celym kodem $mainClass = new MainClass; // inicializace webu $mainClass->initialization();
$_class = str_replace('/', '\\', $_POST['class']); // nacteni a uprava adresy tridy pro namespace if (method_exists($_class, $_POST['method'])) { echo $_class::$_POST['method']($mainClass, $_POST); // zavolani samotne metody z tridy } else { Vypracoval: Radek Fryšták 2012/2013
Stránka 10
Fakulta elektrotechniky a informatiky Návrh a tvorba WWW stánek a databázové systémy 2
throw new Exception('neplatné volání metody!!'); } Předání dat do template $user_login = $mainClass->user->getIdentity()->getData('login'); identity uzivatele
//nacteni
$user_assign = array( 'index_user_isloggedin' => $mainClass->user->isLoggedIn(true), //je login? 'index_user_login' => $user_login,
//login jmenu uzivatele
'index_user_link' => 'user/'.$user_login, //link pro profil uzivatele 'index_user_logout' => 'user/'.$user_login.'/logout',
//logout
link ); // predani promennych do template $mainClass->tpl->assign($mainClass->toArray()); // predani z mainClass $assign = array( 'index_menu' => $sweb->getMenu($menuskel), ze StaticWeb
//nacteni menu
'index_content' => $sweb->getContent($mainClass), //nacteni obsahu ze StativWeb 'index_novinky_link' => 'novinky/', //link pro presmerovani na novinky 'index_novinky_vypis' => $mainClass->getNovinky(), //vypis novinek na uvodni strance ); $mainClass->tpl->assign($user_assign)->assign($assign); // predani menu a kontextu Vypracoval: Radek Fryšták 2012/2013
Stránka 11
Fakulta elektrotechniky a informatiky Návrh a tvorba WWW stánek a databázové systémy 2
6.Diagramy a) Rich Picture
Zde je rich picture který zhruba znázorňuje majitele (admini), kteří obsluhují a platí provoz serveru, který si můžou hráči (uživatelé) pronajmout na určitou dobu. Administrátoři obsluhují server přes webové rozhraní které ovládá většinu funkcí na serverové stroji, který je někde na internetu. Výdělek je přerozdělován z výdělků, za pronájem, a příspěvků na samotný provoz serveru a jako finanční odměna majitelům. Pro popularizaci se bude provádět propagace na sociálních sítích, jako Steam komunita, Twitter a Facebook, na kterých je velký výskyt potencionálních hráčů (uživatelů), kteří by chtěly spravovat vlastní dedicate server na který ale nemají znalosti, prostředky nebo zázemí.
Vypracoval: Radek Fryšták 2012/2013
Stránka 12
Fakulta elektrotechniky a informatiky Návrh a tvorba WWW stánek a databázové systémy 2
b) Aktivity diagram
Ukázka diagramu registrace uživatele, funkce je taková že uživatel vyplní své udaje a odešle je na server ke zpracování, pokud jsou údaje validní, tj vyplněnost, formát pokud není validace 100% tak systém vrátí uživateli chybový výpis, kde předvyplní formulář odeslanými daty, po opravě údajů a znovu zaslání a po úspěšné validaci proběhne převod do php objektu ContentValue, který se pak vkládá do metody Insert z instance databáze.
Vypracoval: Radek Fryšták 2012/2013
Stránka 13
Fakulta elektrotechniky a informatiky Návrh a tvorba WWW stánek a databázové systémy 2
c)Use case diagram
Use case diagram alias digram užití zhruba naznačuje jaké úkony nebo činnosti obsluhují účastníci modelu. Guest vystupuje jako obyčejný návštěvník či potenciální zákazník, po té co se registruje stává se z něj registrovaný uživatel, pokud si objedná hru či hry z nabídky možných her tak se z něj stává moderátor webu nebo správce her v případě plné objednávky obojí. Další účastník je zde administrátor, což je vlastně majitel serveru, který může obsluhovat vše co je v administraci zaneseno. Poslední z účastníku je démon Cron, který se stará o pravidelné spouštění naplánovaných akcí, jako je úklid zastaralých údajů v databázi, mazání neplatné cache a synchronizace file systému s databází.
Vypracoval: Radek Fryšták 2012/2013
Stránka 14
Fakulta elektrotechniky a informatiky Návrh a tvorba WWW stánek a databázové systémy 2
d)Diagram Tříd
Diagram je téměř přesným modelem tříd který tento systém využívá. Systém je koncipován tak aby neměl příliš externích závislostí, které by při přenosu kódu a různých modifikací implementace mohli dělat problémy. Stránky se skládají na indexu pomocí třídy která prochází celým indexem a je parametrem předávána do tříd, které se starají o template a obsluhu stránek.
Vypracoval: Radek Fryšták 2012/2013
Stránka 15
Fakulta elektrotechniky a informatiky Návrh a tvorba WWW stánek a databázové systémy 2
e) Adresářová struktura
Takto vypadá adresářová struktura, v kořenu (root) jsou ještě soubory ajax.php, index.php, mainclass.php, rss.php, favicon.ico, loader.php, global_config.php a database_config.php. Na úrovni kořene jsou zejména důležité soubory: loader.php který se stará o autoloading tříd pomocí SPL, Loader je třída sama o sobě, dále je zde index.php, který obsahuje výkonnou část kódu, vytvoření třídy MainClass, Cache, Tpl a ještě několika dalších. Konfigurace pro web a databázi je umístěna ve stejnojmenných souborech, napsané ve formátu NEON s využitím HereDoc. Posledním souborem v kořenu je souhlas rss.php, který se stará o renderování XML podle standardu RSS 2.0. Složka classes obsahuje třídy které systém využívá k fungování celých stránek, jen jmenuji několik tříd: Core pro globálně využívané metody, Html pro renderování html kódu, Form pro generování formulářů s pomocí třídy Html nebo HtmlPage pro generování html kostry webové stránky opět s pomocí třídy Html, více bude popsáno v sekci: popis tříd. Složka Css obsahuje kaskádové styly pro stránky, globální tiskové a další, ve složce js jsou JavaScripty použité ve stránkách a částečně i v adminu, složka img obsahuje obrázky které využívají styli, složka pages obsahuje php soubory stránek, jelikož každá stránka na webu je prakticky jedna php třída. Systém propojení je hruba takový že v konfiguraci je x-rozměrné pole které definuje Vypracoval: Radek Fryšták 2012/2013
Stránka 16
Fakulta elektrotechniky a informatiky Návrh a tvorba WWW stánek a databázové systémy 2
tvar menu stylem: url=>php třída, toto pole zpracovává třída StaticWeb která načítá dat od stránek, z routovací třídy bere adresu a jednotlivými metodami se předávají zpracované údaje do třídy HtmlPage která se postará o renderování. Samotné stránky se vykreslují podle souborů šablon. Tyto šablony jsou umístěny ve složce templates, každý template má koncovku .tpl. Ve složce templates je ještě jedna složka compile, která obsahuje zkompilované php soubory podle template. Princip je takový že se soubor s template prožene kompilátorem, který nahradí tempalte zápis php zápisem. Poslední složka _admin je složka kde se nachází administrace, má v podstatě stejnou adresářovou strukturu která je v kořenu, takže jsou to v podstatě stránky samy pro sebe.
Vypracoval: Radek Fryšták 2012/2013
Stránka 17