prednaska03

60 %
40 %
Information about prednaska03
Entertainment
fei

Published on November 28, 2007

Author: brod

Source: authorstream.com

Vývoj internetových aplikací:  Vývoj internetových aplikací 3. Statický vs dynamický web Tomáš Tureček, VŠB-TU Ostrava, FEI, 456, ©2006 Obsah přednášky:  Obsah přednášky Statický vs. dynamický web Dynamický web client side server side World Wide Web:  World Wide Web provázaná síť dokumentů na Internetu statické dokumenty beze změny předány a zobrazeny HTML (CSS), plain text, ... dynamické dokumenty mění se na základě parametrů IS, vyhledávače, databáze, ceníky, ... statický vs. dynamický web Dynamický web:  Dynamický web Client side JavaScript, Applet, ActiveX, Flash, ... aplikace je spuštěna až u klienta po stažení Server side CGI, PHP, ASP, Servlet, ... logika na serveru vygeneruje a zašle zpět text Generování na straně klienta:  Generování na straně klienta Dynamický web (client side) Javascript Java Applet Macromedia Flash Microsoft Silverlight ActiveX JavaScript (client-side):  JavaScript (client-side) čistě interpretační programovací jazyk primitivní objektové vlastnosti původně součást Netscape Navigatoru má vazbu na prvky prohlížeče (okno, dokument, elementy, ...) kód je součástí HTML dokumentu, provádí se na straně uživatele syntakticky podobný C, C++ a Javě beztypový jazyk Možnosti JavaScriptu:  Možnosti JavaScriptu ovládání dokumentu, vzhledu a obsahu metoda write() ovládání chování prohlížeče vyvolávání dialogů (upozorňující, vstupní) otevírání/zavírání oken a určení jejich vlastností možnost řízení několika oken manipulace s rámy (frame) interakce s obsahem dokumentu objekt document interakce s uživatelem manipulace s událostmi manipulace s Cookies čtení i zápis interakce s Applety čtení a modifkace vlastností Appletu volání metod Appletu manipulace s obrázky JavaScript:  JavaScript Vkládání do HTML dokumentu přímý zápis kódu do dokumentu Vkládání JavaScriptovského souboru <script language="javascript"> ... ... </script> <script language="javajcript1.1" src="functions.js"></script> JavaScript - objektový model:  JavaScript - objektový model window location frames history navigator event screen document links anchors images filters forms applets embeds plugins frames scripts all selection styleSheets body window základní objekt document zahrnuje všechny objekty a vlastnosti aktuálního dokumentu dostupnost objektů window.document.jméno_elementu.jméno_vlastnosti document.all objekty přístupné pomocí parametru ID window.document.formular.jmeno.value = "Tomáš"; <H1 ID="nadpis">Nějaký nadpis</H1> document.all.Nadpis.innerText = "Nový nadpis"; window.location = "http://www.vsb.cz"; JavaScript - události:  JavaScript - události onBlur onChange onClick onFocus onLoad onMouseOver onMouseOut onSelect onSubmit onUnload <form action="script.php" METHOD="post" onSubmit="return validate()"> ... ... </form> <img src="obrazek1.gif" onMouseOver="this.src='obrazek2.gif';" onMouseOut="this.src='obrazek1.gif';"> Slide11:  var count = 2; var obr = new Array(); function preload(jmeno, prvni, druhy) { obr[count] = new Array(3); obr[count][0] = jmeno; obr[count][1] = new Image(); obr[count][1].src = prvni; obr[count][2] = new Image(); obr[count][2].src = druhy; count++; } function on(jmeno) { for (i = 0; i < count; i++) { if (obr[i][0] == jmeno) { document.images[jmeno].src = obr[i][2].src; } } } function off() { for(i = 0; i < count; i++) { document.images[obr[i][0]].src = obr[i][1].src; } } preload("name1", "obr1.gif", "obr2.gif"); preload("name2", "obr3.gif", "obr4.gif"); <A HREF="index.php" onMouseOver="on('name1');" onMouseOut="off();"> <IMG SRC="obr1.gif" border="0" name="name1"> </A> <A HREF="seznam.php" onMouseOver="on('name2');" onMouseOut="off();"> <IMG SRC="obr3.gif" border="0" name="name2"> </A> JavaScript - příklad preloaderu Java Applet:  Java Applet druh aplikace navržené pro webový prohlížeč Applet se liší od aplikace bezpečnostními omezeními nemá metodu main(..) metody volané prohlížečem init() destroy() start() stop() paint(Graphics g) ... Java Applet (2):  kód appletu HTML element <applet> pro vložení appletu Java Applet (2) import java.applet.*; import java.awt.*; public class FirstApplet extends Applet { public void paint(Graphics g) { g.drawString("Hello World", 25, 50); } } <applet code="FirstApplet.class" width=150 height=100> <h3>Váš prohlížeč neumí zobrazovat applety</h3> </applet> Java Applet (3):  Java Applet (3) import java.applet.*; import java.awt.*; public class Appl extends Applet { private int last_x = 0, last_y = 0; public boolean mouseDown(Event e, int x, int y) { last_x = x; last_y = y; return true; } public boolean mouseDrag(Event e, int x, int y) { Graphics g = getGraphics(); g.drawLine(last_x, last_y, x, y); last_x = x; last_y = y; return true; } } kód appletu Macromedia Flash:  Macromedia Flash prostředí pro tvorbu animací vektorová grafika, zvuk kompilace zdrojového Flash dokumentu do mezikódu aktivní skriptování počítání mezisnímků Slide16:  Macromedia Flash Microsoft Silverlight:  Microsoft Silverlight obdoba Macromedia Flash s vazbou na .NET grafický editor Expression Blend code behind UI definovaný pomocí XAML (eXtensible Application Markup Language) obdoba WPF (Windows Presentation Foundation) Visual Studio 2008 (Expression Blend) ActiveX:  ActiveX nedílná součást Microsoftích produktů nedefinuje technologie, jde o „obchodní značku“ mnoha technologií souvisejí s Internetem (webem) jsou vybudovány na COM (MicroSoft) aplikace v aplikaci ActiveX a prohlížeče:  ActiveX a prohlížeče v hrubých rysech obdoba Javovských appletů komponenty, spustitelné na webové stránce (ActiveX prostředí) je vybudován na Microsoftském komponentovém objektovém modelu (COM) možnosti ActiveX jsou mnohem větší než u appletů plný přístup k systémovým prostředkům počítače interaktivní stránky s použitím pluginů prohlížeče Generování na straně serveru:  Generování na straně serveru CGI Common Gateway Interface SSI Server Side Includes SSJS Server Side JavaScript PHP Common Gateway Interface (CGI):  Common Gateway Interface (CGI) není programovací jazyk definuje jak má webový server komunikovat s ostatními aplikacemi (CGI-skripty) libovolný programovací jazyk dostupný na platformě volba jazyka který programátor zná který umožňuje práci s textem Perl, C, C++, Visual Basic, ... CGI - vlastnosti:  CGI - vlastnosti použití libovolného jazyka generování dokumentů HTML, XML, DOM, ... všechna data zpracovávána na serveru problém zatížení problém bezpečnosti programátor prostředí detekce skiptu přípona *.cgi lokace /cgi-bin/ CGI – architektura:  CGI – architektura Proměnné daného prostředí:  Proměnné daného prostředí obdoba systémových proměnných SERVER_NAME localhost, 158.196.154.161, ... REQUEST_METHOD GET, POST SCRIPT_NAME /cgi-bin/skript.cgi QUERY_STRING n=10&jmeno=Jan&vek=30 REMOTE_ADDR CONTENT_TYPE text/html, text/plain, image/gif, ... HTTP_REFERER http://www.vsb.cz/index.html ... Výstup CGI-skriptu:  Výstup CGI-skriptu HTTP hlavička nejnutnější hlavičky ručně zbytek webový server Samotná data HTML, XML, ... print "Content-type: text/html\n\n"; print "<HTML>\n"; print " <HEAD>\n"; print " <TITLE>Jednoduchý HTML dokument</TITLE>\n"; print " </HEAD>\n"; print "<BODY>\n"; print " <H1>HTML dokument</H1>\n"; print " <HR>\n"; print " <P> Tento dokument je výstupem CGI skriptu "; print $ENV{SCRIPT_NAME}; print "</BODY>\n"; print "</HTML>\n"; exit(0); Server side includes (SSI):  Server side includes (SSI) soubory s příponou .shtml direktivy v HTML echo variable include file exec command ... <!--#exec cgi="/cesta/paticka.out"--> //Program v C++ //tiskne paticku dokumentu void main(){ cout << "<SMALL>VŠB-TU Ostrava &copy;2004</SMALL>"; } Server Side JavaScript (SSJS):  Server Side JavaScript (SSJS) rozšíření client side JavaScriptu o funkce proveditelné na straně serveru spojení s databází přistup ke službám serveru vkládání kompilace zdrojových SSJS souborů do spustitelného souboru Server Side JavaScript (SSJS):  Server Side JavaScript (SSJS) Slide29:  SSJS Application Manager SSJS - příklad:  SSJS - příklad <html> <head> <title> Hello World </title> </head> <body> <h1> Hello World </h1> <p> Your IP address is <server> write(request.ip); </server> </body> </html> PHP:  PHP 1994 - PHP/FI - Personal Home Page Tools/Forms Interpreter Rasmus Lerdorf základ perl Implementace PHP/FI v C přístup k databázím open source 1997 - PHP/FI 2.0 druhá implementace v C nainstalováno na 1% serverů 1998 - PHP 3.0 kompletně přepracovaná nová verze (Andi, Rasmus, Zeev) podpora objektů podpora mnoha databází open source nové knihovny 1999 - PHP 4.0 (Zend - ZEev aNDi) nový engine HTTP session rozšíření jazyka buffering výstupu 2004 - PHP 5.0 nový engine Zend II (nový objektový model) podpora XML (DOM), SimpleXML extension SOAP extension podpora MySQL 4.1 stream a sockett PHP - vlastnosti:  PHP - vlastnosti nekomerční produkt, open source podobný princip jako u SSJS a ASP vkládání kódu do HTML nezávislost na platformě nezávislost na webovém serveru PHP - příklad:  PHP - příklad <html> <head> <title> <?php echo "Generovaný dokument"; ?> </title> </head> <body> <h1>Hello world!!</h1> <table border="1"> <script language="php"> for($i=1; $i<=10; $i++){ echo " <tr>\n"; echo " <td>$i</td>\n"; echo " </tr>\n"; } </script> </table> </body> </html> PHP - vlastnosti jazyka:  PHP - vlastnosti jazyka preprocesor, interpreter syntaxe vypůjčená z C, Javy a Perlu deklarace proměnné při prvním použití 8 typů proměnnných, automatická detekce typu boolean, integer, float, string, array, object, resource, NULL HTTP sessions moduly knihoven funkcí řetězce databáze generování grafiky matematické funkce ... http://www.php.cz Příklad - PHP a formuláře:  ... <form action="skript.php" method="post"> Jmeno:<BR> <input type="text" name="jmeno"><BR> Prijmeni:<BR> <input type="text" name="prijmeni"><BR> <input type="submit" value="odeslat"> </form> ... HTML formulář POST /skript.php HTTP/1.0 Content-Length: 31 jmeno=Božetěch&prijmeni=Picmaus HTTP požadavek Příklad - PHP a formuláře Slide36:  <html> <body> <P> Zadali jste: <P> <?php echo "Jmeno: $jmeno <br>\n"; echo "Prijmeni: ".$prijmeni."<br>\n"; ?> </body> </html> PHP skript POST /skript.php HTTP/1.0 Content-Length: 31 jmeno=Božetěch&prijmeni=Picmaus HTTP požadavek jmeno=Božetěch&prijmeni=Picmaus HTTP/1.0 200 OK Content-Length: 92 Content-Type: text/html <html> <body> <P> Zadali jste: <P> Jmeno: Božetěch<br> Prijmeni: Picmaus<br> </body> </html> HTTP odpověď Příklad - počítadlo přístupů:  Příklad - počítadlo přístupů <?php include("pocitadlo.php"); ?> <html> <body> <h2>Vítejte</h2> Jste <?php echo pocitadlo().".";?> návštěvníkem této stránky </body> </html> <?php function pocitadlo(){ $filename = "pocitadlo.txt"; if (file_exists($filename)){ $file = fopen($filename, "r+"); $pocet = fread($file, filesize($filename)); $pocet++; rewind($file); fwrite($file,$pocet); fclose($file); return $pocet; }else{ $file = fopen($filename, "w"); $pocet = 1; fwrite($file, $pocet); fclose($file); return $pocet; } } ?> skript.php pocitadlo.php Příklad přístupu do databáze MySQL:  Příklad přístupu do databáze MySQL <?php $spojeni = MySQL_pConnect("linux456.vsb.cz", "tur038", "heslo"); if (!$spojeni) die("Nepovedlo se navazat spojeni s databazi"); $db = MySQL_Select_DB("tur038"); if (!$db) die("Nepovedlo se vybrat databazi"); $vysledek = MySQL_Query("SELECT * FROM uzivatel WHERE jmeno = 'Lucius';"); if (!$vysledek) die("Nepovedlo se provest dotaz"); echo "<table>"; while($zaznam = MySQL_Fetch_Object($vysledek)){ echo "<tr>"; echo "<td>login:</td><td>".$zaznam->login."</td>"; echo "</tr>"; echo "<tr>"; echo "<td>jmeno:</td><td>".$zaznam->jmeno."</td>"; echo "</tr>"; echo "<tr>"; echo "<td>prijmeni:</td> <td>".$zaznam->prijmeni."</td>"; echo "</tr>"; echo "<tr>"; echo "<td>bydliste:</td> <td>".$zaznam->bydliste."</td>"; echo "</tr>"; } echo "</table>"; MySQL_Close($spojeni); ?> Databáze tur038 uzivatel(login, jmeno, prijmeni, bydliste) PHP session:  PHP session přístup do IS, autorizace HTTP je bezestavový nutnost opakované autorizace Řešení? cookies? formulářová pole typu hidden? nebezpečí odchycení loginu a hesla PHP session (2):  PHP session (2) Schéma prvotní přihlášení - přenos loginu a hesla založení sezení uložení sessionID do cookies uložení loginu a hesla do souboru na serveru mapování sessionID na uložené proměnné na serveru odhlášení ze systému rušení sezení mazání souboru s daty PHP session (3):  PHP session (3) <form action="login.php"> <input type="text" name="login"> <input type="password" name="passwd"> <input type="submit" value="odeslat"> </form> <?php session_start(); session_register("login"); $_SESSION["passwd"] = $passwd; header("Location: main.php"); ?> <?php session_start(); require("funkce.php"); if (!checkUser($login, $passw)){ die("ACCESS DENIED"); } ... ... ?> index.html login.php main.php Active Server Pages:  Active Server Pages Microsoftí reakce na SSJS ASP obdoba SSJS jiné značky pro skript jiná hierarchie objektů programovací jazyk VBScript JScript Perl REXX Python Komerční produkt Obsah další přednášky:  Obsah další přednášky Servlety JSP Frameworky (Struts) ASP.NET Děkuji Vám za pozornost:  Děkuji Vám za pozornost Dotazy? Diskuze?

Add a comment

Comments

Goose Outlet Free Shipping | 08/12/14
Canada Goose Free Shipping [url=http://www.clallampud.net/header.asp]Goose Outlet Free Shipping[/url]

Related presentations

Related pages

www.fit.vutbr.cz

Prednaska 03/Prednaska03/Prednaska03/bin/Debug/Prednaska03.exePrednaska 03/Prednaska03/Prednaska03/bin/Debug/Prednaska03.pdbPrednaska 03/Prednaska03 ...
Read more

prednaska03 v06 exp

prednaska03_v06_exp Author: Administrator Created Date: 11/21/2008 4:10:03 PM ...
Read more

Siete - - 3. Prednáška - Aplikačná vrstva: DNS, P2P ...

2. P2P siete. Peer-to-peer (P2P, alebo po slovensky rovný s rovným) je architektúra, ktorá sa v súčasnosti najmasívnejšie používa na zdieľanie a ...
Read more

P. Elias Vella — Free listening, videos, concerts, stats ...

Watch videos & listen free to P. Elias Vella: 03-prednaska03-128kb and 01-prednaska01-128kb. Discover more music, concerts, videos, and pictures with the ...
Read more

TPS 06 - Katedra základov a vyučovania Informatiky, FMFI ...

Zdroje: Zimanová, R.: Pedagogický softvér. Rigorózna práca, FMFI UK Bratislava 2001. články o Piagetovi a genetickej epistemológii, pozri nižšie
Read more

Prednaska-03.png :: Náboženská obec

Farní úřad. Farář PaedDr. Zdeněk Kovalčík Štefánikova 6305, Zlín 76001. 577 439 597, 737 475 945 . noccsh.kov@seznam.cz
Read more

Fakulta strojního inženýrství VUT v Brn ě

ZEM_prednaska03 - Měření neelektrických veli čin ZEM_prednaska04 - Zpracování snímaného signálu.
Read more

Ústav konstruování Diagnostickésystémy -ZDI -

ZDI_prednaska03 – Vibroakustická diagnostika ZDI_prednaska04 – Tribodiagnostika stroj ...
Read more

3. p řednáška (Drobná p

prednaska03.mws Author: Petr Created Date: 2/21/2012 10:12:47 AM ...
Read more