• Server Push sul Web utilizzando la tecnica del Long Polling

    by  • 18 marzo 2012 • AJAX, JavaScript, Programmazione, Web Design • 0 Comments


    Il modo più semplice per simulare lo streaming in tempo reale di informazioni è quello di interrogare il server ogni N secondi, e visualizzare le informazioni (se presenti). Il numero N determinerà quanto in tempo reale il flusso risultante di aggiornamenti cercherà e visualizzerà le informazioni. Questo modello si chiama semplicemente polling. La tecnica del polling è abbastanza problemativa perché cause continue connessione e disconnessioni al server che quando si scala su migliaia di utenti viene messo a dura prova. Questo problema diventa ancora più evidente nei casi in cui il Poller non ritorna i dati per la maggior parte delle volte.

    Il frammento di jQuery mostrato di seguito eseguo un polling verso il server ogni 3 secondi per ottenere nuove informazioni e le visualizza in un semplice box di avviso

    function callComplete(response) {
    	alert("Response received is: "+response);
    };
    
    function connect() {
    	// when the call completes, callComplete() will be called along with
    	// the response returned
    	$.post('/path/to/script.php', {}, callComplete, 'json');
    };
    
    $(document).ready( function() {
    	setInterval(connect,3000);
    }

    Long polling

    Questa tecnica è una ottimizzazione del tradizionale metodo di polling. Con il Long Polling quando il client effettua una richiesta al server (via JavaScript), questo attende che i dati richiesti dal client siano disponibili, se ciò non accade immediatamente, il server (che potrebbe essere uno script PHP per esempio) effettua un loop di attesa. Quando i dati diventano disponibili, il server li ritorna al client e la connessione viene chiusa ma subito il client ne apre una nuova riconnettendosi al server (connessione che avviene direttamente nella funzione di callback della richiesta AJAX originale) per richiedere nuovi dati.

    Questo metodo è sicuramente un miglioramento rispetto ad un polling indiscriminato con continue connessioni e disconnessioni anche quando i nuovi dati effettivamente non sono disponibili per lunghi periodi di tempo. Comunque è importate anche considerare le limitazioni che ci sono lato server rispetto alla tecnica del long polling, che obbligatoriamente necessita di un web server in grado di gestire un gran numero di connessioni aperte contemporaneamente e per lungo tempo. However, it is important to be aware of the server side technical limitations of long polling. Since connections might be kept alive for long durations of time, your web server must be capable of handling such large numbers of simultaneous connections.

    Diamo un’occhiata ad un semplice esempio di tecnica Long Polling implementata con jQuery e PHP:

    function callComplete(response) {
    	alert("Response received is: "+response);
    	// reconnect to the server
    	connect();
    };
    
    function connect() {
    	// when the call completes, callComplete() will be called along with
    	// the response returned
    	$.post('/path/to/script.php', {}, callComplete, 'json');
    };
    
    $(document).ready( function() {
    	connect();
    }

    In PHP scriveremo:

    while(1) {
    
    	$data = "some data fetched from the DB";
    
    	// if we have new data, return it to the client
    	if(!empty($data)) {
    		echo json_encode($data);
    		break;
    	}
    
    	sleep(3000);	// we sleep for 3s and check again for data
    }

    Lo streaming COMET

    COMET è un termine generico che fa riferimento all’uso di connessioni HTTP persistenti con il webserver per effettuare il “push” di dati verso il client immediatamente quando disponibilli. Se vi siete mai chiesti come GMail sia in grado di notificare i nuovi messaggi di posta elettronica pochi secondi dopo che sono stati spediti, questa è la tecnica con cui ciò viene realizzato.

    Comunque, come spesso capita utilizzando il JavaScript, per garantire la compatibilità con i diversi browser è necessario l’utilizzo di più metodi per realizzare tale interazione. Il vantaggio comunque è che tali metodi si basano esclusivamente sul puro JavaScript evitando la dipendenza da specifici plug-in lato browser. Uno studio dettagliato dei vari metodi e delle loro caratteristiche va aldilà dello scopo di questo articolo, ma diamo comunque un rapido sguardo ad alcuni di essi.

    Tecnica dell’iframe nascosto

    Un elemento html iframe nascosto viene incorporato nella pagina, facendolo puntare alla URL sul server che gestisece la connessione persistente. Il server invierà i dati verso l’iframe istantaneamente al loro arrivo, utilizzando i tags

    <script>...</script>

    I contenuti ricevuti vengono inoltrati alla finestra padre utilizzando il JavaScript. Questo metodo è basato sul fatto che molti browser valutano i blocchi di JavaScript come vengono ricevuti anche se la pagina non è stata ancora completamente caricata. Comunque questo metodo è incline a causare la visualizzazione continua dell’icona o del messaggio di “loading” sulla status bar del browser (visto che stiamo utilizzando una connessione HTTP persistente ed il browser tende a credere che la pagina non è stata ancora caricata completamente).

    XMLHttpRequest utilizzando la proprietà interattiva readyState

    Questo metodo è disponibile con Firefox, Safari e Chrome, che supportano la proprietà interattiva “readyState” dell’oggetto XHR e scatena gli eventi ogni volta che un blocco di dati inviati dal server viene ricevuto.

    Eventi Server-Sent

    Questa è una funzionalità (dalle specifiche WHATWG Web Applications 1.0) supportata da Opera a partire dalla versione 9, che consente di fare il push di eventi dal server direttamente verso il browser dell’utente.

    Come è possibile vedere, implementare le tecniche di streaming COMET che funzionino uniformemente su tutti i browser non è cosa semplice ed immediata (non dimenticando che il webserver deve essere in grado di gestire un grande numero di connessione persistenti simultanee). Le buone notizie sono che una buona parte del lavoro è stato già fatto per noi. Ci sono vari implementazioni opensource di server COMET e librerie client che possono essere utilizzate per costruire applicazioni COMET con una certa semplicità. Qui di seguito ce ne sono alcune indicate:

    Orbited: “Orbited is an HTTP daemon that is optimized for long-lasting comet connections. Orbited allows you to write real-time web applications, such as a chat room or instant messaging client, without using any external plugins like Flash or Java. ”

    Cometd: “Cometd è un router di eventi HTTP-based che usa il pattern Ajax-Push noto come Comet.”

    Meteor: “Meteor è un server HTTP opensource disegnato per offrire agli sviluppatori un mezzo semplice per integrare lo streaming di dati nelle web applications evitando l’aggiornamento continuo delle pagine HTML.”

    Comet Pi: Comet Pi è una libreria JavaScript che può essere utilizzato per gestire i diversi problemi cross-browser che COMET causa. E’ possibile utilizzare pi.comet con diversi linguaggi lato server.

    Lascia un commento

    Il tuo indirizzo email non sarà pubblicato. I campi obbligatori sono contrassegnati *