Le diverse strade del File Upload

mar, apr 28, 2009

Per chi fa Web

538794_attachment_1Sono numerosi i blog che parlano di web e di strumenti utili a chi fa web. Ogni giorno la rete si arricchisce di nuove recensioni su centinaia di tool, che aiutano noi sviluppatori a portare a termine i nostri compiti. Uno dei problemi che più spesso ci si trova ad affrontare, è quello di permettere alla nostra applicazione web di caricare uno o più file sul server. Per affrontare questo problema, esistono molteplici possibilità basate su diverse tecnologie client.

Quale che sia la tecnologia client scelta, l’upload di un file si completa sempre con una richesta HTTP al server. Ricapitolando, quindi, per effettuare upload di file via web sono necessari un componente lato server che accetti la richiesta e memorizzi i file trasmessi e un componente lato client che permetta la selezione dei file da caricare, formuli la richiesta ed invii i file al server. È proprio lato client, infatti, che si concentrano le differenze sulle diverse possibilità per effettuare l’upload di un file.

Upload HTML

L’upload HTML è il più semplice e viene effettuato con il classico form HTML. Per effettuare questo tipo di upload la pagina HTML, invia una richiesta POST al server inserendo il file al suo interno.

<form method="post" enctype="multipart/form-data">
 <input type="file" />
</form>

È poi sufficiente uno script lato server che accetti la richiesta e memorizzi il file in un cartella su file system. Eccone un esempio in PHP:

if (! empty($_FILES))
{
   $tempFile = $_FILES['Filedata']['tmp_name'];
   $targetPath = 'upload/path/;               

   move_uploaded_file($tempFile, $targetFile);
}

Questa soluzione è la più semplice e veloce ma ha diversi limiti. Innanzi tutto l’utente non ha la possibilità di visualizzare il livello di completamento durante l’upload ma, soprattutto, non può caricare più file contemporaneamente (il cosiddetto file upload multiplo).

Upload di file compressi

Per permettere all’utente di caricare più file contemporaneamente, alcuni siti web accettano l’upload di file compressi (zip, rar ecc.). In questo modo l’utente può caricare un file compresso che contiene molteplici file. Una volta che il file compresso è stato caricato, lo script lato server lo decomprime e ottiene tutti i file all’interno dell’archivio. Questo metodo è abbastanza semplice e, una volta sviluppato lo script che decomprime il file, permette all’utente di caricare più file contemporaneamente. Rimane comunque il limite di non poter visualizzare il livello di completamento dell’upload. Inoltre, per effettuare l’upload multiplo, l’utente è costretto a comprimere i file da caricare.

Upload in AJAX

Ultimamente la teconologia AJAX (Asynchronous Javascript and XML) si sta consolidando sempre più, grazie soprattutto alla diffusione di framework che ne rendono più semplice l’utilizzo e lo arricchiscono di numerose funzionalità aggiuntive. La tecnologia AJAX sfrutta Javascript per permettere al client di effettuare richieste asincrone al server; in questo modo le pagine che la utilizzano diventano delle vere e proprie web-application ad alto contenuto interattivo.  Anche l’upload, sfruttando questa tecnologia, diventa più user-friendly. Esistono diversi strumenti di upload sviluppati in AJAX. Nella maggior parte di questi è possibile aggiungere diversi file ad una coda. Una volta selezionati, i file vengono caricati sul server uno dopo l’altro. Inoltre, sfruttando questa tecnologia è possibile realizzare una barra di avanzamento che visualizza il livello di completamento dell’upload. Un esempio di questo tipo di soluzione è disponibile qui. Questo approccio però, obbliga l’utente a selezionare i file uno per volta: pensate quanto tempo occorrerebbe se i file da caricare fossero molti! Questo limite è dato dal dal fatto che lo strumento che permette la selezione del file da caricare è sempre basato sul form HTML che non permette di selezionare più file in una volta. Si potrebbe pensare di sviluppare un file browser in Javascript che permetta di effettuare selezioni multiple; purtroppo però, questo non è possibile, in quanto per motivi di sicurezza, Javascript non può leggere sul file system del computer client. Questo limite nega anche la possibilità di effettuare una qualsiasi elaborazione del file prima di caricarlo, come ad esempio il ridimensionamento di un’immagine.

Upload in Flash

La tecnolgia Adobe Flash è molto diffusa e utilizzata soprattutto per la creazione di pagine e applicazioni web interattive. Le potenzialità di Flash permettono anche di utilizzarlo come strumento per effuttuare l’upload di uno o più file. Infatti, sfruttando librerie come SWFUpload (Javascript+Flash), la selezione dei file da caricare viene effettuata attraverso un componente che permette la selezione multipla! In tal modo l’utente può selezionare anche centinaia di file con un paio di click. I file selezionati sono caricati sul server con la possibilità di mostrare una barra di avanzamento per valutare il livello di completamento dell’upload. L’unico limite che viene dall’utilizzo di una soluzione simile è dato dal fatto di non poter elaborare i file prima di effettuare l’upload, se si usa Flash Player 9 o precedenti. Ad esempio, non è possibile effettuare un ridimensionamento delle immagini prima di caricarle sul server. Con la versione 10 di Flash Player sarà possibile supererare questo ostacolo in quanto il nuovo FileReference è in grado di processare file che risiedono sul computer client, prima di inviarli al server.

Upload in Java

Ultima possibilità che vorrei citare è l’upload tramite applet Java. Attraverso uno strumento di questo tipo è possibile non solo, selezionare più file contemporaneamente e visualizzarne il livello di completamento durante l’upload ma, soprattutto, elaborare i file prima di caricarli. Se siete iscritti a Facebook e caricate regolarmente album fotografici avrete sicuramente utilizzato questa tecnologia. L’upload in Java, infatti, è molto utile in caso di caricamento di immagini, in quanto consente di ridimensionare le immagini prima di inviarle al server. Il ridimensionamento è molto utile in quanto riduce il peso del file e quindi anche i relativi tempi di caricamento. Gli svantaggi che si incontrano utilizzando questo metodo sono principalmente due. Primo, solitamente è difficile integrare un applet all’interno della pagina web mantenendo un’adeguata coerenza grafica. Secondo, questo tecnologia funziona soltanto se nel computer client è installato il JRE (Java Runtime Environment), che non ha una procedura di installazione immediata ed integrata nel browser come Flash Player.

Concludendo, le tecnologie per effettuare l’upload di uno o più file sono diverse e ognuna possiede pro e contro. La mia opinione è che non ne esiste una migliore dell’altra. Quello che mi sento di consigliare è di analizzare attentamente le proprie esigenze e poi scegliere la tecnologia adeguata da implementare.

Articoli correlati:

  1. La Collaborazione secondo Adobe
  2. Google, Yahoo e Adobe uniti per indicizzare i siti in Flash
  3. Webgriffe speaker al Flash Camp on the beach di Rimini
  4. Adobe e Apple al lavoro per portare Flash su iPhone

, , , , , , , , , , ,

Questo articolo è stato scritto da:

Manuele Menozzi - autore di 4 articoli su Webgriffe® magazine.

Ingegnere informatico, entrato a far parte del team di sviluppo di Webgriffe da gennaio del 2009, si sta specializzando in tecnologie di sviluppo per il web.

Contatta l'autore

3 commenti a “Le diverse strade del File Upload”

  1. vincenzo Says:

    Ciao Manuele, a proposito dell’Upload in Flash, noi nel nostro CMS per la gestione di siti per l’incoming abbiamo integrato un upload in flash che ridimensiona le immagini prima del caricamento, inoltre è anche possibile ruotare le foto.

    Reply

    • Manuele Menozzi Says:

      Ciao Vincenzo,
      grazie per il tuo commento sul nostro blog.
      L’uplaod che avete integrato nel vostro CMS effettua il ridimensionamento anche con Flash Player 9 o inferiori?

      Reply

      • Vincenzo Says:

        Come hai ben specificato nel tuo articolo per ridimensionare un immagine prima dell’upload c’è bisogno di Flash 10 Player.
        Il nuovo FileReference è in grado di processare file che risiedono sul computer client, prima di inviarli al server.

        Reply


Scrivi un Commento