Webes alkalmazások fejlesztése 3. gyakorlat Authentikáció, adatok feltöltése Szabó Tamás (sztrabi@inf.elte.hu) - sztrabi.web.elte.hu
Authentikáció Manapság már elvárás, hogy a felhasználó regisztrálni tudjon a rendszerünkbe és személyre szabott funkciókat használhasson. Az ASP.NET MVC keretrendszerben legegyszerűbben egy speciális szűrővel (Authorize) lehet beállítani a felhasználó authentikációját. System.Web.Security.FormsAuthentication osztály néhány statikus metódusát fogjuk használni a megvalósításhoz. Ne felejtsük el finomhangolni a konfigurációs fájlban (web.config) azt, hogy melyik akciót hívja meg az ASP.NET MVC ha bejelentkezés szükséges: <authentication mode="forms"> <forms loginurl="~/account/login" timeout="2880" /> </authentication> Szabó Tamás (sztrabi@inf.elte.hu) - sztrabi.web.elte.hu 2
FormsAuthentication osztály [Authorize] attribútummal megjelöljük azokat az akciókat vagy vezérlőket, melyeknek funkcióit csak bejelentkezett felhasználók használhatják. Fontosabb metódusai a FormAuthentication osztálynak: Authenticate: Ez a metódus a konfigurációs fájlból (web.config) olvassa ki a felhasználó adait (felhasználónév, jelszó) és igazzal tér vissza, ha talált egyezést. SetAuthCookie: A metódus definiál egy új sütit, aminek segítségével a felhasználónak nem kell minden oldalkérés után belépnie a weboldalunkra. Signout: Törli a böngészőből az SetAuthCookie által beállított sütit. Szabó Tamás (sztrabi@inf.elte.hu) - sztrabi.web.elte.hu 3
FormsAuthentication osztály Egyszerű és gyors a használata, ami alapvető azonosítást tesz lehetővé. Hátránya viszont az, hogy nehézkes a tesztelés, ugyanis nem egy osztály példányait teszteljük, hanem annak statikus metódusait. Egy jó megoldás lehet arra az, hogy létrehozunk egy saját interfészt (pl.: IAuthenticateProvider), amibe becsomagoljuk az ASP.NET MVC adta lehetőségeket és ezt az interfészt adjuk át a vezérlőinknek Szabó Tamás (sztrabi@inf.elte.hu) - sztrabi.web.elte.hu 4
DEMO To-Do-Site Authentikáció Szabó Tamás (sztrabi@inf.elte.hu) - sztrabi.web.elte.hu 5
Adatok feltöltése a szerverre Eddig egyszerű szöveget küldtünk a szervernek, de mi történik akkor, ha különböző adatokat (pl.: fájlokat vagy képeket) szeretnénk feltölteni? A HTML szabvány lehetőséget biztosít arra, hogy fájlokat küldjünk (post-oljunk) a szervernek. Fájl kiválasztását az <input type= file /> taggal lehet megadni Sajnos nem lehet explicite beállítani, hogy a felhasználó milyen típusú fájlokat tölthet fel Natív JavaScript-el vagy valamilyen külső könyvtárral (jquery) a fájl kiválasztása után viszont lehetőség van különböző ellenőrzésekre Szabó Tamás (sztrabi@inf.elte.hu) - sztrabi.web.elte.hu 6
Adatok feltöltése a szerverre Ahhoz, hogy fájlt tudjunk küldeni a szervernek egy form-ot kell létrehoznunk és az enctype attribútumát kell beállítanunk: <form enctype= multipart/form-data > Szerver oldalon az akciómetódus egy HttpPostedFileBase típusú objektumot kap paraméteréül, amitől le tudjuk kérdezni a fájl jellemzőit, úgymint a fájl típusa (pl.: szöveg, kép), mérete, fájl neve, illetve a tartalmát. Szabó Tamás (sztrabi@inf.elte.hu) - sztrabi.web.elte.hu 7
MIME tartalomtípus HttpPostedFileBase objektum ContentType tulajdonsága MIME formátumban tárolja a fájl típusát. Ezeket az értékeket veheti fel: text/plain: Egyszerű szöveges állomány text/html: HTML dokumentum text/javascript: JavaScript szkriptfájl image/gif: GIF formátumú képállomány image/jpeg: JPEG formátumú képállomány audio/mp3: MP3 formátumú audióállomány Szabó Tamás (sztrabi@inf.elte.hu) - sztrabi.web.elte.hu 8
DEMO To-Do-Site Szöveges fájl feltöltése Szabó Tamás (sztrabi@inf.elte.hu) - sztrabi.web.elte.hu 9
Hogyan tovább? Nem volt szó az egyedi szűrők használatáról (Filtering), különböző képernyőméretek kezeléséről (Display Modes) és még rengeteg mindenről Web API új lehetőség arra, hogy gyorsan és egyszerűen készítsen a felhasználó web szervízeket (web service). Felépítése nagyon hasonlít az eddig látottakhoz, de ez a technológia nem ekvivalens az ASP.NET MVC-vel Tesztelő keretrendszerek: nunit, Visual Studio Test Project Külső technológiák: moq, Ninject stb. Kliens oldali technológiák: jquery, Knockout.js, Modernizer stb. Szabó Tamás (sztrabi@inf.elte.hu) - sztrabi.web.elte.hu 10
Hogyan tovább? Jelenleg az ipar azt mutatja, hogy a webes technológiák egyre nagyobb hangsúlyt kapnak a fejlesztéseknél. Egyre többször lehet hallani, hogy a JavaScript nyelv a web assembly nyelvévé alakul át és helyette már magasabb szintű programozási nyelveken (Dart, CoffeeScript, TypeScript) készítik el a nagyobb projekteket. Szabó Tamás (sztrabi@inf.elte.hu) - sztrabi.web.elte.hu 11
TypeScript nyelvről pár szót A nyelvet a Microsoft fejlesztette ki és adta közre tavaly 2012. szeptemberében Cél nem egy újabb Javascript-gyilkos nyelv megalkotása volt, hanem egy olyan eszköz elkészítése, mely segíti a fejlesztőket igazán nagy projektek elkészítésében is Fontosságát mutatja, hogy a WinRT Javascript egy részét is ebben írták Anders Hejlsberg (Pascal, Delphi, C#) is részt vett a projektben Legfőbb filozófiája: Legyen a TypeScript bővebb halmaza a Javascript-nek Szabó Tamás (sztrabi@inf.elte.hu) - sztrabi.web.elte.hu 12
TypeScript nyelvről pár szót Open source, operációsrendszer- és böngészőfüggetlen Statikusan típusos nyelv JavaScript kódra fordítja a forráskódot Felülről kompatibilis a Javascript nyelvvel Objektum-orientált nyelvi eszközöket is nyelvi szinten támogatja (interface, class, module stb.) A 0.9-es verziótól megjelennek a nyelvben a generikus típusok Szabó Tamás (sztrabi@inf.elte.hu) - sztrabi.web.elte.hu 13
Köszönöm a figyelmet! Szabó Tamás (sztrabi@inf.elte.hu) - sztrabi.web.elte.hu