České vysoké učení technické v Praze Fakulta elektrotechnická
Bakalářská práce
Internetový obchod Jan Voldán
Vedoucí práce: Doc.Ing. Ivan Jelínek, CSc.
Studijní program: Elektrotechnika a informatika, dobíhající Obor: Výpočetní technika (bakalářský) duben 2006
Prohlášení Prohlašuji, že jsem svou bakalářskou práci vypracoval samostatně a použil jsem pouze podklady uvedené v přiloženém seznamu. Nemám závažný důvod proti užité tohoto školního díla ve smyslu §60 Zákona č. 121/2000 Sb., o právu autorském, o právech souvisejících s právem autorským a o změně některých zákonů (autorský zákon). V Praze dne …. …………………………………..
Obsah 1. 2. 3. 4. 5. 6.
Úvod .................................................................................................................... ii Popis a vymezení cílů BP a požadavků na implementovaný systém................... ii Kritéria pro hodnoceni přínosu řešeni ..................................................................iii Analýza požadavků na aplikaci........................................................................... iv Návrh implementace ............................................................................................ v Popis implementace / Realizace.........................................................................vii 6.1 Úvod ............................................................................................................vii 6.2 Vytvoření tabulek databáze .........................................................................vii 6.3 Autorizace uživatele...................................................................................... x 6.4 Nákupní košík...............................................................................................xi 7. Testování aplikace / zhodnocení dle kritérií pro hodnocení ................................xii 8. Srovnání s existujícími e-shopy .........................................................................xiii 9. Závěr..................................................................................................................xiv 10. Seznam použité literatury................................................................................xv 11. Přílohy.............................................................................................................xv 11.1 Instalační příručka .......................................................................................xv 11.2 Uživatelská příručka ..................................................................................xvii 1. Grafické rozhraní aplikace .........................................................................xvii 2. Přihlášení do systému a editace osobním dat .......................................... xviii 2.1 Registrace nového uživatele.............................................................. xviii 2.2 Existující uživatel .................................................................................xix 2.3 Editace osobních dat ............................................................................xx 3. Moduly systému...........................................................................................xx 3.1 Modul uživatelský .................................................................................xx 3.1.1 Prohlížení produktů .......................................................................xx 3.1.2 Nákupní košík.............................................................................. xxii 3.1.2.1 Přidání produktu do košíku ....................................................... xxii 3.1.2.2 Odebrání produktu z košíku......................................................xxii 3.1.3 Odeslání objednávky................................................................... xxii 3.2 Modul administrace ........................................................................... xxiii 3.2.1 Přidání nového produktu ............................................................ xxiii 3.2.2 Administrace produktů................................................................ xxiv 3.2.2.1 Úvodní obrazovka.................................................................... xxiv 3.2.2.2 Editace produktu.......................................................................xxv 3.2.2.3 Odstranění produktu ................................................................ xxvi 3.2.3 Administrace výrobců ................................................................. xxvi 3.2.3.1 Úvodní obrazovka.................................................................... xxvi 3.2.3.2 Editace výrobce ...................................................................... xxvii 3.2.3.3 Odstranění výrobce ................................................................ xxvii 3.2.4 Správa kategorií ....................................................................... xxviii 3.2.4.1 Úvodní obrazovka.................................................................. xxviii 3.2.4.2 Editace kategorie ................................................................... xxviii 3.2.4.3 Odstranění kategorie ............................................................... xxix 4. Odhlášení ze systému .............................................................................. xxix 11.3 Programátorská příručka ...........................................................................xxx 11.4 Obsah přiloženého CD ............................................................................. xxxi
i
1. Úvod Elektronické obchodování se stále více rozmáhá a to díky svým nesporným výhodám jako jsou například: •
nakupování z pohodlí domova nebo kanceláře 24 hodin denně
•
více možností plateb (kartou, na dobírku, hotově při dodávce kurýrem, na splátky, atd.)
•
dovoz zboží až do domu nebo kanceláře často ZDARMA
•
nižší ceny než v "kamených obchodech"
•
aktuální slevy akce a výprodeje
•
anonymita při nakupování (například při nakupování zboží erotického charakteru apod.)
V následujícím textu se zaměříme na implementaci jednoduchého internetového obchodu.
2. Popis a vymezení cílů BP a požadavků na implementovaný systém Má bakalářská práce je implementačního charakteru a její zadání zní následovně: • •
•
Proveďte analýzy možností pro implementaci internetového obchodu Navrhněte pro konkrétní aplikační oblast možnou implementaci. Při řešení využijte především běžné technologie PHP, MySQL, XHTML a CSS a při implementaci využijte šablonovací systém SMARTY (Smarty Template Engine) Stanovte kriteria pro hodnoceni přínosu řešeni a implementovaný internetový obchod podle nich zhodnoťte
Hned v úvodu bych se rád zmínil, že na základě bližšího seznámení se se šablonovacím systémem SMARTY, jsem dospěl k závěru, že tento systém při implementaci internetového obchodu zcela opominu. Hlavním důvodem je fakt, že pravý přínos šablonovacích systémů se projeví zejména u projektů většího rozsahu. Další předností šablonovacích systému je také to, že oddělují html kód od aplikační logiky, což je výhodné zejména v situaci, kdy na projektu pracuje více lidí (programátor uvítá, když designer vůbec nepřijde do styku s jeho kódem a nemůže do něho tak zasahovat nebo ho neúmyslně poškodit).
ii
Posledním důvodem mého rozhodnutí je fakt, že na mnoha hostingových serverech tento systém není vůbec nainstalován a pak by se celá aplikace na něm postavená stala nefunkční. Navíc bych rád doplnil původní zadání o využití technologie JavaScript, kterou využiji zejména při práci s formuláři (aktivace/deaktivace vstupních polí formuláře, potvrzování před odstraněním položky, atd.).
4. Analýza požadavků na aplikaci Na implementovaný internetový obchod jsou kladeny základní požadavky funkčnosti, které jsou patrny z níže uvedeného diagramu (obr 1).
Cílem BP je tedy implementovat internetový obchod za použití technologií PHP, MySQL, XHTML, CSS a JavaScript. Jelikož internetový obchod je aplikace se kterou pracuje široká veřejnost, která leckdy není příliš počítačově gramotná, je jedním z hlavních požadavků na aplikaci její přehlednost, srozumitelnost, snadné a intuitivní ovládání. Aplikace musí být „blbuvzdorná“, tj. například to, že když se uživatel pokusí jako cenu zadat textový řetězec, bude upozorněn, že je vyžadováno číslo. Zejména je tady nutné dostatečně ošetřit všechny uživatelské vstupy a jejich korektnost.
3. Kritéria pro hodnoceni přínosu řešeni Kritéria pro hodnocení aplikace mohou být rozdělena do několika bodů: a. Aplikace by měla být „blbuvzdorná“. Tj., měl by být například kontrolován správný formát všech zadávaných dat, pokud je třeba. b. Aplikace by měla být uživatelsky přívětivá. Tj., například by měla uživatele prostřednictvím patřičných hlášek informovat o výsledcích jeho požadavků. Dále by měla nabízet intuitivní ovládání. c. Jako další kritérium stanovým spolehlivost a funkčnost aplikace. Aplikace by se měla vždy chovat korektně, nemělo by docházet k chybám (když už, tak ošetřených patřičnou chybovou hláškou) a v žádném případě aplikace nikdy nesmí „spadnout“ na chybu. d. V neposlední řadě hraje významnou roli bezpečnost aplikace a to zejména v případě, že by internetový obchod nabízel elektronické platby. e. V databázi by neměla zůstávat žádná „mrtvá“ data (například jedním z požadavků (viz kapitola 4 - Analýza požadavků na aplikaci) na aplikaci je možnost odstranění kategorie. Při odstranění kategorie se spolu s ní mají odstranit i všechny produkty pod tuto kategorii spadající. Kdyby se toto neprovedlo, zůstávaly by v databázi tzv. „mrtvé“ produkty, které nespadají pod žádnou kategorii a nikdo k nim prostřednictvím GUI aplikace nemá přístup. Podobná situace nastává i při odstranění výrobce.
iii
obr 1 – Data Flow Diagram
Nejprve se tedy uživatel musí zaregistrovat (proces 1), aby si tak vytvořil přihlašovací data pro vstup do systému. Při registrace dále uživatel kromě svého přihlašovacího jména a hesla zadá svou e-mailovou adresu. Heslo a e-mailová adresu mohou být později změněna pomocí procesu editace osobních údajů (proces 1). Jsou dva typy registrace (dvě uživatelské role) – registrace běžný uživatel a registrace admin. Podle typu registrace bude uživateli umožněno provádět v systému pouze operace příslušejícímu danému typu uživatele (viz níže). Dále na základě přihlašovacích dat získaných pomocí procesu autorizace uživatel provede autorizaci (proces 2). Uživatel typu běžný uživatel může po přihlášení do systému provádět následující akce: •
prohlížet produkty (proces 6) – lze prohlížet všechny produkty spadající pod jednotlivé kategorie, dále lze prohlížet produkty pouze od konkrétního výrobce
•
přidat produkt do košíku (proces 8) – libovolný produkt lze přidat do nákupního košíku uživatele
•
odstranit produkt z košíku (proces 8) – produkt lze z nákupního košíku odstranit
•
editovat produkt (počet jeho výskytů) v košíku (proces 8) – uživatel chce například sto kusů od jednoho výrobku, aby nemusel stokrát klikat
iv
•
na odkaz přidat produkt do košíku, lze v košíku editovat počet výskytů daného produktu v nákupním košíku uživatele
Reálný internetový obchod může prodávat mnoho druhů zboží. Jeden a ten samý typ výrobku je v naprosté většině produkován alespoň několika výrobci.
poslat objednávku (proces 7) – objednávka je od zákazníka (běžný uživatel) zaslána provozovateli internetového obchodu prostřednictvím e-mailové zprávy a obsahuje aktuální obsah košíku; po odeslání objednávky se košík vyprázdní a zákazník může pokračovat v nákupu
Z výše uvedeného vyplývá, že pro produkty nabízené prostřednictvím internetového obchodu je třeba nejprve zřídit kategorie (například kategorie pro digitální fotoaparáty, digitální kamery, MP3 přehrávače atd..).
Uživatel typu administrátor může po přihlášení do systému provádět následující akce: •
přidat/odstranit/editovat kategorii (proces 4) – vytvoření/odstranění/ editace kategorie pro určitý typ produktů; každá kategorie má svůj název a popis; při odstranění kategorie se spolu s kategorií odstraní všechny produkty spadající pod tuto kategorii
•
přidat/odstranit/editovat produkt (proces 4) – přidání/odstranění/editace produktu; každý produkt spadá pod určitou kategorii, má svůj název, popis, cenu, svého výrobce a fotku
•
přidat/odstranit/editovat výrobce (proces 4) – přidání/odstranění/editace výrobce; u každého výrobce možno uložit jeho adresu; při odstranění výrobce se spolu s ním odstraní všechny produkty spadající pod toho výrobce
5. Návrh implementace
Pro každou kategorii nám postačí uchovat její název, popř. připojit krátký popis. V tabulce kategorie (obr 4) budou tedy pole nazev a popis. Každý záznam v tabulce kategorie bude mít přiděleno id_kategorie, kterým bude každá kategorie jednoznačně určena. Když už máme vytvořené kategorie, můžeme do nich vkládat jednotlivé produkty. Tabulka produkty (obr 5) bude obsahovat následující položky: id_vyrobce, nazev_produktu, cena, popis, nazev_souboru a kategorie. Položka id_vyrobce bude odkazovat na výrobce v tabulce vyrobci (obr 7), kategorie bude odkazovat na kategorii do které produkt spadá a položka nazev_souboru bude obsahovat jméno souboru, který představuje fotografii daného produktu. Význam zbývajících položek nazev_pro duktu, cena a popis je zřejmý z jejich názvů. Dále každý záznam v tabulce produkty bude mít přiděleno id_produktu, kterým bude každý produkt jednoznačně určen. Jak bylo zmíněno výše, každý produkt pochází od nějakého výrobce. Definujeme tedy tabulku vyrobci, která bude obsahovat následující položky: firma, ulice, mesto, psc. Význam těchto položek je patrný z jejich názvů. Každý záznam v tabulce vyrobci bude mít přiděleno id_vyrobce, kterým bude každý výrobce jednoznačně určen. Celý internetový obchod tedy pro svůj provoz potřebuje pět databázových tabulek: autorizace, kategorie, produkty, users a vyrobci.
Návrh implementace začneme tím, že si na základě analýzy požadavků, které jsou na internetový obchod kladeny (odstavec 4 - Analýza požadavků na aplikaci), navrhneme strukturu databázových tabulek, ve kterých budeme všechna potřebná data uchovávat.
Situaci lze graficky znázornit pomocí ER diagramu (obr 2).
Když chce uživatel začít nakupovat, musí se nejprve přihlásit. Nutnost přihlášení je podmíněna zejména tím faktem, že každý uživatel má možnost požadované produkty ukládat do svého elektronického nákupního košíku na základě jehož obsahu se pak vygeneruje objednávka nesoucí data tohoto uživatele. Pro uchování uživatelských dat tedy vytvoříme tabulku users (obr 6). V této tabulce budou uchovány pro každého uživatele následující údaje: login, password, name, email a ucet. Každý záznam v tabulce users bude mít přiděleno id, kterým bude každý uživatel jednoznačně určen. Význam položek login, password, name, email je zřejmý z jejich názvů. Položka ucet nese informaci o tom, zda se jedná o účet běžného uživatele nebo o administrátorský účet. S tabulkou users (obr 6) souvisí tabulka autorizace (obr 3), která obsahuje pouze dvě položky. Položky id a date. Údaje v této tabulce slouží pro autorizaci uživatelů. Více bude popsáno níže.
v
vi
obr 3 – tabulka autorizace
CREATE TABLE `autorizace` ( `id` varchar(32) collate latin2_czech_cs NOT NULL, `date` int(10) NOT NULL default '0', PRIMARY KEY (`id`), UNIQUE KEY `id` (`id`) ) ENGINE=MyISAM DEFAULT CHARSET=latin2 COLLATE=latin2_czech_cs; zdroj. kód 1 – dotaz MySQL pro vytvoření tabulky autorizace
obr 2 – ER diagram obr 4 – tabulka kategorie
Implementace jednotlivých funkčností internetového obchodu je přímočará a bezproblémová a lze ji snadno nahlédnou přímo z okomentovaného zdrojového kódu, který je součástí přiloženého CD. Při implementaci nejsou použity žádné speciální algoritmy. Jedná se o relativně jednoduché programování v PHP, MySQL. Za zmínku snad stojí zvolený způsob autorizace uživatelů a něco málo k realizaci nákupního košíku. Toto je uvedeno v následující kapitole (kapitola 6 - Popis implementace / Realizace).
CREATE TABLE `kategorie` ( `id_kategorie` int(4) NOT NULL auto_increment, `nazev` varchar(30) NOT NULL default '', `popis` varchar(255) NOT NULL default '', PRIMARY KEY (`id_kategorie`) ) ENGINE=InnoDB DEFAULT CHARSET=latin1; zdroj. kód 2 – dotaz MySQL pro vytvoření tabulky kategorie
6. Popis implementace / Realizace 6.1
Úvod
V předchozí kapitole jsme si definovali tabulky a jejich položky, které bude internetový obchod využívat. Nyní tyto tabulky vytvoříme v databázi MySQL. Zejména je třeba definovat datové typy jednotlivých položek.
obr 5 – tabulka produkty
Dále si popíšeme řešení autorizace uživatelů a nastíníme implementaci nákupního košíku. Realizace ostatních prvků internetového obchodu by měla být bezproblémová a lze ji nastudovat z okomentovaného zdrojového kódu.
6.2
Vytvoření tabulek databáze
Struktury tabulek spolu s příkazem MySQL pro jejich vytvoření jsou uvedeny níže.
vii
CREATE TABLE `produkty` ( `id_produktu` int(4) unsigned NOT NULL auto_increment, `id_vyrobce` int(4) unsigned NOT NULL default '0', `nazev_produktu` varchar(60) character set latin1 NOT NULL default '', `cena` int(6) NOT NULL default '0', `popis` longtext character set latin1, `nazev_souboru` varchar(30) character set latin1 default NULL, `kategorie` int(4) NOT NULL default '0', PRIMARY KEY (`id_produktu`) ) ENGINE=MyISAM DEFAULT CHARSET=latin2 COLLATE=latin2_czech_cs;
viii
zdroj. kód 3 – dotaz MySQL pro vytvoření tabulky produkty
6.3
Autorizace uživatele
Velmi často potřebujeme přístup na určité stránky naší aplikace zabezpečit heslem. Proto se používá autorizace. Existuje několik možností autorizace, níže nějaké z nich uvádím. a. HTTP autorizace obr 6 – tabulka users
CREATE TABLE `users` ( `id` int(4) NOT NULL auto_increment, `login` varchar(20) collate latin2_czech_cs NOT NULL default '', `password` varchar(32) collate latin2_czech_cs NOT NULL default '', `name` varchar(30) collate latin2_czech_cs NOT NULL, `email` varchar(50) collate latin2_czech_cs NOT NULL, `ucet` varchar(6) collate latin2_czech_cs NOT NULL default '', PRIMARY KEY (`id`), UNIQUE KEY `id` (`id`) ) ENGINE=MyISAM DEFAULT CHARSET=latin2 COLLATE=latin2_czech_cs;
Spolu se sessions je to jeden z nejvíce používaných způsobů. Nehrozí zde žádné problémy ze strany prohlížečů, jako je tomu třeba u cookies, které musí být prohlížečem povoleny. Další velkou výhodou je bezpečnost této autorizace. Ovšem nevýhodou je, že pro funkčnost HTTP autorizace musí PHP běžet jako modul serveru a nelze jednoduše naprogramovat odhlašování. Buď musíte ukládat pomocná data do databáze, čím ztrácí HTTP Autorizace výhodu oproti sessions nebo provést chybné přihlášení, což ale taktéž není optimálním řešením. b. Sessions Také velice bezpečná autorizace, která má tu výhodu oproti HTTP autorizaci, že zde nejsou problémy s odhlašováním a PHP nemusí běžet jako modul serveru.
zdroj. kód 4 – dotaz MySQL pro vytvoření tabulky users
c. Cookies Od verze PHP4, PHP mimo jiné obsahuje i podporu práce se sessions. Od té doby cookies ztratily svou pozici. Oproti sessions lze totiž cookies v prohlížeči zakázat a tak není jejich podpora stoprocentně zajištěna. Výhodou cookies je to, že u nich lze nastavit delší časovou platnost a platí pro všechna okna prohlížeče a nikoli pro jedno, jak je tomu u všech ostatních způsobů (HTTP Autorizace, sessions i jedinečný identifikátor). Je to způsobeno tím, že cookie neplatí pro konkrétní okno prohlížeče, ale pro doménu, kterou programátor definuje.
obr 7 – tabulka vyrobci
CREATE TABLE `vyrobci` ( `id_vyrobce` int(4) unsigned NOT NULL auto_increment, `firma` varchar(20) character set latin1 NOT NULL default '', `ulice` varchar(20) character set latin1 NOT NULL default '', `mesto` varchar(20) character set latin1 NOT NULL default '', `psc` varchar(6) collate latin2_czech_cs NOT NULL default '', PRIMARY KEY (`id_vyrobce`) ) ENGINE=MyISAM DEFAULT CHARSET=latin2 COLLATE=latin2_czech_cs; zdroj. kód 5 – dotaz MySQL pro vytvoření tabulky vyrobci
ix
d. Jedinečný identifikátor předávaný v URL Další metoda využívaná hlavně dříve. Při vstupu uživatele na server je, pomocí některého z mnoha nabízejících se způsobů, vygenerován jedinečný řetězcový či celočíselný identifikátor, který se uloží do databáze spolu s časem provedení poslední akce uživatelem. Při dalším pohybu uživatele na serveru se tento identifikátor předává jako parametr v URL a při vstupu na další stránku se vygeneruje nový identifikátor a tímto identifikátorem a novým časem poslední akce uživatele se přepíše starý údaj v databázi.
x
Výhodami tohoto způsobu jsou nízké nároky na server a žádné problémy s podporou ze strany prohlížečů. Nevýhodou je v porovnání s HTTP Autorizací a sessions nižší bezpečnost a parametr v URL navíc. e. IP Adresa Pokud bychom brali v úvahu všechny metody využívané při kontrole vícenásobného přístupu, nabízela by se i IP Adresa. Tento způsob ale není možné využívat z jednoho prostého důvodu. Spousta uživatelů je schována za proxy serverem a tudíž je jedna IP Adresa společná například pro 10 uživatelů. Ojedinělé nejsou i případy, kdy pod jednou IP Adresou vystupuje celá organizace. Pro kontrolu vícenásobného přístupu je tedy toto řešení dnes už nepoužitelné, protože žádnému serveru by na popularitě nepřidalo, kdyby v jeho anketě mohl hlasovat jen jeden člověk z deseti, či dokonce ze sta. A naopak - pokud by někdo naprogramoval a využíval autorizaci uživatelů pomocí IP Adresy, setkal by se s podobným problémem - pro uživatele se stejnou IP Adresou by nebylo problém tuto ochranu prolomit. Z tohoto důvodu není možné autorizaci využívající IP Adresu bezpečně používat. Na základě výše uvedeného jsem se rozhodl pro realizaci autorizace pomocí session. Zejména proto, že nejsou problémy s odhlašováním a PHP nemusí běžet jako modul serveru.
if (isset($_POST['odeslat'])) { foreach($_POST['mnozstvi'] as $klic => $hodnota) { if (($hodnota == 0) && (is_numeric ($hodnota))) { unset ($_SESSION['kosik'][$klic]); } elseif (is_numeric ($hodnota) && ($hodnota > 0)) { $_SESSION['kosik'][$klic] = $hodnota; } } } zdroj. kód 7 – Odstranění / editace počtu produktů v nákupním košíku
Výše uvedený zdrojový kód provede následující: Jestliže byl formulář odeslán projdi všechny prvky pole a když u nějakého prvku byla hodnota změněna na nula, vymaž tento prvek z nákupního košíku. V opačném případě aktualizuj počet produktů na novou hodnotu $hodnota, která byla zadána do pole formuláře.
7. Testování aplikace / zhodnocení dle kritérií pro hodnocení Internetový obchod jsem důkladně otestoval: •
Košík je realizován tak, že si u každého produktu který je do košíku vložen, pamatujeme číslo udávající množství tohoto produktu v košíku.
Začal jsem tím, že jsem vymazat všechny kategorie, produkty i výrobce a ověřil korektní chování (podání informace o tomto stavu) aplikace v případě, že databáze není naplněna
•
Toto číslo uchováváme v superglobální $_SESSION['kosik'][$produkt_id], která je v tomto dvojrozměrné pole.
Poté, jsem internetový obchod postupně naplnil daty, tj. vytvořil několik kategorií do kterých jsem nahrál několik produktů a zároveň tak vložil několik výrobců
•
Na těchto datech jsem dále otestoval funkce editace a mazání kategorií, produktů i výrobců
•
Nakonec jsem vše ze systému přes GUI vymazal a ověřil jsem, že databáze je opravdu prázdná a nezbyla v ní žádná zapomenutá data
6.4
Nákupní košík
proměnné případě typu
Máme-li tedy v nákupním košíku například pět digitálních fotoaparátů typu Konica Minolta DiMAGE Z3 a id toho produktu je 2, potom se provede následující přiřazení (zdroj. kód 6). $_SESSION['kosik'][2] = 5; zdroj. kód 6 – přidá do košíku pět fotoaparátů Konica Minolta DiMAGE Z3
Výsledky testování jsem ohodnotil vzhledem ke kritériím pro hodnocení aplikace (kapitola 3 - Kritéria pro hodnoceni přínosu řešeni):
Kromě přidání produktu do košíku je další nezbytnou funkčností možnost odstranění produktu z košíku nebo změny počtu kusů od daného produktu v košíku (uživatel, který chce koupit sto kusů od nějakého produktu, nebude stokrát klikat na odkaz přidat do košíku...). Kód který provede aktualizaci počtu prvků v košíku nebo produkt odstraní (nastavíme množství = 0), vypadá následovně (zdroj. kód 7).
xi
xii
kritérium „blbuvzdornost“
uživatelská přívětivost, intuitivní ovládání spolehlivost a funkčnost
bezpečnost
absence „mrtvých“ dat
výsledek testování vzhledem ke kritériu Aplikace se jeví dostatečně „blbuvzdorná“. Při odesílání všech formulářů (formulář registrace, přidání/editace nového produktu, výrobce, kategorie) je kontrolováno vyplnění všech povinný polí a jejich formát, je-li třeba (kontrolován je formát e-mailové adresy a při zadávání ceny je kontrolováno, zda se skutečně jedná o číslo). Při zadávání hesla je po uživateli požadováno heslo napsat dvakrát a následně se kontroluje, zda se zadaná hesla shodují. Aplikace se jeví uživatelsky přívětivá. Po provedení každé akce je vypsána hláška o výsledku této akce. Práce s aplikací se jeví z hlediska ovládání aplikace značně intuitivní. Všechny případné zdroje chyb (nelze navázat spojení s databází, pokus o autorizaci s neplatnými autorizačními údaji, atd.) jsou důkladně ošetřeny. Je-li třeba, aplikace vždy vypíše příslušnou chybovou hlášku, ale na chybu nespadne. Co se týče bezpečnosti, uživatelská hesla jsou do databáze ukládána zakódovaná (kódování pomocí MD5), takže i kdyby někdo získal přístup k databázi, nezíská hesla uživatelů. Autorizace uživatelů je řešena pomocí sessions, což představuje relativně bezpečnou autorizaci. Dále je nastavena časová platnost session na 15 minut, tj. jestliže je uživatel neaktivní déle než tuto dobu, dojde k jeho automatickému odhlášení ze systému. Žádná mrtvá data v databázi nezůstávají
8. Srovnání s existujícími e-shopy E-shopů dnes existuje nespočet. Mezi velké internetové obchody zaměřující se zejména elektroniku patří například Alzasoft (http://www.alzasoft.cz/) nebo Czech Computer (http://www.czechcomputer.cz/). Tyto internetové obchody jsou samozřejmě mnohem robustnější a propracovanější. Také nabízejí mnoho doplňkových služeb (o jaké moduly lze obchod rozšířit uvedu níže).
•
aktuality/ akční nabídky
•
diskuze ke zboží
•
diskuzní fórum
•
jazykové mutace
•
objednávky
•
reklamní systém
•
kategorie
•
slevy
•
statistiky (například sledování návštěvnosti jednotlivých internetového obchodu, nejprodávanější zboží, apod.)
•
věrnostní program (čím víc nakupuješ, tím nižší máš ceny)
stránek
Internetové obchody také dále často nabízejí službu fulltextového vyhledávání. Výše uvedené je shrnuto v níže uvedené tabulce: kritérium srovnání ankety aktuality/akční nabídky diskuze ke zboží diskuzní fórum jazykové mutace objednávky reklamní systém kategorie slevy statistiky věrnostní program možnosti platby
fulltext.vyhledávání
Alzasoft ne ano
CzechComputer ne ano
ne ano ne ano ne ne ano ano ano ano ano ano ano ano ano ano ano ne hotově(osobní odběr), kartou osobně, kartou přes internet, eBankou, příkazem (odběr na fakturu), nákup na splátky, nákup na leasing (pro podnikatele) ano ano
můj internetový obchod ne ne ne ne ne ano ne ano ne ne ne hotově (osobní odběr) ne
Dále s zde lze vybrat více způsobů platby jako je třeba platba kartou, na dobírku, hotově při dodávce kurýrem, na splátky, a další.
9. Závěr
Jak bylo zmíněno výše, internetové obchody lze doplnit o celou řadu doplňkových služeb. Tyto služby většinou realizují samostatné jednotky, které nazýváme moduly.
Tato práce přispěla zejména k prohloubení mých dosavadních praktických znalostí v oblasti vývoje internetových technologií.
Moduly rozšiřující internetový obchod mohou být následující: •
Implementovaný internetový obchod je funkční a řádně otestován.
ankety
xiii
xiv
Jistě by mohl být rozšířen o řadu dalších funkčností, ale to by bylo nad rámec mé bakalářské práce. Toto téma mě však zajímá a tak je možné, že se v budoucnu stane předmětem mé diplomové práce, kde bych se jím rád zabýval více do hloubky.
10. Seznam použité literatury
Kosek, J: PHP – Tvorba interaktivních internetových aplikací; Grada Larry Ullman: PHP a MySQL: Computer Press, Brno 2004 Kosek, J: HTML – Tvorba dokonalých WWW stránek; Grada
obr 8 –Import databáze s tabulkama pro internetový obchod I
Poté klikneme na tlačítko Procházet a vybereme soubor, který chceme importovat (v našem případě eshop.sql) - obr 9.
11. Přílohy 11.1
Instalační příručka
Vzhledem k tomu, že se jedná o relativně jednoduchou webovou aplikaci, není zapotřebí nějaké složité instalace. Instalace se skládá ze dvou kroků. Prvním krokem (a.Vytvoření databáze včetně tabulek) je vytvoření databáze včetně tabulek. Druhým krokem (b.Nastavení parametrů pro připojení k databázi) je nastavení parametrů připojení k databázi v souboru mysql_spojit.inc, který se vkládán do skriptů, které se potřebují spojit s databází. obr 9 - Import databáze s tabulkama pro internetový obchod II
a. Vytvoření databáze včetně tabulek
Nakonec stiskneme tlačítko Proveď pro provedení importu (obr 10).
Vytvoření databáze včetně tabulek lze provést importem souboru eshop.sql, který je uložen v adresáři ../import databaze/eshop.sql. Níže je popsán popis importu prostřednictvím administračního prostředí phpMyAdmin. Na úvodní stránce aplikace phpMyAdmin nejprve klikneme na odkaz Import (obr 8).
obr 10 - Import databáze s tabulkama pro internetový obchod III
xv
xvi
obr 12 – Grafické rozhraní aplikace
PhpMyAdmin vypíše hlášku o úspěšném provedení importu (obr 11). Na levé straně se nachází menu, pomocí kterého provádíme požadované volby. Menu je rozděleno na Veřejnou část a část Administrace.
obr 11 - Import databáze s tabulkama pro internetový obchod IV
b. Nastavení parametrů pro připojení k databázi
2. Přihlášení do systému a editace osobním dat 2.1 Registrace nového uživatele Pro přihlášení do systému slouží přihlašovací údaje. Tyto údaje uživatel získá při Registraci.
Parametry pro připojení k databázi jsou definovány v souboru mysql_spojit.inc jako konstanty (zdroj. kód 8). DEFINE DEFINE DEFINE DEFINE
('DB_UZIVATEL', 'login'); ('DB_HESLO', 'heslo'); ('DB_HOSTITEL', 'mysql.webzdarma.cz'); ('DB_NAZEVDATABAZE', 'eshop');
zdroj. kód 8 – Konstanty definující připojení k databázi
Konstanta DB_UZIVATEL definuje přihlašovací jméno, konstanta DB_HESLO je heslo příslušející k danému přihlašovacímu jménu. Konstanta DB_HOSTITEL představuje adresu databázového serveru, na kterém je databáze umístěna. Nakonec konstanta DB_NAZEVDATABAZE představuje název databáze (v našem případě není třeba měnit, pokud již na našem stroji neexistuje databáze stejného názvu).
obr 13 – Přihlášení do systému
Na registrační formulář se lze dostat kliknutím na odkaz Registrace (obr 13).
Soubor mysql_spojit.inc je umístěn v kořenovém adresáři.
11.2
Uživatelská příručka
1. Grafické rozhraní aplikace Úvodní stránka aplikace je na níže uvedeném obrázku (obr 12).
obr 14 – Registrace nového uživatele
Zobrazí se dialog (obr 14) pro zadání registračních údajů. Po vyplnění všech polí klikneme na tlačítko Zaregistrovat, čímž formulář s daty odešleme. Byla-li zadána korektní data (např. hesla se musejí shodovat, e-mail musí mít správný formát), zobrazí se potvrzení registrace (obr 15). V opačném případě nás aplikace vyzve k opravě chybných dat.
xvii
xviii
obr 17 – Po úspěšném přihlášení do systému
Zde jsou zobrazena naše uživatelská data. Po úspěšném přihlášení se také ve vodorovné liště zobrazí naše jméno (obr
obr 15 – Potvrzení registrace
36). Jak je patrné z výše uvedeného obrázku, registrační údaje jsou kromě jejich vypsání při potvrzení také poslány na zadaný e-mail registrovaného uživatele. 2.2
2.3
Editace osobních dat
Přejeme-li si změnit heslo nebo e-mail, klikneme na odkaz Změna osobních údajů (obr 17).
Existující uživatel
V případě již registrovaného uživatele, vstoupíme do systému prostřednictvím přihlašovacího formuláře (obr 13).
Zobrazí se následující dialog (obr 18), kde můžeme žádané změny provést.
Do pole login zadáme naše přihlašovací jméno a do pole psw příslušné heslo. Poté klikneme na tlačítko Přihlásit. Vše je zachyceno na obrázku (obr 16).
obr 18 – Editace osobních dat
Po zadání příslušných dat do formuláře, provedeme aktualizaci kliknutím na tlačítko Aktualizovat data. obr 16 – Přihlášení do systému
Jsou-li data správná, proběhne přihlášení a zobrazí se následující obrazovka (obr 17).
3. Moduly systému 3.1 Modul uživatelský 3.1.1 Prohlížení produktů Přejeme-li si prohlížet produkty, které internetový obchod nabízí, klikneme na odkaz zobrazit produkty, který se nachází v menu, ve veřejné části. Zobrazí se následující obrazovka (obr 19).
xix
xx
obr 19 – Prohlížení produktů obr 21 – Detail produktu
Jak je patrno z obrázku, výpis produktů je rozdělen do pěti sloupců. První sloupce jsou výrobce, název, popis, cena. Pátý, poslední sloupec není v systému pojmenován a zobrazuje se v něm fotka daného produktu. Klikneme-li na jméno výrobce, redukuje se výpis produktů pouze na produkty od tohoto výrobce. Chceme-li zobrazit detail nějakého produktu, můžeme to provést dvěma způsoby. Buď klikneme na název produktu nebo na jeho fotku. Viz obr 20.
3.1.2
Nákupní košík
3.1.2.1 Přidání produktu do košíku Přejeme-li si přidat produkt do elektronického nákupního košíku, stiskne odkaz Přidat do košíku, který se zobrazuje v kontextu detailu daného produktu. Vše je zachyceno na obrázku (obr 21). Chceme-li si obsah košíku prohlédnout, klikneme na odkaz obsah košíku (obr 12). Zobrazí se následující obrazovka (obr 22).
obr 20 – Zobrazení detailu produktu
Detail produktu vypadá následovně (obr 21).
obr 22 – Zobrazení obsahu elektronického nákupního košíku
3.1.2.2 Odebrání produktu z košíku Chceme-li produkt, který se již v elektronickém nákupním košíku nachází, odstranit, stačí do pole množství zadat číslo nula a kliknout na tlačítko Aktualizovat obsah košíku (obr 22).
3.1.3
xxi
Odeslání objednávky
xxii
Máme-li v elektronickém nákupním košíku všechny věci, které jsme požadovali, můžeme naši objednávku odeslat. To provedeme stiskem tlačítka Odeslat objednávku (obr 22).
U každého produktu se definuje výrobce. Výrobce produktu je buď v internetovém obchodu již definován (nějaký jiný produkt toho samého výrobce byl vložen do systému před tímto produktem) nebo ho je třeba do systému teprve přidat. Jestliže výrobce v systému již definován je, stačí ho jen vybrat ze seznamu (obr 25).
Objednávka bude následně odeslána na e-mailovou adresu internetového obchodu. 3.2
Modul administrace 3.2.1 Přidání nového produktu
Základním prvkem každého internetového obchodu jsou produkty, které daný obchod nabízí. Chce-li administrátor přidat do systému nový produkt, klikne na odkaz nový produkt, umístěný v menu v administrační části. Zobrazí se následující dialog (obr 23).
obr 25 – Výrobce v systému již existuje
V opačném případě definujeme výrobce vyplněním příslušných políček formuláře (obr 26).
obr 26 – Firma dosud v systému není, je třeba zadat
Dále vyplníme formulářová pole název produktu, cena, popis a do pole foto produktu přidáme fotku produktu (klikneme na tlačítko Procházet a vybereme fotku). Jsou-li korektně zadána všechna data, produkt bude přidán do příslušné kategorie. V opačném případě bude zobrazena příslušná chybová hláška. 3.2.2 Administrace produktů 3.2.2.1 Úvodní obrazovka Do administrace produktů se dostaneme, klikneme-li na odkaz admin produktů. Ten se nachází v menu na levé straně obrazovky v administrační části. Zde se nabízí přehled všech produktů, které se v internetovém obchodu právě nacházejí. Tyto produkty můžeme editovat, či úplně odstranit. obr 23 – Přidání nového produktu
Úvodní obrazovka administrace produktů je zachycena níže (obr 27).
Tento dialog není dostupný, neexistuje-li v systému dosud žádná kategorii. Každý produkt musí spadat do nějaké kategorie. Ze seznamu kategorie vybereme příslušnou kategorii (obr 23).
obr 24 – Výběr kategorie produktu
xxiii
xxiv
obr 28 – Editace produktu
Zde můžeme změnit název produktu, foto produktu, cenu a popis produktu. Stiskem tlačítka Odeslat data uložíme a daný produkt tak aktualizujeme.
3.2.2.3 Odstranění produktu Chceme-li nějaký produkt odstranit, provedeme to klikem na ikonku umístěna na pravé straně vedle daného produktu.
, která je
Následně se zobrazí níže uvedený dialog (obr 29).
obr 27 – úvodní strana Administrace produktů
Výpis produktů je rozdělen do sloupců název, výrobce, popis a cena. Klikneme-li na název výrobce, budou vyfiltrovány pouze produkty od daného výrobce. Na pravé straně obrazovky se u každého produktu nacházejí dvě ikonky sloužící k administraci produktu. obr 29 – Odstranění produktu
3.2.2.2 Editace produktu Chceme-li nějaký produkt editovat, provedeme to klikem na ikonku umístěna na pravé straně vedle daného produktu. Následně se zobrazí níže uvedený dialog (obr 28).
, která je
Aplikace se dotáže „Opravdu si přejete odstranit tento produkt?“. Stiskneme-li tlačítko OK, produkt bude nenávratně vymazán z internetového obchodu. Chceme-li zrušit odstranění produktu, stiskneme tlačítko Zrušit. 3.2.3 Administrace výrobců 3.2.3.1 Úvodní obrazovka Do administrace výrobců se dostaneme, klikneme-li na odkaz admin výrobců. Ten se nachází v menu na levé straně obrazovky v administrační části. Zde se nabízí přehled všech výrobců, kteří se v internetovém obchodu právě nacházejí. Tyto produkty můžeme editovat, či úplně odstranit. Úvodní obrazovka administrace výrobců je zachycena níže (obr 30).
xxv
xxvi
obr 32 – Odstranění výrobce
Aplikace se dotáže „Opravdu si přejete odstranit tohoto výrobce?“. Stisknemeli tlačítko OK, výrobce bude nenávratně vymazán z internetového obchodu. Chcemeli zrušit odstranění výrobce, stiskneme tlačítko Zrušit. Pozor, odstraníme-li nějakého výrobce, spolu s ním zároveň odstraníme i všechny jeho produkty!
3.2.4 Správa kategorií 3.2.4.1 Úvodní obrazovka
obr 30 - úvodní strana Administrace výrobců
Výpis výrobců je rozdělen do sloupců výrobce, ulice, město a psč.. Na pravé straně obrazovky se u každého produktu nacházejí dvě ikonky sloužící k administraci výrobce.
Do správy kategorií se dostaneme, klikneme-li na odkaz správa kategorií. Ten se nachází v menu na levé straně obrazovky v administrační části. Zde se nabízí přehled všech kategorií, které se v internetovém obchodu právě nacházejí. Tyto kategorie můžeme editovat, či úplně odstranit. Úvodní obrazovka správy kategorií je zachycena níže (obr 33).
3.2.3.2 Editace výrobce Chceme-li nějakého výrobce editovat, provedeme to klikem na ikonku která je umístěna na pravé straně vedle daného výrobce.
,
Následně se zobrazí níže uvedený dialog (obr 31).
obr 31 – Editace výrobce
Zde můžeme změnit hodnoty polí firma, ulice, město a psč. Stiskem tlačítka Odeslat data uložíme a daného výrobce tak aktualizujeme. obr 33 - úvodní strana Správy kategorií
3.2.3.3 Odstranění výrobce Chceme-li nějakého výrobce odstranit, provedeme to klikem na ikonku která je umístěna na pravé straně vedle daného výrobce. Následně se zobrazí níže uvedený dialog (obr 32).
,
Výpis kategorií je rozdělen do sloupců název, popis a produkty. Na pravé straně obrazovky se u každé kategorie nacházejí dvě ikonky sloužící k administraci kategorie. 3.2.4.2 Editace kategorie Chceme-li nějakou kategorii editovat, provedeme to klikem na ikonku je umístěna na pravé straně vedle dané kategorie. Následně se zobrazí níže uvedený dialog (obr 34).
xxvii
xxviii
, která
obr 34 – Editace kategorie
Zde můžeme změnit hodnoty polí název a popis. Stiskem tlačítka Odeslat data uložíme a danou kategorii tak aktualizujeme.
obr 36 – Odhlášení ze systému
11.3
Programátorská příručka
Aplikace nebyla vytvářena s ohledem na usnadnění dalšího budoucího rozšíření.
3.2.4.3 Odstranění kategorie Chceme-li nějakou kategorii odstranit, provedeme to klikem na ikonku je umístěna na pravé straně vedle dané kategorie.
, která
Následně se zobrazí níže uvedený dialog (obr 28).
Avšak zdrojový kód je okomentován a po důkladném prostudování šikovným programátorem je aplikace zcela jistě dalším rozšířením přístupná. Níže uvádádím adresářovou strukturu (obr 37) pro uložení souborů aplikace a popis jednotlivých souborů obsahujících zdrojový kód.
obr 35 – Odstranění kategorie
Aplikace se dotáže „Opravdu si přejete odstranit tuto kategorii?“. Stiskneme-li tlačítko OK, kategorie bude nenávratně vymazána z internetového obchodu. Chceme-li zrušit odstranění kategorie, stiskneme tlačítko Zrušit. 4. Odhlášení ze systému Chceme-li se z internetového obchodu odhlásit, klikneme na naše jméno (na níže uvedeném obrázku je to jméno Josef Veselý), které se po přihlášení do aplikace zobrazilo v horní vodorovné liště (obr 36).
obr 37 – Adresářová struktura
Adresář dokumentace obsahuje soubor Internetový obchod.doc, který představuje tuto dokumentaci v elektronické podobě. V adresáři images jsou uloženy obrázky užité v GUI aplikace. Adresář import databáze obsahuje importní soubory pro vytvoření databáze pro internetový obchod včetně prázdných tabulek. Jeho podadresář zkušební data obsahuje stejný importní soubor pro vytvoření databáze s tím rozdílem, že tabulky již budou naplněny zkušebními daty pro otestování obchodu. Do adresáře přijato se ukládají fotky jednotlivých produktů nabízených v internetovém obchodě.
xxix
xxx
Jednotlivé soubory umístěny v kořenovém adresáři plní následující funkčnosti: soubor
funkčnost vytvoření nové katagorie, její editace a odstranění editace a odstranění stávajícího produktu editace a odstranění stávajících výrobců přidá produkt do košíku soubor, který se vkládá do ostatních skriptů jako patička footer.inc stránky soubor, který se vkládá do ostatních skriptů jako hlavička header.inc stránky index.php úvodní stránka – provedení autorizace uživatele login_form.inc přihlašovací formulář (vkládá se do ostatních stránek) lstranaeshop.inc menu internetového obchodu (umístěno na levé straně) mysql_spojit.inc definice parametrů pro připojení k databázi pridat_produkt.php přidání nového produktu/výrobce prochazet_produkty.php zobrazení produktů v internetovém obchodě registrace.php registrace nového uživatele / editace uživatelských dat vygeneruje aktuální seznam kategorií (vkládá se do seznam_kategorii.inc ostatních souborů) styly.css deginuje grafický vzhled aplkace (kaskádové styly) zobrazí obsah košíku, editace obsahu košíku, odeslání zobraz_kosik.php objednávky od uživatele provozovateli internetového obchodu zobraz_produkt.php zobrazí detail produktu
admin_kategorie.php admin_produkty.php admin_vyrobci.php do_kosiku.php
11.4
Obsah přiloženého CD
Na CD je tato bakalářská práce v elektronické podobě (soubor Internetový obchod.doc) a navíc zdrojové kódy aplikace v plném rozsahu.
xxxi
