Nástroje a přístupy pro tvorbu webových aplikací

4IZ278 – Webové aplikace

Jirka Kosek

Poslední modifikace: 2024-03-21 20:48:20 UTC

Úvod

Základní principy generování stránek na serveru

  • na serveru je dynamicky generováno HTML na základě požadavku uživatele

  • do prohlížeče je odesílán již jen čistý HTML kód

  • není potřeba žádný speciální prohlížeč, lze použít libovolný se základní podporou HTML

  • v případě potřeby lze na serverem generovaných stránkách použít i klientské technologie (JavaScript)

Technologie pro dynamické generování HTML stránek

  • Server Side Includes (SSI)

  • CGI skripty

  • FastCGI skripty

  • SAPI moduly a filtry

  • Active Server Pages (ASP)

  • PHP

  • servlety

  • Java Server Pages

  • ASP.NET

  • Ruby on Rails

  • Django (Python)

  • node.js

  • … a mnoho dalších, o nichž se ani nezmíníme

SSI

Server Side Includes

  • do HTML kódu se zapisují jednoduché instrukce, které zpracovává přímo webový server

  • to, že se v souboru mají hledat SSI, se pozná podle přípony souboru (obvykle .shtml)

  • syntaxe:

    <!--#příkaz parametry-->

Ukázka

Příklad 1. Vypsání aktuálního času
<!DOCTYPE html>
<html>
<head><title>První pokusný skript</title></head>
<body>
<h1>Aktuální čas: <!--#echo var="DATE_LOCAL"--></h1>
</body>
</html>

Přehled příkazů

#include

načtení externího souboru

#fsize

zjištění velikosti souboru

#flastmod

zjištění času poslední modifikace souboru

#echo

vypsání obsahu proměnné – DATE_GMT, DATE_LOCAL, DOCUMENT_NAME, DOCUMENT_URI, LAST_MODIFIED, QUERY_STRING_UNESCAPED

#exec

spuštění externího programu

#config

nastavení formátu výstupu ostatních příkazů

CGI skripty

Rozhraní CGI

  • CGI – Common Gateway Interface

  • rozhraní definuje způsob komunikace web-serveru s aplikací

  • CGI skript je program, který používá rozhraní CGI

  • CGI skripty lze psát v téměř libovolném jazyce, stačí dodržet konvence rozhraní CGI

    • shell, Perl, C/C++, Pascal, Python, …

  • podpora CGI nebývá implicitní, musí se ve web-serveru zapnout (bezpečnost)

Předávání parametrů přes rozhraní CGI

  • existují dvě metody – GET a POST

  • způsob je určen přímo v HTML formuláři

    <form ... method="post">
    
    <form ... method="get">
  • metody předávání dat jsme již probrali

  • další jazyky způsob předávání dat definovaný poprvé pro CGI převzaly

Ukázky

Příklad 2. Vypsání aktuálního času v C
#include <stdio.h>
#include <time.h>

int main()
{
   struct tm *aktualni_cas;
   time_t aktualni_sekundy;
   char s[80];

   printf("Content-type: text/html\n\n");
   printf("<!DOCTYPE html>
<html>
<head><title>První pokusný skript</title></head>
<body>
<h1>Aktuální čas: ");
   time(&aktualni_sekundy);
   aktualni_cas = localtime(&aktualni_sekundy);
   strftime(s, 80, "%d.%l.%Y %H:%M:%S", aktualni_cas);
   printf("%s", s);
   printf("</h1>
</body>
</html>");
   return 0;}

Ukázky

Příklad 3. Obsluha formuláře v Perlu
#!/usr/bin/perl
use CGI;

print "Content-type: text/html\n\n";
print <<EOF
<!DOCTYPE html>
<html>
<head>
<title>Obsluha formuláře</title>
</head>
<body>
EOF
;

$query = new CGI;
print "Jmenuješ se <em>", $query->param('jmeno'), "</em><br>";
if ($query->param('vek') < 18)
{
    print "a jseš moc mladý na náš bar";
}
else
{
    print "a jsme rádi, že jsi přišel do našeho baru"
}

print <<EOF
</body>
</html>
EOF

Shrnutí

  • výhody:

    • pro psaní skriptů lze použít téměř libovolný jazyk

    • vývojář se nemusí učit nový jazyk

  • nevýhody

    • pro obsluhu každého požadavku je spouštěn nový proces

    • pomalé a náročné na zdroje serveru

    • na více zatížených serverech nelze vůbec použít

FastCGI

FastCGI

  • vylepšená varianta rozhraní CGI, snižuje zátěž serveru

  • každý skript se do paměti načítá jen jednou, pak postupně obsluhuje další požadavky

  • web-server s aplikací komunikuje pomocí TCP/IP

    • web-server a aplikaci je možné rozdělit na samostatné počítače

    • primitivní řešení load-balancingu

Použití FastCGI

  • na rozdíl od CGI, nepodporují FastCGI zdaleka všechny servery

  • aplikace musí používat speciální knihovnu, která implementuje rozhraní FastCGI

    • C, Perl, …

  • ukázka

    use FCGI;
    
    while(FCGI::accept() >= 0)  # čekání na požadavek
    {    
       # obsluha požadavku - stejná jako v případě CGI verze
    }
  • skript je v paměti vykonáván opakovaně, musíme dávat velký pozor na přetečení paměti apod.

  • ve skriptu můžeme používat vlastní čítač, a po určitém počtu obsloužených požadavků skript ukončit, web-server si ho při dalším požadavku sám znovu spustí

SAPI

ISAPI, NSAPI, WSAPI, …

  • v průběhu času začala většina serverů nabízet kromě CGI rozhraní i speciálně přizpůsobené rozhraní

  • dnes nejpoužívanější je ISAPI – podporují ho servery Microsoftu a mnohé další

  • aplikace napsané pro SAPI mají většinou podobu DLL knihoven

  • do paměti se podobně jako FastCGI skripty načtou při prvním požadavku a pak v ní již zůstanou

  • nelze rozdělit aplikaci a web-server

  • SAPI moduly jsou binární nativní kód – pro tvorbu si musíme sehnat vhodný kompilátor

ASP

Active Server Pages

  • přímo do HTML kódu se zapisují jednoduché příkazy

  • ASP je jen jakýsi framework

    • lze použít libovolný jazyk podporující Active Scripting

      • standardně JScript a VBScript

      • třetí firmy dodávají Perl, REXX, Python

    • ve všech jazycích jsou dostupné základní objekty s důležitými informacemi (data z formulářů apod.)

  • standardní součást webových serverů MS

  • podpora jiných serverů a platforem je velice slabá

Možnosti ASP

  • k dispozici máme všechny funkce zvoleného jazyka (bohužel VBScript a JScript jsou poměrně chudé jazyky)

  • sada ASP objektů pro práci s

    • požadavkem – data z formulářů apod.

    • odpovědí – nastavování hlaviček

    • další pomocné objekty – aplikační a session proměnné, …

  • chybějící funkčnost se dodává pomocí COM objektů

    • rychlé – píší se přímo v nativním kódu

    • instalace a správa aplikace není jednoduchá, protože je roztroušená na mnoha místech

Ukázka

Příklad 4. Vypsání aktuálního času v ASP
<!DOCTYPE html>
<html>
<head><title>První pokusný skript</title></head>
<body>
<h1>Aktuální čas: <%= Now() %></h1>
</body>
</html>
  • <% ... %> – blok příkazů

  • <%= výraz %> – vypsání hodnoty výrazu přímo do stránky

Ukázka

Příklad 5. Obsluha dat z formuláře
<!DOCTYPE html>
<html>
<head>
<title>Ukázkový formulář</title>
</head>
<body>
Jmenuješ se <em><%= Request("jmeno")%></em><br>
<%
If Request("vek") < 18 Then
    Response.Write "a jseš moc mladý na náš bar"
Else
    Response.Write "a jsme rádi, že jsi přišel do našeho baru"
End If
%>
</body>
</html>

PHP

Hypertextový preprocesor PHP

  • přímo do HTML kódu se zapisují jednoduché příkazy

  • jednoduchá syntaxe založená na C, Perlu a Javě

  • speciálně navržený jazyk pro tvorbu webových aplikací

  • velmi rozsáhlá knihovna funkcí

  • nezávislost na platformě – může spolupracovat s v podstatě libovolným serverem na libovolné platformě

  • OSS – dostupný zdarma včetně zdrojových kódů

Ukázka

Příklad 6. Vypsání aktuálního času
<!DOCTYPE html>
<html>
<head><title>První pokusný skript</title></head>
<body>
<h1>Aktuální čas: <?php echo Date("r")?></h1>
</body>
</html>
  • pro oddělování příkazů od HTML kódu se používají znaky <?php a ?>

Ukázka

Příklad 7. Obsluha dat z formuláře
<!DOCTYPE html>
<html>
<head>
<title>Ukázkový formulář</title>
</head>
<body>
Jmenuješ se <em><?php echo $_REQUEST["jmeno"]?></em><br>
<?php
if ($_REQUEST["vek"] < 18)
{
    echo "a jseš moc mladý na náš bar";
}
else
{
    echo "a jsme rádi, že jsi přišel do našeho baru";
}
?>
</body>
</html>

Java a webové aplikace

Java servlety

  • servlet je speciální třída zapsaná v jazyce Java

  • servlet je spouštěn v tzv. kontejneru (web server v sobě spustí JVM nebo je přímo napsán v Javě v něm pak běží servlet)

  • podobně jako u ISAPI a FastCGI zůstává servlet po prvním načtení v paměti a obsluhuje další požadavky

Java Server Pages

  • do HTML kódu se zapisují příkazy Javy

  • k dispozici jsou podobně jako v ASP speciální objekty pro čtení dat z formulářů apod.

  • pro lepší oddělení designu a logiky lze definovat „tag libraries“ – uživatelsky definované tagy, které volají předem připravené komponenty

  • o spuštění JSP se stará servlet, který JSP automaticky převede do Javy, zkompiluje do byte-code a spustí

Ukázka JSP

Příklad 8. Vypsání aktuálního času
<%@ page language="java" import="java.text.*, java.util.*" %>
<!DOCTYPE html>
<html>
<head><title>První pokusný skript</title></head>
<body>
<h1>Aktuální čas: <%= new Date() %></h1>
</body>
</html>

Ukázka JSP

Příklad 9. Obsluha dat z formuláře
<!DOCTYPE html>
<html>
<head>
<title>Ukázkový formulář</title>
</head>
<body>
Jmenuješ se <em><%= request.getParameter("jmeno")%></em><br>
<% if (Integer.parseInt(request.getParameter("vek")) < 18) { %>
    a jseš moc mladý na náš bar
<% } else { %>
    a jsme rádi, že jsi přišel do našeho baru
<% } %>
</body>
</html>

ASP.NET

.NET

  • platforma Microsoftu s podobnými principy jako platforma Java

  • aplikace se zdrojových kódů překládá do CIL (Common Intermediate Language) – obdoba javového bytecode

  • o spouštění CIL se stará CLR (Common Language Runtime)

    • před spuštěním je vždy CIL převeden do nativního kódu (obdoba JIT kompilace v Javě)

  • všechny jazyky, které lze kompilovat do CIL (VB.NET, Managed C++, C#, …) používají stejné knihovny (velká změna oproti předchozím verzím jazyků)

    • výborná podpora XML

    • hlavní tři knihovny – webové služby, Web Forms (tvorba webových aplikací), Windows Forms (tvorba „klasických“ aplikací)

ASP.NET

  • s klasickými ASP nemá nic společného (kromě názvu)

  • vyvíjí se jako klasická klientská aplikace – prvky uživatelského rozhraní a obsluha událostí (WebForms)

  • ASP.NET si webový server přeloží do nativního kódu, který se stará o postupné zasílání HTML kódu a obsluhu formulářových dat

  • vygenerovaný kód detekuje použitý prohlížeč a tomu přizpůsobí generovaný HTML a JavaScriptový kód

  • VisualStudio.NET umožňuje aplikace vyvinout pouhým „naklikáním

  • později byly pro ASP.NET vytvořeny další nastavby – např. ASP.NET MVC nebo Razor

Přístupy k návrhu aplikací

„Špagetový kód“

  • HTML kód je promíchán s aplikační logikou (příkazy)

  • nepřehledné a neudržovatelné; zvláště pro větší projekty

  • typické při použití čistého PHP, ASP, JSP

Model-View-Controller (MVC)

  • je oddělena aplikační logika (model), generování výstupů pro uživatele (view) a průběh interakce (controller)

  • velice čistý přístup, aplikace se lépe udržuje

  • oddělené M-V-C znamená více práce a kódu

  • např. J2EE, Spring, ASP.NET MVC, PHP s vhodným frameworkem

Komponentové frameworky

  • aplikace se skládá z vizuálních komponent, které na pozadí generují odpovídající HTML (+JS) kód

  • vývojář je odstíněn od webové platformy (HTML, JS, HTTP, …)

  • např. ASP.NET, JSF, PHP s v hodným frameworkem (např. PRADO)

moderní“ frameworky

  • většinou staví na myšlence MVC, ale nenutí vývojáře psát a definovat věci, které jsou zřejmé

  • např. Ruby on Rails, Django

Výběr technologie

Jak to funguje často v praxi

  • místo pro danou úlohu nejlepšího řešení se vybere:

    • co vývojář zná

    • co se ve firmě už používá

    • pro co je levný hosting

    • co je zrovna moderní

Rychlost provádění aplikací

  • kompilované jazyky – velmi rychlé (pokud se nepoužije pomalé rozhraní jako CGI)

    • C, C++, Pascal, Java, .NET

    • FastCGI, ISAPI, servlety

  • interpretované jazyky – jsou pomalejší

    • Perl, ASP, PHP

    • většina aplikací je jednoduchá a zdržuje je práce s databází – menší výkon většinou nevadí

    • pro některé původně interpretované jazyky postupně vznikají kompilátory (např. HipHop for PHP) nebo virtuální stroje (HVVM pro PHP)

    • rychlost lze zvýšit i udržováním předkompilovaných skriptů v paměti web-serveru

Rychlost vývoje aplikací

  • kompilované jazyky – pomalá

    • po provedení každé změny je potřeba program rekompilovat (pracné a pomalé)

  • interpretované

    • rychlé změny – stačí opravit zdrojový kód a dát v prohlížeči reload

  • rychlý běh aplikací a rychlý vývoj zároveň → JSP, ASP.NET, …

    • programátor pracuje pouze se zdrojovým kódem skriptu

    • o kompilaci se automaticky stará webový server nebo jeho modul

Další zdroje informací

Další zdroje informací