Page 1 sur 1

mettre à jour une page en temps réel

Posté : 06 juil. 2005, 09:26
par becouet
Bonjur, J'ai un gros probleme de mise à jour de page. En fait, j'aimerai pouvoir mettre à jour ma page web, dès qu'il y a une modification dans la base de données, et cela sans rafraichissement.
Pourriez vous me conseiller?

merci

Posté : 06 juil. 2005, 09:31
par Cyrano
Sans rafraichissement de la page, ce n'est pas posible. Techniquement, ce qui se passe dans la base de donnée a lieu coté serveur. La page est coté client et la page affichée a déjà été envoyée vers le client. Pour que le contenu de cette page soit mis à jour à partir de données venant du serveur, il faut que le serveur envoie les nouvelles données dans la page, or on ne peut pas envoyer seulement une partie de page en disant au navigateur "Change moi juste ce bout de page là", tu envoie une page complète, donc il faut recharger la page, à moins d'utiliser des iframes et de ne recharger que le iframe dont le contenu a été modifié, mais de toute façons il y aura raffraichissement, qu'il soit total ou partiel dans l'affichage.

Re: mettre à jour une page en temps réel

Posté : 06 juil. 2005, 09:31
par cerber
dès qu'il y a une modification dans la base de données [+] sans rafraichissement.
= impossible !

a moins de passer par un applet qui garde un socket ouvert vers le serveur et qui attend un signe de sa part, mais ca reviens a chasser le moustique avec une colonne de chars d'assaut

Moi je suggere l'approche "last-modified" + "javascript http request" (cf google) :
- dans ta page tu modifie avec php le header qui s'appelle last-modified pour qu'il corresponde a ta dernière modif BDD
- dans la page web tu met un raffraichissement en mode HEAD toute les 5 secondes via le "javascript http request" et tu vérifie le changement du champ last-modified

Posté : 06 juil. 2005, 09:45
par mere-teresa

Posté : 06 juil. 2005, 10:26
par becouet
Déjà je vous remercie bcp de vos réponses!!! Ca me remonte le moral :D
Cerber, ton approche ressemble un peu o sys cache, mais je voulais savoir juste une chose, on ne verra pas le chargement de la page (comme un refresh) en faisant cela?

Posté : 06 juil. 2005, 13:53
par cerber
non, c'est tout l'intéret du systeme, justement je suis en train d'apprendre a le faire fonctionner (pour mon taff)
D'ailleur j'ai trouvé une classe assez sympa, mais pas facile a prendre en main (enfin, j'ai plein de bug :) mais ca doit être ma fôte) c'est jpspan
http://jpspan.sf.net

Posté : 06 juil. 2005, 22:04
par becouet
Excuse moi encore Cerber, mais j'ai pas trouver le script java que tu m'as emandé de chercher sur google. Car si j'ai bien compris, c'est un script qui va tt les X secondes chercher le header de la page et la comparer si ca été modifié. D'ailleurs, si t'as un lien, autre que l'API de php pour ce header, cela m'aiderai bcp, car j'ai regarder l'api et il en parle vite fait de la méthode "Last-Modified"

Merci d'avance,

Posté : 07 juil. 2005, 10:19
par cerber
en fait on va laisser tomber l'histoire du last-modified et faire plus simple avec jpspan :
  • un fonction php qui retourne la date de dernière modif dans la bdd
  • ta page html (qu'on va transformer pour y mettre un peu de php) avec un petit code java qui :
    • appelle le script php et récupère la date
    • raffraichi la page si la date de dernière modif a changé
voila un code "simplifié" :
page php *serveur* de "mesUtilitaires.php"
<?php
define ('JPSPAN_ERROR_DEBUG',TRUE);
require_once '../JPSpan.php';
require_once JPSPAN . 'Server/PostOffice.php';

//-----------------------------------------------------------------------------------
class modifBDD{

    function getDate() {
        $date= ....;//une date valide   
        return date('r',$date);
    }

}

$S = & new JPSpan_Server_PostOffice();
$S->addHandler(new modifBDD());

//-----------------------------------------------------------------------------------
// Generates the Javascript client by adding ?client to the server URL
//-----------------------------------------------------------------------------------
if (isset($_SERVER['QUERY_STRING']) && strcasecmp($_SERVER['QUERY_STRING'], 'client')==0) {
    // Compress the Javascript
    // define('JPSPAN_INCLUDE_COMPRESS',TRUE);
    $S->displayClient();
} else {
    require_once JPSPAN . 'ErrorHandler.php';
    $S->serve();
}
?>
code html/php client :
<?php

header( "Expires: Mon, 26 Jul 1997 05:00:00 GMT" ); 
header( "Last-Modified: " . gmdate( "D, d M Y H:i:s" ) . "GMT" ); 
header( "Cache-Control: no-cache, must-revalidate" ); 
header( "Pragma: no-cache" );

// Just a utility to help the example work out where the server URL is...
function path() {
    $basePath = explode('/',$_SERVER['SCRIPT_NAME']);
    $script = array_pop($basePath);
    $basePath = implode('/',$basePath);
    if ( isset($_SERVER['HTTPS']) ) {
        $scheme = 'https';
    } else {
        $scheme = 'http';
    }
    echo $scheme.'://'.$_SERVER['SERVER_NAME'].$basePath;
}

?>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
<head>
<script type="text/javascript" src="<?php path(); ?>/mesUtilitaires.php?client"></script>
<script type="text/javascript">
var dateInitiale = Date.parse('<?php echo date('r'); ?>');

// on va passer par un systeme asynchrone 
// (en utilisant le handler ci dessous)
// sinon l'utilisateur ne pourra pas utiliser la page pendant les requêtes
// ceci ne fait que gerer les reponse, l'appel est un peu plus bas
var CompletionHandler = {
    // Callback method
    // note ici que le nom de méthode est le même qu'en php 
    // mais en minuscules. Je sais pas d'ou viens la limitation
    getdate: function(result) {
        if(Date.parse(result)>dateInitiale){
             //Raffraichir la page
        }
    }
    
}

//la fonction JS qui va appeller le script php
// on va la déclancher via un timer
function checkRefresh() {
    // Create du client distant
    // note ici que le nom de classe est le même qu'en php 
    // mais en minuscules. Je sais pas d'ou viens la limitation
    var a = new modifbdd(modifBDDHandler);
    
    // Son met un timeout de 3 secondes pour pas attendre pour rien
    a.timeout = 3000;
    
    // Ignore timeouts
    a.clientErrorFunc = function(e) {
        if ( e.code == 1003 ) {
            // Ignore...
        } else {
            alert(e);
        }
    }
    
    // on appelle la methode distante
    // même contrainte avec les minuscules
    a.getdate();
}

// le timer toute les 5 secondes
// (dont 3 max d'attentes de l'appel précédent)
setTimeout("checkRefresh()",5000);
</script>
...