Progettazione e sviluppo di applicazioni
web 2.0 con PHP e Ajax
Sommario

Definizione del web 2.0

Caratteristiche dei siti web 2.0

Infrastrutture tecnologiche

La piramide del web 2.0

Esempi di siti web 2.0
Sommario

PHP - Storia

PHP – Significato dell'acronimo

PHP - Caratteristiche

PHP – Esempio

PHP – Stringhe

PHP – Array

PHP – Funzioni interne
Sommario

PHP – MySQL

PHP – MySQL - Connessione

PHP – MySQL – Query

PHP – MySQL – Risultato di query

PHP – MySQL – Altre funzioni

PHP – Framework

PHP – Sicurezza
Sommario

Ajax

Ajax – JSON

WebLogiX

STOOPHP

STOOPHP - Prospettive
Definizione del web 2.0


”Web 2.0” indica una nuova generazione di siti
web che cercando di coinvolgere maggiormente
l'utente
Non si tratta spesso di nuove tecnologie ma di
un modo diverso di utilizzare tecnologie già
esistenti
Caratteristiche dei siti web 2.0



Dinamicità dei contenuti aggiornabili senza la
necessità di dover conoscere HTML, FTP
Interfaccie ricche che cercano di portare
l'esperienza desktop sul web
Grafica accattivante: il web 2.0 significa
comunicazione e business
Caratteristiche dei siti web 2.0


Pubblicità inerenti al contesto (Adsense)
Organizzazione dei contenuti in base alla loro
popolarità anziché tassonomia

Syndication

Social bookmarking

Ottimizzazione per motori di ricerca
Infrastrutture tecnologiche

Linux

Apache (o Lighttpd)

Mysql

PHP (o Ruby, Python)

in una parola sola LAMP
Infrastrutture tecnologiche

XHTML

CSS

Javascript per comunicazioni asincrone (Ajax)

... a questo punto occorre solo convincere i
navigatori ad utilizzare un browser che rispetti
gli standard e aggiornato.
La piramide del web 2.0
Esempi di siti web 2.0

Youtube

Flickr

Digg

Wikipedia

... qualsiasi blog
Web 2.0

I siti web 2.0, compresi quelli citati, sono
dinamici sotto tutti i punti di vista, anche
laddove non dovrebbero esserlo, cioè nel
codice: sono siti che rimangono sempre in beta
Web 3.0

Il Web 2.0 è quindi un fenomeno di
comunicazione e marketing supportato dalla
programmazione web a cui molti non sono
ancora abituati, ma occorre farlo in fretta perché
le sfide del Web 3.0 incombono
Web 3.0



GGG Giant Global Graph – più interattività tra i
siti
Connettività a banda ”larghissima” da qualsiasi
apparecchio
Navigazione in 3 dimensioni stile ”Second Life”
PHP
PHP - Storia



Inizialmente sviluppato da Rasmus Lerdorf
come serie di script CGI
Al progetto si unirono Zeev Suraski e Andi
Gutmans che ne scrissero l'interprete Zend
Oggi è alla versione 5 e può essere usato
anche per shell script e applicazioni stand-alone
PHP – Significato dell'acronimo


Si tratta di un acronimo ricorsivo e ”oggi” sta per
PHP: Hypertext Preprocessor
Lerdorf non ne ha comunicato il significato
originario, che secondo la tradizione sembra
essere Personal Home Page
PHP - Caratteristiche

Sintassi basata sul C

Tipizzazione debole


Orientato agli oggetti (in particolare dalla
versione 5)
Alto livello di astrazione
PHP – Caratteristiche



Le variabili hanno il prefisso $ e ciò le permette
di essere utilizzate all'interno di stringhe. Alcune
sono predefinite
$_GET: array che contiene le variabili passate
alla pagina
$_POST: array che contiene variabili
provenienti da from
PHP – Esempio
<?php
if (strpos($_SERVER['HTTP_USER_AGENT'], 'MSIE') !== FALSE) {
?>
<h3>strpos() must have returned non-false</h3>
<p>You are using Internet Explorer</p>
<?php
} else {
?>
<h3>strpos() must have returned false</h3>
<p>You are not using Internet Explorer</p>
<?php
}
PHP - Esempio



strpos è una funzione una stringa in un'altra
In questo caso è stata cercata la stringa MSIE
all'interno di una variabile predefinita, cioé
$_SERVER['HTTP_USER_AGENT'],che
identifica il browser dell'utente
A seconda del risultato, vengono mostrate due
porzioni di HTML differenti
PHP – Stringhe

Anche se permane la libertà di trattare le
stringhe a basso livello come in C, possiamo
avvalerci di numerose funzioni per la ricerca, la
sostituzione, il padding, la formattazione,
l'hashing, la trattazione di HTML...
PHP – Array

La libertà sugli array è totale: possiamo usare
qualsiasi tipo di variabile per gli indici, qualsiasi
tipo di variabile per i valori, e mescolare i tipi
PHP – Array
<?php
$arr = array("foo" => "bar", 12 => true);
echo $arr["foo"]; // bar
echo $arr[12];
?>
// true
PHP - Array


Per eseguire dei cicli sugli elementi di un array,
non dobbiamo preoccuparci delle dimensioni,
grazie al costrutto foreach, che per ogni
elemento dell'array permette di eseguire degli
statement
Ad ogni ciclo abbiamo a disposizione l'indice e il
valore, in variabili con scope limitato
PHP – Array
foreach (array_expression as $value)
statement
foreach (array_expression as $key => $value)
statement
PHP – Array

Anche per gli array sono presenti numerose
funzioni per eseguire ricerche, sostituzioni,
operazioni di tipo insiemistico, e per trattare gli
stack
PHP – Funzioni interne


In PHP sono già presenti diverse funzioni per
accedere a decine di database, collegarsi a
server FTP, elaborare immagini
Il primo livello di espansione del linguaggio è
dato da PECL, insieme di librerie scritte in C
che spesso vengono incorporate nelle
successive release di PHP
PHP - MySQL


In PHP 4 le funzioni per accedere al database
MySQL erano incorporate al linguaggio: era
ovvio che le persone interessate a PHP erano
interessate anche a questa caratteristica
In PHP 5 occorre abilitare il supporto in fase di
compilazione o caricare il relativo modulo a
runtime, per incompatibilità di licenze
PHP – MySQL


In PHP è stato scritto un ottimo client per
MySQL, PHPMyAdmin, che fornisce
un'interfaccia grafica per la gestione completa
del database
Ovviamente occorre avere un webserver sulla
stessa macchina in cui è in esecuzione il
servere MySQL
PHP – MySQL - Connessione
<?php
$link = mysql_connect('mysql_host', 'mysql_user',
'mysql_password')
or die('Could not connect: ' . mysql_error());
echo 'Connected successfully';
mysql_select_db('my_database') or die('Could not select
database');
?>
PHP – MySQL – Query
<?php
$query = 'SELECT * FROM my_table';
$result = mysql_query($query) or die('Query failed: ' .
mysql_error());
?>
PHP – MySQL – Risultato di
query
echo "<table>\n";
while ($line = mysql_fetch_array($result, MYSQL_ASSOC)) {
echo "\t<tr>\n";
foreach ($line as $col_value) {
echo "\t\t<td>$col_value</td>\n";
}
echo "\t</tr>\n";
}
echo "</table>\n";
PHP – MySQL – Altre funzioni


mysql_affected_rows: restituisce il numero di
righe che sono state prese in considerazione
nell'ultima query eseguita
mysql_insert_id: restituisce l'ultima chiave
generata se abbiamo eseguito una query di
inserimento su una tabella che ha l'opzione
auto_increment
PHP – Framework


Al giorno d'oggi negli ambienti di produzione è
prassi interporre un livello di astrazione tra PHP
e il programmatore, cioè un framework
Il framework ufficiale è PEAR. Uno dei più
utilizzati è Symphony
PHP – Sicurezza


Occore prestare attenzione agli attacchi di SQL
Injection, Form Injection, Variable Injection.
Fondamentale controllare le variabili che
arrivano dai form, esposti a tutti
Ajax

Ajax è il nome nuovo introdotto dal web 2.0, ma
non si tratta di un nuovo linguaggio di
programmazione, piuttosto di una tecnica:

Asynchronous

Javascript

and XML
Ajax


Il Javascript è una vecchia conoscenza del
web, introdotta da Netscape ed in seguito
adottata da tutti i browser
Spesso i webmaster del Web 1.0 ne abusavano
e molti utenti infastiditi da popup e alert lo
disattivavano
Ajax


Tuttavia se Javascript viene usato bene può
arricchire l'esperienza del navigatore e
alleggerire il carico di lavoro del server
Infatti mentre PHP viene interpretato dal server,
Javascript viene interpretato dal browser
Ajax


La rivoluzione iniziò quando i sviluppatori di
browser iniziarono a includere in Javascript un
oggetto capace di effettuare richieste in HTTP
al server, in maniera trasparente all'utente
Originariamente tale oggetto era stato pensato
per ottenere documenti XML
Ajax
function CreateXmlHttpReq(handler) {
var xmlhttp = null;
try {
xmlhttp = new XMLHttpRequest();
} catch(e) {
try {
xmlhttp = new ActiveXObject("Msxml2.XMLHTTP");
} catch(e) {
xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
}
}
xmlhttp.onreadystatechange = handler;
Ajax


Una volta ottenuti dei dati XML tramite richiesta
PHP, è possibile cambiare certe parti della
pagina già caricata utilizzando le capacità di
Javascript di modificare gli elementi del DOM
Questo in sintesi è Ajax
Ajax
function myHandler() {
if (myRequest.readyState == 4 && myRequest.status == 200) {
alert(myRequest.responseText);
}
}
function esempio3() {
myRequest = CreateXmlHttpReq(myHandler);
myRequest.open("GET","primo.php");
myRequest.send(null);
}
Ajax


Tuttavia non siamo obbligati a richiedere un
documento XML, possiamo richiedere
frammenti di HTML, testo semplice
Possiamo richiedere documenti statici ma
anche documenti generati da PHP in base a
nuove indicazioni fornite dall'utente
Ajax – JSON


JSON è un formato di codifica che permette in
un linguaggio di programmazione di trasformare
ad esempio un array in una stringa da
decodificare in un altro linguaggio
In questo modo possiamo richiedere con Ajax
una stringa JSON generata da PHP e
convertirla in un array in Javascript
Ajax

Questi esempi di Ajax provengono dal
documento ”Spaghetti Ajax” di Salvatore
Sanfilippo, uno dei primi italiani a trattare
questa tecnologia
Ajax


Ci sono diversi framework Javascript che
permettono di astrarre Ajax, come Prototype, e
altri che arricchiscono l'interfaccia, come
Scriptaculous
Vedere anche mootools e jquery
Problematiche

Latenza della comunicazione

Javascript è interpretato quindi non è veloce

Diversa mentalità di programmazione
(asincrona)
WebLogiX


La WebLogiX è una ditta individuale che si
occupa di sviluppo di applicazioni web
Tutte le applicazioni si basano su un framework
sviluppato in proprio, STOOPHP, che fa uso di
programmazione ad oggetti e di Ajax
STOOPHP



Con STOOPHP la progettazione
dell'applicazione è limitata alla progettazione
del database
In base alle relazioni tra le tabelle vengono
creati elenchi e form
Unica condizione: il database deve essere
progettato con DBDesigner
STOOPHP

In questo modo il cliente che ha commissionato
il sito può gestire le sue attività commerciali,
turistiche, divulgative e i contenuti del sito
stesso senza accedere in FTP o al database
STOOPHP


La pagina di gestione è unica e tramite Ajax
viene aggiornata in base alle richieste
dell'utente
I costi di sviluppo sono abbattuti e lo stesso
codice utilizzato da più clienti segnala al
programmatore i bug in maniera trasparente
STOOPHP - Prospettive

Scrivere documentazione per sviluppo e uso

Realizzare un sistema di update attraverso SVN

Ottimizzare le prestazioni
STOOPHP - Prospettive



Studiare in maniera approfondita la sicurezza
Riorganizzare il codice in base all'evoluzione di
PHP
Migliorare la procedura di setup, creando uno
strumento di progettazione database che segua
lo standard creato