Sei sulla pagina 1di 30

Tecnologie Web (6 cfu) Prof. G.

Ruffo

PHP Case Study: Photogallery

Tecnologie Web (6 cfu) Prof. G. Ruffo

Caso di studio: galleria di immagini


!! Creeremo unapplicazione web dinamica per gestire una galleria di immagini:
!! Tramite una pagina indice, !! la visualizzazione di ciascuna singola immagine !! Navigazione tra le immagini

!! Si suppone che le immagini siano gi presenti e memorizzate in una sottocartella

Tecnologie Web (6 cfu) Prof. G. Ruffo

Cosa impareremo
!! generazione dinamica del contenuto delle pagine; !! generazione dinamica di link; !! funzioni di accesso al filesystem del server; !! funzioni di ricerca su stringhe; !! invio di dati alle pagine attraverso query specificate nellURI; !! invio di file attraverso form (X)HTML.

Tecnologie Web (6 cfu) Prof. G. Ruffo

Struttura dellapplicazione
!! Semplificazioni:
!! Una sola galleria

!! Visualizzazione:
!! Pagina indice che visualizza miniature di dimensioni predeterminate, e link alle immagini a dimensione normale; !! Pagina di visualizzazione della singola immagine, con collegamenti alle immagini precedente e successiva

!! Le funzioni e informazioni di configurazione sono memorizzate a parte !! (create una dir gallery in Public: tutto andr l)

Tecnologie Web (6 cfu) Prof. G. Ruffo

Schema dellapplicazione

Tecnologie Web (6 cfu) Prof. G. Ruffo

Pagina indice (indice.php)/1


<?php require_once("config.php"); require_once("funzioni.php"); ?> <html> <head><title>.: Gallery Indice :.</title></head> <body> <h1>Gallery: indice delle fotografie</h1> <?php $lista_file = caricaDirectory(DIR_IMMAGINI); if (count($lista_file) > 0) { echo "<table>\n", "\t<tr>\n", "\t\t<td>", generaLinkImmagine(0, $lista_file [0]), "</td>\n";

Tecnologie Web (6 cfu) Prof. G. Ruffo

Pagina indice (indice.php)/2


for ($i = 1; $i < count($lista_file); $i++) { if ($i % $immagini_per_riga == 0) echo "\t</tr>\n\t<tr>\n"; echo "\t\t<td>", generaLinkImmagine($i, $lista_file[$i]), "</td>\n"; } echo "\t</tr>\n </table>\n"; } else echo "\t<p>Non &egrave; presente alcuna immagine</p>\n"; ?> <hr/> <?php include "pie_pagina.php"; ?> </body> </html>

Tecnologie Web (6 cfu) Prof. G. Ruffo

Note: inclusione di file


!! Require_once(): inclusione di file !! metodo per modularizzare la costruzione di pagine
!! elementi ripetitivi, !! parametri di configurazione degli script

!! costrutti:
!! include(nomefile); require(nomefile); (quasi uguali) !! include_once(nomefile); require_once(nomefile);

!! il file nominato viene "inserito" nello script ed interpretato


!! Dentro bisogna sempre usare <?php ?> se c' PHP !! costrutti _once: se il file gi stato incluso, non viene incluso una seconda volta

Tecnologie Web (6 cfu) Prof. G. Ruffo

Note: funzioni varie


!! caricaDirectory(), generaLinkImmagine()
!! funzioni definite dallutente !! Le definiremo poi in funzioni.php, incluso allinizio

!! count($array): numero di elementi in un array !! echo parametri


!! un costrutto e non una funzione: no parentesi tonde! !! simile: print !! nelle stringhe, posso inserire caratteri particolari precedendoli con backslash (/)
!! in particolare, \n= a capo; \" = doppi apici ;

!! die ($messaggio): stoppa lesecuzione emettendo il messaggio

Tecnologie Web (6 cfu) Prof. G. Ruffo

Note: Strutture di controllo


!! blocco di istruzioni
!! istr; oppure { istr1; istr2; ; istrN }

!! condizionale
!! if(cond) istr ; !! if(cond) istr else istr2 ;

!! selezione multipla
!! switch(espr) { case val1:istr1; val2: istr2; valN: istrN }

!! cicli
!! for($i=min;$i<max; $i=$i+incr) istr; !! while(cond) istr; !! (altri)

Tecnologie Web (6 cfu) Prof. G. Ruffo

File di configurazione config.php


<?php // dati di configurazione define("DIR_IMMAGINI", "./immagini"); $immagini_per_riga = 5; $formati_immagine = array(".jpg", ".gif", ".png"); $tipi_immagine = array("image/jpeg", "image/gif", "image/ png"); ?>

Tecnologie Web (6 cfu) Prof. G. Ruffo

Note: costanti
!! define(NOME_COSTANTE,valore) !! Si usano senza segno di dollaro !! Poco usate in PHP perch le variabili sono facili da definire anche implicitamente

Tecnologie Web (6 cfu) Prof. G. Ruffo

Funzioni utili: funzioni.php/1


<?php require_once("config.php"); // funzione che effettua il caricamento dei file presenti nella directory $dir, che soddifano l'espressione regolare $formati function caricaDirectory($dir) { $dh = opendir($dir) or die("Errore nell'apertura della directory ". $dir); $contenuto = array(); while (($file = readdir($dh)) != FALSE) if (!is_dir($file) && controllaFormato($file)) $contenuto[] = $file; closedir($dh); return $contenuto; }

Tecnologie Web (6 cfu) Prof. G. Ruffo

Funzioni utili: funzioni.php/2


// funzione che genera un link verso l'immagine con indice $indice_immagine e testo specificato in $testo_link function generaLinkImmagine($indice_immagine, $file) { return "<a href=\"visualizza.php?immagine=" . $indice_immagine . "\">" . "<img src=\"" . DIR_IMMAGINI . "/" . $file . "\" width=\"80\" height = \"60\"/>" . "</a>"; } function generaLinkTestuale($indice_immagine, $testo = "") { return "<a href=\"visualizza.php?immagine=" . $indice_immagine . "\">" . $testo . "</a>"; }

Tecnologie Web (6 cfu) Prof. G. Ruffo

Funzioni utili: funzioni.php/3


function controllaFormato($nomefile) { global $formati_immagine; foreach ($formati_immagine as $formato) if (strrpos($nomefile, $formato)) return TRUE; return FALSE; // nessun formato trovato } function controllaTipo($tipo) { global $tipi_immagine; foreach ($tipi_immagine as $formato) if (strpos($tipo, $formato)===0) return TRUE; return FALSE; // nessun tipo trovato } ?>

Tecnologie Web (6 cfu) Prof. G. Ruffo

Note: dichiarare funzioni


!! function funzione($arg1, $argN) {istr; } !! Valore di output: return espressione !! Uso: es. $x = funzione($val1, , $valN) !! variabili dichiarate all'interno della funzione, argomenti inclusi: hanno scope locale (non sono disponibili al di fuori) !! variabili definite nello script, al di fuori di funzioni: sono dette globali
!! sono disponibili nella funzione solo se esplicitamente dichiarate global dentro la funzione !! es. global $pippo;

Tecnologie Web (6 cfu) Prof. G. Ruffo

Note: generaLinkImmagine
!! Questa funzione crea un link legato ad una miniatura dellimmagine !! La miniatura per fittizia: limmagine di partenza, ridimensionata tramite gli attributi dellelemento <img>
!! e quindi il browser caricher comunque le immagini intere !! Poco efficiente

Tecnologie Web (6 cfu) Prof. G. Ruffo

Note: Filesystem/1
!! funzioni per la gestione dei files (lettura, scrittura, etc) !! funzioni "base":
!! int fopen ( string filename, string mode [, ])
!! restituisce un puntatore al file o FALSE in caso di fallimento !! filename un file locale o un URI; !! mode=r,r+,w,w+,a,a+ (lettura, sovrascrittura, scrittura alla fine; il + sempre lettura/scrittura)

!! bool fclose ( int fp)


!! TRUE se l'operazione ha successo

!! funzioni booleane is_dir(), is_file(), is_link(), is_readable(), is_writable(), solo per file locali

Tecnologie Web (6 cfu) Prof. G. Ruffo

Note: Filesystem/2
!! (fp il puntatore a un file aperto in lettura)
!! string fgetc ( int fp)
!! restituisce un carattere

!! string fread ( int fp, int length)


!! restituisce fino a length bytes

!! int feof ( int fp)


!! TRUE se siamo alla fine del file

!! (fp il puntatore a un file aperto in scrittura)


!! int fwrite ( int fp, string string [, int length])
!! scrive la stringa sull'output fino ad un max di length bytes

!! int fflush ( int fp)


!! forza la scrittura di tutto l'output su file

!! Su directory:
!! Int opendir(string path), int readdir($fp) legge file per file, FALSE non ce ne sono pi, closedir($fp)

Tecnologie Web (6 cfu) Prof. G. Ruffo

Note: Filesystem/3
!! funzioni che semplificano la vita
!! array file ( string filename [, ])
!! legge il file nominato ed inserisce ogni sua riga in un elemento del vettore restituito

!! int readfile ( string filename [, ])


!! legge il file e lo emette sullo standard output

!! string tempnam ( string dir, string prefix)


!! crea un nome di file temporaneo unico nella dir /tmp

!! da PHP 4.3:
!! string file_get_contents ( string filename [, ])
!! simile a file()

!! (ci sono decine di altre funzioni!)

Tecnologie Web (6 cfu) Prof. G. Ruffo

Note: stringhe
!! Concatenazione di stringhe: . (punto)
!! es. $s = "Lato " . "server" ; !! abbreviato: $s .= "stringa" equiv. $s=$s."stringa

!! strpos(string oggetto, string cercata)


!! restituisce la posizione della prima occorrenza della stringa cercata allinterno della stringa oggetto !! o FALSE nel caso in cui non vi sia alcuna occorrenza. !! ha una funzione sorella stripos() che ignora maiuscole e minuscole

Tecnologie Web (6 cfu) Prof. G. Ruffo

Pagina di visualizzazione visualizza.php/1


<?php include_once("config.php"); include_once("funzioni.php"); if (!isset($_GET["immagine"])) die("Errore: stai cercando di accedere alla pagina in modo scorretto\n"); $immagine = $_GET["immagine"]; $lista_file = caricaDirectory(DIR_IMMAGINI, $formati_immagine); ?> <html> <head> <title><?php echo "Immagine: " . $immagine; ?></title> </head> <body> <?php echo "\t<img src=\"" . DIR_IMMAGINI . "/" . $lista_file [$immagine] . "\"/>\n"; ?>

Tecnologie Web (6 cfu) Prof. G. Ruffo

Pagina di visualizzazione visualizza.php/2


<table> <tr> <?php echo "\t\t\t"; if ($immagine > 0) echo "<td>" . generaLinkTestuale($immagine - 1, "Precedente") . "</td>"; if ($immagine < count($lista_file) - 1) echo "<td>" . generaLinkTestuale($immagine + 1, "Successiva") . "</td>"; ?> </tr> </table> </body></html>

Tecnologie Web (6 cfu) Prof. G. Ruffo

Note
!! Se non si accede passando un parametro immagine via GET, non si visualizza nulla

Tecnologie Web (6 cfu) Prof. G. Ruffo

Inserimento immagini: inserisci.html


<html> <head> <title>.: pwlsGallery inserisci :.</title> </head> <body> <form method="post" action="inserisci.php" enctype="multipart/ form-data"> File da caricare: <input type="file" name="nomefile"/><br/> <input type="submit" name="invia" value="Invia"/> </form> </body> </html>

Tecnologie Web (6 cfu) Prof. G. Ruffo

Inserimento immagini: inserisci.php


<html> <head><title>.: pwlsGallery inserisci :.</title></head> <body> <?php require_once("config.php"); require_once("funzioni.php"); if (!isset($_FILES["nomefile"])) die("File non ricevuto\n"); $tmp_nome = $_FILES["nomefile"]["tmp_name"]; $tipo = $_FILES["nomefile"]["type"]; $nome = $_FILES["nomefile"]["name"]; if (!controllaTipo($tipo)) die("File di tipo sconosciuto\n"); if (move_uploaded_file($tmp_nome, DIR_IMMAGINI . "/" . $nome)) echo "<p>Inserimento effettuato, torna all'<a href=\"indice.php \">indice</a></p>\n"; else echo "<p>Non sono riuscito a spostare il file, controlla i permessi </p>\n"; ?> </body></html>

Tecnologie Web (6 cfu) Prof. G. Ruffo

Note: gestione upload


!! $_FILES una variabile superglobale che contiene gli eventuali files arrivati con lupload (nome, tipo MIME, posizione temporanea) !! move_uploaded_file(): sposta il file temporaneo altrove

Tecnologie Web (6 cfu) Prof. G. Ruffo

Ed ora?
!! Mettete qualche immagine in una directory dentro Public/ gallery
!! Es. immagini

!! Modificate opportunamente (se il caso) il file di configurazione !! Voil! (forse)

Tecnologie Web (6 cfu) Prof. G. Ruffo

Note di sicurezza
!! Cos come , lapplicazione permette a CHIUNQUE di inserire nuove immagini
!! Pericoloso! Finito lesercizio, togliete o rinominate inserisci.php

!! Inclusione di file
!! Se i file inclusi contengono dati sensibili (es. password) bisogna essere certi che non possano essere visualizzati
!! Es. evitare estensioni diverse da .php!

!! Se un file incluso svolge unoperazione destinata solo ad utenti autorizzati, necessario autenticare lutente anche dentro il file incluso e non solo nel file includente
!! Altrimenti il file incluso potrebbe essere richiamato autonomamente da un utente malevolo

!! Visualizzazione delle directory


!! Sul nostro server abilitata per vostra comodit, ma meglio disabilitarla perch d modo di vedere che file ci sono
!! Per esempio, i file inclusi

Tecnologie Web (6 cfu) Prof. G. Ruffo

Esercizi extra
!! Modificare linserimento delle immagini affinch sia possibile solo ad un utente predefinito !! DIFFICILE: Modificare indice.php ed inserimento immagini affinch vengano create automaticamente delle vere miniature, ed utilizzate nella visualizzazione dellindice (almeno per le immagini JPEG)
!! Suggerimento: controllare la documentazione della libreria GD ed in particolare le funzioni getimagesize(), imagecreatefromjpeg(), imagecopyresampled(), imagejpeg()