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

queryecho "<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

Ajaxfunction 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;

return xmlhttp;

}

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

Ajaxfunction 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