Laboratorio Di Basi Di Dati 06 Programmazione Web Lato Client

Corso di Basi di Dati e Laboratorio

La programmazione Web
Alfio Ferrara - Stefano Montanelli

A.A. 2005/2006 Basi di Dati e Laboratorio 1

Indroduzione al Web

• Il Web attuale si fonda su un’architettura
gerarchica conforme al modello
client/server (c/s)
• Le macchine server ospitano le
informazioni organizzate in siti Web e le
rendono disponibili ad eventuali richieste di
macchine client
– Tipicamente i client, attraverso un browser,
sottopongono ai server delle richieste HTTP


Web statico e Web dinamico

• I siti Web possono essere di natura statica
o dinamica:
– Statica: l’interazione con l’utente non prevede
forme di elaborazione e interscambio di
informazioni
– Dinamica: con la richiesta di pagine, l’utente
invia informazioni che richiedono al server una
fase di elaborazione e modificano il contenuto
e la forma degli oggetti restituiti


1

Programmazione Web

• Caratteristiche
– Tempi di elaborazione ridotti
– Multiutenza
– Indipendenza dalla piattaforma
– Assenza di stato (condizione stateless)
• Benefici
– Aumento delle capacità di elaborazione
– Interfacciamento di risorse presenti lato server
(database, file system)


Architettura del Web
Richiesta HTTP HTTP Server
Client

La pagina contiene script
NO
lato server?
NO
Gli script richiedono Sì
Sì
connessioni al DBMS?
Interprete del
linguaggio di
scripting
(ASP, PHP, …)
DBMS Server

Programmazione lato client

• Strumenti
– Codice interpretabile da moduli supportati dal
browser (non ha quindi accesso alle risorse
lato server)
• Javascript, VBScript, …
– Oggetti lato client: sono applicazioni compilate
eseguite da moduli del browser detti plugin
• Applet Java, Flash, …


2

Programmazione lato server
• Strumenti
– Pagine server: si tratta di script associati a
pagine Web, spesso embedded, che vengono
interpretati da appositi moduli del server
quando la pagina viene richiesta.
• ASP, JSP, PHP, modPerl, …
– CGI: consente di interfacciarsi con
un’applicazione eseguita o compilata sul
server
• Perl, Python, VB, C, …
– .NET: applicazione compilata sul server ed
eseguita tramite processi dedicati


Interazione con i DBMS

• Il codice lato server è spesso usato per
creare interfacce internet/intranet per basi
di dati, sfruttando diverse modalità di
connessione:
– TCP/IP
– ODBC
– Chiamate RPC


Condizione Stateless

• L’assenza di stati implica la non
persistenza delle informazioni fra le pagine
che compongono l’applicazione. A questo
scopo sono state individuate due soluzioni:
– Sessioni. Memorizzano sul server le
informazioni da mantenere per la persistenza
– Cookie. Delegano al client la conservazione
delle informazioni


3

Questioni critiche

• L’interazione con i DBMS attraverso il Web
accentua alcune problematiche tipiche
delle basi di dati
– Affidabilità
– Efficienza
– Gestione delle transazioni
– Identificazione utenti e sicurezza


Strategia di progettazione

• Una strategia di progettazione di un
applicazione Web è strutturata secondo:
1. Analisi concettuale del dominio
2. Progettazione della base di dati
3. Schema navigazionale
4. Schema delle pagine
5. Generazione delle pagine
La natura di alcune di queste attività
consente parziale sovrapposizione

Analisi concettuale

• Indipendente da scelte implementative
• Vengono utilizzati formalismi che
permettano di modellare gli elementi del
dominio
– Diagrammi ER
– Modelli ODMG
– UML
–…


4

Progettazione BD

• Scelta di un modello (relazionale, oggetti,
logico,…)
• Scelta di un DBMS
• Definizione dello schema, dei vincoli, delle
politiche di sicurezza
• Normalizzazione
• Realizzazione di sezioni amministrative
• Popolamento


Schema navigazionale

• Definizione della struttura del sito, della
mappa, dei percorsi a disposizione degli
utenti per accedere le pagine
• Obiettivi:
– definire criteri di organizzazione dei contenuti
– Facilitare l’accesso alle informazioni
• Considerazioni:
– NON RISPECCHIA NECESSARIAMENTE LO
SCHEMA CONCETTUALE


Schema navigazionale

• Modalità di accesso alle informazioni
– Link
– Mappe
– Menù
–…
• Navigazione personalizzata per livelli di
utenza
– Utenza generica
– Utenza riconosciuta
– Amministrazione


5

Schema delle pagine

• Identificazione di una struttura comune
(griglia) per l’organizzazione dei contenuti
in gruppi omogenei di pagine
• L’utilizzo di griglie facilità la navigazione
mediante impiego di elementi intuitivi e
strutture ricorrenti


Generazione delle pagine

• Identificazione di una tecnologia/strumento
per la generazione delle pagine
• Codifica delle pagine
– Possibile coesistenza di pagine statiche e
dinamiche
• pagine statiche (per contenuti a bassa
obsolescenza)
• dinamiche (per contenuti ad alta obsolescenza)


Strategie alternative

• Approccio metodologico alternativo
– Vi sono applicazioni Web (tipicamente portali)
in cui solo una parte dei contenuti derivano da
una base di dati
– In questi casi un approccio diffuso consiste
nell’iniziare le fasi di progettazione con la
definizione dell’alberatura concettuale del sito
– Verranno differenziate
• Struttura (organizzazione dei contenuti)
• Navigazione (modalità di collegamento fra le pagine)
• Presentazione (layout grafico degli elementi)


6

Confronto di strategie

• La seconda metodologia
– Consente una rapida prototipizzazione di
portali
– Non realizza una chiara distinzione tra
modello concettuale e schema navigazionale
• Maggiore difficoltà in fase di analisi
• Notevoli costi di riprogettazione in caso di modifica
alle modalità di navigazione


Client Side – Applet java

• Miniapplicazione Java progettata per
essere eseguita all’interno di un browser
• Viene attivata in un file HTML con il codice
<applet code=ClassName.class width=xxx
height=yyy>
<param name=ParamName value=ParamValue>
…
<param name=ParamName value=ParamValue>
AlternateContent
</applet>



• Esempio
– Inserire il codice seguente nel file
HelloApp.java
import java.applet.Applet;
import java.awt.Graphics;
import java.awt.Color;

public class HelloApp extends Applet {
Public void paint (Graphics g) {
Color c = new Color(255, 180, 0);
g.setColor(c);
g.fillOval(40,40,100,50);}}
– Compilare con Javac per ottenere
HelloApp.class

7


• Invocazione
– Inserire il codice seguente nel file
HelloApp.html
<html>
<applet code=HelloApp.class width=300
height=100>
</applet>
</html>

– Digitare da shell di comando
appletviewer HelloApp.html

– Caricare HelloApp.html con un browser



• Considerazioni
– Realizzazione di sofisticate interfacce grafiche
– Connessione ed interazione con applicazioni
residenti sull’host del server web (via socket o
RMI)
– Problemi
• Troppe versioni di JVM
• Efficienza
• Sicurezza (necessità di signed applets)


Client Side - Javascript

• Linguaggio di scripting interpretato
• Disponibile anche server side (poco
diffuso)
• Interprete integrato nei browser
• Il codice Javascript è visibile all’utente
• Netscape ha sviluppato Javascript.
– Microsoft ha sviluppato una versione
corrispondente
• Jscript


8

Client Side – Javascript

• Netscape e Microsoft hanno cooperato con
ECMA (European Computer
Manufactorers Association) per creare uno
standard (EcmaScript o Ecma-262)
– Javascript e Jscript supportano tale standard
ma offrono estensioni diverse
– www.ecma.ch


• Esempio
<html><head>
<script type=quot;text/javascriptquot;>
function Fattoriale() {
document.write(quot;<H2>Tabella di
fattoriali</H2>quot;);
for (i=1, fact=1; i<10; i++, fact *=i) {
document.write(i+ quot;!=quot; +fact);
document.write(quot;<br>quot;); }}
</script></head>
<body>
<script type=quot;text/javascriptquot;>
Fattoriale()
</script>
</body></html>



• Caratteristiche
– Case-sensitive
– Javascript è il linguaggio di default se la
clausola type=quot;text/javascript” non è
specificata
– Sintassi in notazione puntata derivata dal
modello ad oggetti
– È buona norma terminare gli statement con “;”


9

– Dichirazione di variabili
• var nomevariabile

– Strutture di controllo
• if/else, while, for, switch, …

– Operatori simili al C
• ==, !=, <=, ++, &&, ||, …



• Funzionalità offerte
– Interazione con l’ambiente di esecuzione client
• Rilevazione della tipologia di browser
function TestBrowser() {
if(navigator.appName==“MSIEquot;)
alert(quot;E' in uso il browser MSIEquot;);
else
alert(quot;E' in uso un browser non
Microsoftquot;); }
• Visualizzazione della data di sistema
• Generazione di nuove finestre con messaggi o
elementi di input


– Gestione di eventi
• <input type=“button” value=“clicca qui”
onClick=“alert(‘Il bottone è stato
premuto’)”>

– Interazione con form HTML
• Controlli di correttezza ed elaborazioni client side
sui valori inseriti nei campi form
– Lettura/scrittura dello stato del client tramite
interazione con i cookie in esso memorizzati


10


• Limitazioni
– Scarse capacità grafiche
– Impossibilità di leggere/scrivere file
– Lo standard non supporta connessioni a
DBMS o ad altri applicativi
• Sicurezza
– Vengono adottate politiche restrittive
– Netscape supporta la possibilità che gli script
richiedano privilegi all’utente
– Gli script possono essere firmati


Client Side – gli oggetti

• E’ possibile includere nelle pagine HTML
degli oggetti che verranno trattati mediante
plugin specifici
– Es. filmati Macromedia Flash
• Considerazioni
– Notevoli potenzialità grafiche
– Scarsa integrazione con altre applicazioni
– Linguaggio di scripting proprietario


Client Side – gli oggetti
• Esempio
<OBJECT WIDTH=quot;450quot; HEIGHT=quot;350quot; ALIGN=quot;quot;>
<PARAM NAME=movie VALUE=quot;eyeFollow.swfquot;>
<PARAM NAME=quality VALUE=high>
<PARAM NAME=bgcolor VALUE=#FFFFFF>
<EMBED src=quot;eyeFollow.swfquot; quality=high
bgcolor=#FFFFFF WIDTH=quot;450quot; HEIGHT=quot;350“
NAME=quot;eyeFollowquot; ALIGN=quot;“
TYPE=quot;application/x-shockwave-flashquot;
PLUGINSPAGE=
quot;http://www.macromedia.com/go/getflashplayerquot;>
</EMBED>
</OBJECT>


11

Laboratorio Di Basi Di Dati 06 Programmazione Web Lato Client

Empfohlen

Empfohlen

Weitere ähnliche Inhalte

Andere mochten auch

Andere mochten auch (20)

Ähnlich wie Laboratorio Di Basi Di Dati 06 Programmazione Web Lato Client

Ähnlich wie Laboratorio Di Basi Di Dati 06 Programmazione Web Lato Client (20)

Mehr von guestbe916c

Mehr von guestbe916c (14)

Laboratorio Di Basi Di Dati 06 Programmazione Web Lato Client