APPLICAZIONI WEB OFFLINE - Si rivolgono principalmente al mondo mobile, per risparmiare sui costi di connessione. - GMail e Calendar sfruttano questa tecnologia per consentire i propri utenti di leggere email, consultare eventi dal proprio dispositivo, senza necessità di una connessione. - Le motivazioni: Risparmio; Essere in aree poco coperte; Viaggi in aereo; Connessioni lente in certe parti del globo; Utilizzo di siti che ospitano principalmente documentazione. - Inizialmente questo scopo era ottenuto, soprattutto nel caso di siti di informazione, facendo fare (esplicitamente) il download delle parti interessate. Oggi lo stesso scopo si raggiunge in modo molto più efficace e semplice per l utente, che non deve scaricare esplicitamente alcuna risorsa. La gestione delle risorse che saranno utilizzabili indipendentemente dalla presenza di una connessione, avviene dietro alle quinte, in modo del tutto trasparente. - Per verificare se il browser supporta questa funzionalità si può fare in due modi: la prima con la libreria Modernizr, la seconda senza. if (Modernizr.applicationcache) { // supporto} else { // no supporto } (!!window.applicationcache) { // supporto} else { // no supporto } if - NOTA: L uso di questa filosofia di sviluppo di applicazioni offline, potrà portare all idea di realizzare applicazioni con un set minimo di servizi disponibili (offline) ai quali aggiungersi funzionalità ulteriori, con l accesso alla rete. La mancata implementazione di questa funzionalità su IE9 e alcune difficoltà di debugging, rappresentano però i punti deboli di questa tecnologia. Creare un applicazione offline: il file manifest - Per realizzare un applicazione offline, prima di tutto occorre creare un file manifesto che dia indicazioni sulle risorse che saranno disponibili un volta che l accesso alla rete, non ci sarà più. - Questo file ha estensione.manifest. Di seguito un esempio di file manifest: page 1 / 5
CACHE MANIFEST # ver. 0.1 CACHE:./Risorsa1.html /css/risorsa1.css http://www.miosito.it/js/risorsa1.js NETWORK: Risorsa1.php FALLBACK: RisorsaTempoReale.php RisorsaOffline.html /news/* avviso.html - La prima riga è l intestazione iniziale: è necessaria - Nella riga successiva (dopo la riga vuota) abbiamo un commento identificato dal #. Ogni commento deve andare su una riga separata. - Poi abbiamo il titolo di sezione CACHE. Se non compare nessun titolo di sezione, si intende che stiamo definendo la sezione predefinita che è CACHE. In questa sezione abbiamo l elenco delle risorse che corrispondono ai file di cui dobbiamo disporre anche in assenza di connessione - Sotto abbiamo i dati della sezione CACHE. Vi sono alcune modalità di definizione, nell esempio sono mostrate tutte e 3 ma è bene utilizzare una sola modalità: - La prima rappresenta un percorso relativo (file presente nella directory corrente, cioè quella dove si trova lo stesso file manifest). - Nella seconda riga abbiamo un percorso assoluto (corrisponde a http://www.miosito.it/css/risorsa1.css) - Nel terzo caso abbiamo direttamente l URL. - La sezione NETWORK stabilisce le risorse esclusivamente accessibili online. - La sezione FALLBACK, indica le risorse che hanno l alternativa da utilizzare in caso di rete non disponibile. Per ogni riga di dati abbiamo uno coppia di risorse, la prima da usare online, la seconda in caso di assenza di connessione (offline). Nel primo caso abbiamo una relazione uno-a-uno, la seconda riga di dati, invece, mostra una relazione uno-a-molti: ogni risorsa sotto la directory news sarà sostituita dal file avviso.html in caso di rete non disponibile. - Una volta scritto il file manifest è necessario creare la relazione con la pagina web a cui si riferisce. Per fare questo si usa l attributo manifest del tag <HTML>, come ad esempio: <<html manifest= Risorsa1.manfest > > - Sebbene la pagina Risorsa1.html è necessaria a garantire l usabilità dell applicazione anche in assenza di connessione (perché si trova nella sezione CACHE), questa pagina verrebbe comunque conservata in locale per il semplice fatto di presentare una relazione con il file manifest, attraverso l omonimo attributo. - Per fare funzionare offline l applicazione offline occorre assicurarci che il file. manifest sia servito con il MIME-Type corretto. - MIME sta per Multipurpose Internet Mail Extensions (estensione multiuso del servizio di posta Internet). Il MIME-type descrive il tipo di contenuto che riceviamo via e-mail o che viene servito da un web server. Serve a dire al software di posta o browser, come debbano essere processati e visualizzati i dati ricevuti. - Questa informazione viene fornita al browser attraverso l intestazione Content-type che ha il seguente formato page 2 / 5
Content-type: tipo/sottotipo Il tipo indica la macrocategoria di appartenenza del dato; il sottotipo ne rappresenta il formato specifico. Alcuni formati: - text/html per i documenti HTML text/css per i fogli di stile text/plain per i file di puro testo che non saranno interpretati image/png per immagini che utilizzano il formato PNG image/jpg per immagini che utilizzano il formato JPG application/pdf per i documenti PDF - Il MIME-type corretto per i file manifest è text/cache-manifest. Se si utilizza Apache occorre modificare il file.htaccess aggiungendo la seguente direttiva AddType AddType: text/cache-manifest.manifest - Per capire come funziona un applicativo web offline vediamone alcuni scenari Prima visita del file Risorsa1.html - Se si visita una pagina web che dichiara l esistenza di un file di tipo manifest per la prima volta, significa che non esistono copie più vecchie di questo file sulla macchina dell utente. - Il browser scarica e interpreta il file manifest ed inoltra la richiesta al server per ciascuna delle risorse che devono essere utilizzabili in assenza di connessione. Di seguito le fasi: page 3 / 5
- Downloading: evento scatenato quando non esiste una precedente versione del file manifest. - Cached: tutte le risorse menzionate nel file manifest sono state scaricate e l applicazione è integralmente disponibile in locale sulla macchina dell utente. - Prima di questo processo, il browser può proporre una notifica chiedendo l autorizzazione di salvare i dati sul computer per un utilizzo non in linea. - Dal pannello di configurazione del browser sarà possibile visionare quale sito ha salvato dei dati Visite successive al file Risorsa1.html, con file manifest non modificato - Il browser verifica se sono state apportate modifiche al file manifest. Se le versioni sono identiche non accade nulla. In ogni caso vengono scatenati i seguenti eventi: - Checking: questo viene sempre scatenato sia che venga scaricato o meno il file manifest. - Noupdate: con questo evento viene scatenato per segnalare che il file manifest locale e quello remoto non hanno differenze. Visite successive al file Risorsa1.html, con file manifest risulta modificato - Il browser verifica se sono state apportate modifiche al file manifest. Se le versioni sono diverse avvia lo scaricamento il locale di tutte le risorse elencate nel file. Di seguito gli eventi: - Downloading: l evento scatenato per scaricare la nuova versione del file manifest. - updateready: tutte le risorse menzionate nel file manifest sono state scaricate e quindi aggiornate l applicazione è nuovamente disponibile in locale sulla macchina dell utente - NOTA: Per rendere effettivamente disponibili all utente le nuove versioni delle risorse, occorre utilizzare la funzione swapcache() che sostituisce effettivamente la vecchia versione con quella appena scaricata. Una o più risorse indicate nel file manifest non sono disponibili - Analogamente allo scenario precedente, il browser verifica se sono state apportate modifiche al file manifest. Se le versioni sono diverse avvia lo page 4 / 5
scaricamento il locale di tutte le risorse elencate nel file. Di seguito gli eventi: - Downloading: l evento è scatenato per scaricare la nuova versione del file manifest. - Error: l impossibilità di ottenere una copia di una delle risorse elencate nel file manifest determina l evento error. - Altri casi di errore: - L impossibilità di scaricare lo stesso file manifest. - L impossibilità di scaricare la pagina web che presenta il riferimento al file manifest. - Il file manifest modificato in concomitanza con il processo di scaricamento dei dati. Supporto al debugging - Durante la realizzazione di applicazioni offline, può risultare utile avvalersi degli strumenti per sviluppatori di Chrome (compaiono nel menu strumenti). - Questi permettono di analizzare il comportamento dell applicativo attraverso gli eventi che ne contrassegnano il ciclo di vita page 5 / 5