S1 1 Architetture Tecnologie Web V12 [modalità compatibilità]...Java Servlet • Ciclo di vita di...

INGEGNERIA DEL SOFTWARE

Paolo Salvaneschi

Università di BergamoDip. di Ingegneria gestionale, dell'informazione e della produzione

S1TecnSoft Internet Paolo Salvaneschi 1

S1_1 V1.2

Architetture e tecnologie Web

Il contenuto del documento è liberamente utilizzabile dagli studenti, per studio personale e per supporto a lezioni universitarie.Ogni altro uso è riservato, e deve essere preventivamente autorizzato dall’ autore.

Sono graditi commenti o suggerimenti per il miglioramento del materiale

• Tecnologie

– Pagine Web statiche (HTML,CSS)

– Scripting lato client, JavaScript (DHTML)

– Java Applet

INDICE


– CGI

– Java Servlet

– Java Server Pages

– Connessione con i Data Base

– Ajax

• Tecnologie

• Nomenclatura:

Tecnologie

Linguaggio es. Java


Tecnologia es. JSP

Esempio di Strumento es. Tomcat

• Pagine Web statiche (HTML,CSS)

• Pagine Web dinamiche lato Client

– Scripting lato client, JavaScript (DHTML)

– Java Applet

Tecnologie


– Java Applet

• Pagine Web dinamiche lato Server

– CGI

– Servlet, JSP

– Connessione con i Data Base

Pagine Web statiche (HTML,CSS)

BrowserHTML

ClientServer

HT

Server

Data baseHTTP


HTMLCSS

TTPD

Sistema Informativo

HTTP

Apache Microsoft Internet ExplorerMozilla Firefox


BrowserHTML

HT

Richiesta HTTP

GET /paginaxx.htm HTTP/1.1…

<html> <body><a href=“http://www.pippo.it/paginaxx.htm”>chiedi pagina xx</a></body></html>

File Paginaxx.htm

http://www.pippo.it:80/….


HTMLCSS

ClientServer

TTPD

HTTP/1.1 200…<html><head><title>Paginaxx</title>...</body></html>

Risposta HTTP



http://httpd.apache.org

• Pagine Web statiche

– Server di documenti ipermediali

– Distribuzione di documenti codificati in HTML

– Separazione della struttura dalla



– Separazione della struttura dalla presentazione (CSS)


<html>

<head><title>La prima pagina Web di Mario Rossi</title><link type="text/css"

rel="Stylesheet" href="Es2_css_esterno.css"></head>

h1{font-family: Arial;font-size: 20pt;color: blue;font-weight: bold;}

CSS


<body><h1>Home page di Mario Rossi</h1><p>Questa è la mia prima pagina in HTML.</p><h1>Intestazione di primo livello</h1><h2>Intestazione di secondo livello</h2><h3>Intestazione di terzo livello</h3>…

Scripting lato client, JavaScript (DHTML)

BrowserHTML

ClientServer

HT

Server

Data baseHTTP


HTMLCSS

JavaScript

TTPD

Sistema Informativo

HTTP


• Pagine Web dinamiche (DHTML)

• Insieme di tecnologie che permettono di modificare le pagine HTML caricate nel browser senza interagire con il server



– Es. modifica della formattazione a seguito di interazione con l’utente

– Es. controllo dell’input

• HTML+CSS+Java Script

– Integrazione di procedure interpretate nella pagina HTML ; Esecuzione lato client

– Gestione eventi ed interazione locale con l’utente



l’utente

– Definizione oggetti e attributi (DOM Document Object Model) componenti la pagina e modificabilità da programma

<HTML><HEAD><TITLE>javascript</TITLE>

<SCRIPT language="JavaScript">function presenta(){alert("Sei mai stato in cima all'Adamello?")}


Scripting


{alert("Sei mai stato in cima all'Adamello?")}</SCRIPT>

</HEAD>

<BODY bgcolor="#FFFF00"><BR><BR><BR><BR><IMG src="..\immagini\ada_sal.jpeg" onmouseover="presenta()">

</BODY></HTML>

Gestore degli eventi

<HEAD><SCRIPT language="JavaScript">function uno(){document.all.container1.style.visibility="visible";document.all.container2.style.visibility="hidden";}function due(){document.all.container1.style.visibility="hidden";document.all.container2.style.visibility="visible";}


DOM

Scripting


document.all.container2.style.visibility="visible";}</SCRIPT>

…


…<STYLE type="text/css">#container1 {

position:absolute;top: 2in;left: 2in;width: 2in;visibility: visible;}

<BODY><DIV id="container1">

<IMG src="..\immagini\ada_sal.jpeg"width="300" height="300" onmouseover="due()">

<P><b>l'Adamello da sud</b></P></DIV><DIV id="container2">

Eventi


}#container2 {

position:absolute;top: 2in;left: 2in;width: 2in;visibility: hidden;}

</STYLE></HEAD>

<DIV id="container2"><IMG src="..\immagini\ada_lobbie.jpeg"

width="300" height="300" onmouseout="uno()"><P><b>Le Lobbie da Nord</b></P>

</DIV>

</BODY></HTML>

CSS

Java Applet

BrowserHTML

ClientServer

HT

Server

Data baseHTTP


HTMLCSS

Applet Java

TTPD

Sistema Informativo

HTTP

Apache Microsoft Internet ExplorerMozilla Firefox(Java Virtual Machine)

<HTML><HEAD><TITLE>A Clock (1.6)</TITLE></HEAD><BODY> <h1>A Clock (1.6)</h1><applet code="Clock.class"width="170" height="150"><param name="bgcolor" value="000000">

Inserimento oggetto


<param name="bgcolor" value="000000"><param name="fgcolor1" value="ff0000"><param name="fgcolor2" value="ff00ff"></applet></BODY></HTML>

CGI

Browser

ClientServer

HT

Server

Data baseHTTP

Linguaggio di CGI


TTPD

Sistema Informativo

HTTP


di Programmaz.C, Java, Perl

…

CGI

CGI

http://www.pippo.it

Setup del Web server:c:\ilmioserver è la directory radice

Quando il server riceve unarichiesta corrispondente all’URL


richiesta corrispondente all’URL http://www.pippo.itcerca un file di default nella directory radice(index.html, index.htm, default.html, default.htm).

Ad ogni richiesta di pagina (http://www.pippo.it/paginax.htm)Il server trasmette la pagina.

CGI

Nella directory radice è creata una directory cgi-bin.

Quando il server riceve una richiesta di un file in cgi-bin


non serve il filema lo manda in esecuzione eserve l’output dell’esecuzione.

CGI

#include <stdio.h>int main(){

HTTP/1.1 200…Content-type: text/html...

<html> <body><a href=“http://www.pippo.it/ilmioserver/cgi-bin/esempio.cgi”>attiva cgi</a></body></html>


int main(){ printf("Content-type: text/html\n\n"); printf("<html>\n"); printf("<body>\n"); printf("<h1>Hello there!</h1>\n"); printf("</body>\n"); printf("</html>\n"); return 0;

}

...

<html> <body><h1>Hello there!</h1></body></html>

CGI

#include <stdio.h>int main(){ Il programma può includere

<html> <body><a href=“http://www.pippo.it/ilmioserver/cgi-bin/esempio.cgi”>attiva cgi</a></body></html>


Il programma può includerequalsiasi procedurache accede a banche dati o interagisce con il sistema informativo esistentereturn 0;

}

…

• Invio di dati– Metodo GET

– Nomi e valori sono appesi alla URL

– Metodo POST

CGI

http://nome.server/cgi.bin/programma?nome=valore&nome=valore…


– Metodo POST

– Nomi e valori sono nel corpo del messaggio

nome=valore&nome=valore…

CGI

• Raccolta dati da client via form

• Method (POST | GET) (case insensitive):

identifica il metodo HTTP utilizzato per trasmettere i dati della form

• Action: indirizza l’applicazione che elabora i dati


…<body><form method="POST"action="http://nome.server/cgi.bin/programma">………………………….</form></body>…

• Variabili di ambiente– Il programma attivato

può accedere ad un insieme di varabili di ambiente

CGI

•… •CONTENT_LENGTH •CONTENT_TYPE •GATEWAY_INTERFACE •HTTP_ACCEPT •HTTP_USER_AGENT •PATH_INFO •PATH_TRANSLATED

Contiene i dati passati dal client


•PATH_TRANSLATED •QUERY_STRING •REMOTE_ADDR •REMOTE_HOST •REMOTE_IDENT •REMOTE_USER •REQUEST_METHOD •SCRIPT_NAME •SERVER_NAME •SERVER_PORT •…

Contiene il metodo usato: GET o POST

Contiene i dati passati dal clientcon il metodo GET

• Limiti– Ogni richiesta al server via CGI genera un

processo che termina a fine elaborazione

– Se il programma attivato via CGI contiene un accesso a DataBase, ogni volta sarà aperta e

CGI


accesso a DataBase, ogni volta sarà aperta e chiusa una connessione al DBMS

– Utilizzo di risorse elevato � problemi di scalabilità

Tecnologie

BrowserHTML

ClientServer

HT

Server

Data baseHTTP

Linguaggio di CGI

Integrazione delle tecnologie


HTMLCSS

JavaScriptJava Applet

TTPD

Sistema Informativo

HTTP


di Programmaz.C, Java, Perl

…

CGI

Java Servlet

Browser

ClientServer

HT

Server

Data baseHTTPJava

Application Server


TTPD

Sistema Informativo

HTTP


JavaServlet

TomcatWebsphere

Tomcat

Java Servlet


http://jakarta.apache.org

Java Servlet

• Servlet– Oggetti Java particolari che sono caricati ed

eseguiti dal web server che li utilizza come proprie estensioni.

– Il web server mette a disposizione delle Servlet


– Il web server mette a disposizione delle Servlet un “container” che si occupa della gestione dell’ambiente all’interno delle quali le servlet girano.

– Il “container” passa i dati dal client verso le servlet e viceversa.

Java Servlet

• Package javax.servlet– Package di base delle Servlet API

– Contiene le classi per definire Servlet standard indipendenti dal protocollo.

– Una Servlet generica è una classe definita a


– Una Servlet generica è una classe definita a partire dall’interfaccia Servlet contenuta all’interno del package javax.servlet.

Java Servlet

• Package javax.servlet.http– Le classi del package estendono le funzionalità

di base di una servlet supportando tutte le caratteristiche della trasmissione di dati con protocollo http compresi cookies


protocollo http compresi cookies

Java Servlet

• Ciclo di vita di una Servlet– Una servlet è caricata e inizializzata dal web

server al momento della prima richiesta http da parte di un client o al momento dell’avvio del servizio.


servizio.

– All’inizializzazione la servlet può, se il caso, aprire una connessione con un DataBase (connessione che resta aperta per servire più richieste del client).

Java Servlet

• Ciclo di vita di una Servlet– La servlet esegue le richieste del client.

Per ogni richiesta è creato un thread.


– La servlet rilascia le risorse ed è distrutta

HelloWorldServlet.java….import javax.servlet.* ;import javax.servlet.http.* ;public class HelloWorldServlet extends HttpServlet{

public void service (HttpServletRequest req, HttpServletResponse res)throws ServletException, IOException{

res.setContentType(“text/html”);ServletOutputStream out = res.getOutputStream();

Metodo invocato al momento dell’ arrivo di unarichiesta da parte di un client

Java Servlet


ServletOutputStream out = res.getOutputStream();out.println(“<html>”);out.println(“<head><title>Hello World</title></head>”);out.println(“<body>”);out.println(“<h1>Hello World</h1>”);out.println(“</body></html>”);

}}

Java Server Pages

Browser

ClientServer

HT

Server

Data baseHTTPJava

Application Server


TTPD

Sistema Informativo

HTTP


JavaJSP

TomcatWebsphere

Java Server Pages

• Java Server Pages (JSP)– Pagina di testo HTML che include codice java

– Pagina dinamica che è eseguita lato server e restituisce HTML al client


Java Server Pages

• Scripting lato client– Scopo: rendere dinamica l’interfaccia utente

– Cambiare a seguito di eventi la presentazione

– Gestire l’input dell’utente

– …


• Scripting lato server– Scopo: connettersi a programmi e basi dati e

modificare di conseguenza la pagina inviata

Java Server Pages

• Java Server Pages (JSP)– Il server utilizza la pagina JSP come una servlet

– Al momento del primo accesso la pagina JSP è trasformata in un file Java e compilata ottenendo una classe Java che rappresenta una servlet di tipo HttpServlet che crea una pagina html e la invia al client.


Java Server Pages

• Java Server Pages (JSP)– Possibile integrazione tra servlet e JSP: il client

invia una richiesta ad una servlet che invia gli oggetti prodotti ad una JSP la quale genera l’HTML e lo invia


l’HTML e lo invia

• JSP: View

• Servlet: Controller

• Componenti Java: Model

esempio1.jsp

<html><body><h1> Informazioni sulla richiesta http </h1><br>Metodo richiesto : <%= request.getMethod() %>

Espressioni :iniziano con la sequenza dicaratteri “<%=” e terminano con la sequenza “%>”Utilizzate per aggiungere alla risposta httpil risultato dell’esecuzione di un’espressione di scripting

Java Server Pages


Metodo richiesto : <%= request.getMethod() %><br>URI : <%= request.getRequestURI() %><br>Protocollo : <%= request.getProtocol() %><br><body></html>

Esempio2.jsp<html>

<body><% for(int i=0; i<10; i++) {

if(i%2==0) {%>

<h1>Pari</h1>

Scriptlet:iniziano con la sequenza “<%”, terminano con la sequenza “%>“

Java Server Pages


<h1>Pari</h1><% } else { %>

<h2>Dispari</h2><%

}}

%><body>

</html>

Possibilità si spezzare il codice Java contenuto all’ interno delle scriptlet per darmodo al programmatore di non dover fonderetag html all’interno del sorgente Java.

Java Server Pages

• Applicazioni Web servite da Tomcat

• Container– Metodo standard di installazione e packaging delle

risorse che compongono un’applicazione (pagine JSP, pagine statiche, classi java,…). Files disposti


JSP, pagine statiche, classi java,…). Files disposti in una gerarchia definita all’interno di un archivio WAR (Web archive)

– Archivio .jar (.zip)

– Cartella di file system

Java Server Pages

– Descrittore dell’installazione (file XML)

– Contesto servlet

associato ad un context path utilizzato per raggiungere l’applicazione a cui inviare le richieste


Java Server Pages

Applicazioneservita da Tomcat


Installazione di Tomcat


<html><head><title>Search in Employee Database</title></head><body bgcolor="white">Inserire il valore di uno o più campi.<form action="find.jsp " method="get"><table><tr><td>Nome:</td><td><input type="text" name="firstName"></td></tr><tr> <td>Cognome:</td>

Lettura da DataBase

Applicazione


<tr> <td>Cognome:</td><td><input type="text" name="lastName"></td></tr><tr><td>Divisione:</td><td><input type="text" name="dept"></td></tr><tr><td><input type="submit" value="Cerca"></td></tr>

</table></form>

</body></html>

Lettura da DataBase

<%@ taglib prefix="sql" uri="http://java.sun.com/jstl/sql" %><%-- Execute query, with wildcard characters added to the parametervalues used in the search criteria--%><sql:query var="empList" scope="request">SELECT * FROM Employee WHERE FirstName LIKE ?AND LastName LIKE ?AND Dept LIKE ?

ORDER BY LastName%carl% �� giancarlo, carletto,…

Vedi NOTA


ORDER BY LastName<sql:param value="%${param.firstName}%" /><sql:param value="%${param.lastName}%" /><sql:param value="%${param.dept}%" />

</sql:query><jsp:forward page="list.jsp" />

Nota: se il campo firstName della form è vuoto, la query diventa… WHERE FirstName LIKE %null%(LIKE qualsiasi stringa)

(LIKE ‘ab%ba_’ : qualunque stringa che inizia con ab e ha ba prima dell’ultima posizione)

? Segnaposto

Le istruzioni <sql:param sostituiscono nell’ordine i segnaposto

Lettura da DataBase

<%@ page contentType="text/html" %><%@ taglib prefix="c" uri="http://java.sun.com/jstl/core" %><%@ taglib prefix="sql" uri="http://java.sun.com/jstl/sql" %><html><head><title>Ricerca da DataBase</title>

</head><body bgcolor="white">


<body bgcolor="white">

<c:choose><c:when test="${empList.rowCount == 0}">Nessun impiegato è stato trovato

</c:when>…….

Nota:empList è disponibilepoiché è nello scope requestLa pagina è stata attivatacon forward (stessa request)

Lettura da DataBase

<c:otherwise><p>Sono stati trovati i seguenti impiegati:</p><table border="1"><th>Nome</th><th>Cognome</th><th>Divisione</th><th>Data di assunzione</th><th>Email</th><c:forEach items="${empList.rows}" var="row"><tr><td><c:out value="${row.FirstName}" /></td><td><c:out value="${row.LastName}" /></td>


<td><c:out value="${row.LastName}" /></td><td><c:out value="${row.Dept}" /></td><td><c:out value="${row.EmpDate}" /></td><td><c:out value="${row.EmailAddr}" /></td>

</tr></c:forEach>

</table></c:otherwise>

</c:choose></body></html>

Nomi dei campi nel DB

Lettura da DataBase

• NOTA

• Elementi di azione personalizzataSpecifica e ambiente di sviluppo per realizzare nuove azioni personalizzate (nuove tag library)

• JSTL (Java Standard Tag Library)


Librerie predefinite di azioni

<c: Core

<x: Elaborazione XML

<fmt: Formattazione e internazionalizzazione

<sql: Accesso a database

Connessione con i Data Base

ClientServer

HT

Server

Data JDBCS


TTPD

Database

JDBC

(ODBC)

SQL

Connessione con i Data Base

• ODBC (Open DataBase Connectivity)– Standard internazionale di accesso a Database

Relazionali

• JDBC


– Interfaccia ad oggetti java di accesso a sorgenti di dati

– Connessa ai singoli driver di DataBase attraverso una interfaccia nativa o attraverso un ponte verso ODBC

Ajax

• L’aggiornamento di dati su una pagina web richiede di ricaricare la pagina

• AJAX (Asynchronous JavaScript and XML )

– Lato client– Utilizza XMLHttpRequest, CSS, DOM, e JavaScript


– Il componente Ajax (JavaScript) è incorporato nella pagina web e, invocato da eventi, esegue richieste http ad un server.

– La risposta, scritta in XML, è utilizzata per modificare in modo asincrono parte della pagina senza ricaricarla completamente.

J2EE


S1 1 Architetture Tecnologie Web V12 [modalità compatibilità]...Java Servlet • Ciclo di vita di...

Documents

Transcript of S1 1 Architetture Tecnologie Web V12 [modalità compatibilità]...Java Servlet • Ciclo di vita di...