Visualizzazione dei risultati da 1 a 5 su 5

Visualizzazione discussione

  1. #1

    [GUIDA] Inserire funzione "Sta scrivendo..." nella propria chat privata AJAX/PHP

    Salve a tutti,
    per farmi perdonare dei giorni (anzi mesi ) di assenza su questo forum, ho deciso di creare una guida per aggiungere in una chat ajax la classica scritta "sta scrivendo".
    Siccome è la mia prima guida spero di essere chiaro e se avete dubbi/domande/proposte o volete segnalare un bug, non esitate a rispondere, mi farebbe molto piacere.

    ATTENZIONE: questo post non spiega come fare una chat ajax, ma spiega solo una mia idea per aggiungere qualche utile dettaglio alla chat.

    Requisiti:
    • buone conoscenze php/ajax;
    • una chat AJAX-PHP già pronta che utilizza un database MY-SQL;
    • una tabella messaggi con i seguenti campi di base: mittente, destinatario, testo(NULL), data(timestamp);


    Per iniziare:
    ogni chat ajax, o almeno in genere, è composta principalmente da 3 file: uno principale, che contiene la pagina per chattare, un file che contiene lo script per inviare un messaggio e un file che contiene il log dei messaggi, che viene aggiornato tramite ajax circa ogni 2 secondi.

    Nel mio caso abbiamo 3 file: chat.php dove è presente la chat, log.php dove è presente lo script che mostra i messaggi e post.php che viene eseguito, sempre tramite ajax, ogni volta che inviamo un messaggio. A questi 3 file andremo a inserire il file "sta_scrivendo.php" che ne vedremo il funzionamento più tardi.
    Partiamo dal file chat.php che dovrebbe contenere un form per l'invio del messaggio con il classico tag <input type="text">.
    Proprio in questo tag inseriremo l'attributo onKeyPress che andrà a richiamare una funzione javascript ajax per eseguire il file sta_scrivendo.php; così:
    codice HTML:
    ...
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3/jquery.min.js">
    </script>
    <script type="text/javascript">
    function staScrivendo(){
        $.ajax({ 
    //eseguo il file "sta_scrivendo.php" appena viene attivato l'evento onKeyPress
            url: "sta_scrivendo.php",
            cache: false,
        });
    }
    </script>
    ...
    <input name="usermsg" type="text" onKeyPress="staScrivendo()" autocomplete="off"/>
    ...
    Per quanto riguarda il file chat.php abbiamo già finito.
    Il prossimo file da modificare sarà "sta_scrivendo.php" che ci servirà per andare a inserire un normale messaggio con testo = NULL e la data (questa riga inserita servirà solo per controllare nel file log.php se l'utente sta scrivendo).
    NB: nel mio caso, il destinatario e il mittente vengono memorizzati tramite le sessioni.
    Codice PHP:
    <?
    session_start
    ();
    if(isset(
    $_SESSION['user'])&&isset($_SESSION['destinatario'])){
     
    /*contollo che il destinatario e il mittente esistano */
          
    mysql_connect("localhost","nomeutente","password") or die (mysql_error()); //connessione mysql 
          
    mysql_select_db ("nomeDB") or die (mysql_error());
          
    $destinatario =    $_SESSION['destinatario'];
          
    $mittente $_SESSION['user']; //recupero il mittente e il destinatario
          
    $query "DELETE FROM messaggi WHERE mittente = '$mittente' AND destinatario = '$destinatario' AND testo IS NULL"
    /*cancello eventuali righe uguali a quelle che andremo ad inserire con testo null*/
        
    $result mysql_query($query);
        if (!
    $result) {
            die(
    "Errore nella query $query: " mysql_error());
        }
        
    $query "INSERT INTO messaggi (mittente,destinatario)
        VALUES ('
    $mittente','$destinatario')"
    /* inserisco la riga vuota. NB: il testo deve essere settato di default NULL e la data sarà un timestamp */
         
    $result mysql_query($query);
        if (!
    $result) {
            die(
    "Errore nella query $query: " mysql_error());
        }
        
    mysql_close(); 
    //chiudo la connessione
    }
    ?>
    Ora aggiungeremo uno script per cancellare la riga vuota nel file post.php, nel caso il messaggio venga postato:

    Codice PHP:
    ...
    $query "DELETE FROM messaggi WHERE mittente = '$mittente' AND destinatario = '$destinatario' AND testo IS NULL";
    $result mysql_query($query);
    if (!
    $result) {
        die(
    "Errore nella query $query: " mysql_error())
    }
    ... 
    infine modifichiamo adeguatamente il file log.php in modo che il destinatario visualizzi il messaggio "Sta scrivendo.." (questa è la parte più difficile e personalizzabile).
    Ognuno avrà il file log.php personalizzato in base alle proprie esigenze, quindi sarò generale:
    prima di stampare a video i messaggi memorizziamo nella variabile $n il numero dei messaggi che ci sono arrivati da parte del destinatario:
    Codice PHP:
    $query mysql_query("SELECT * FROM messaggi WHERE mittente = '$destinatario' AND destinatario = '$userlog' AND testo IS NOT NULL");
    $n mysql_num_rows($query); 
    in seguito stampiamo tutti i messaggi con testo "IS NOT NULL" e controlliamo se sono presenti nuovi messaggi con testo null e data uguale a quella attuale con un margine di 3 secondi:
    Codice PHP:
    $query mysql_query("SELECT * FROM messaggi WHERE destinatario = '$mittente' AND mittente = '$destinatario' AND testo IS NULL");
    $quanti mysql_num_rows($query);
    if(
    $quanti>&& $_SESSION['precedenti']==$n){ 
    /*attenzione: controllo anche se $n è uguale alla sessione precedenti, che dichiarerò successivamente*/
        
    $rs mysql_fetch_row($query);
        
    $d $rs[3];
        
    $dataeora explode(" ",$d); 
    /*vari controllo sulla data. Attenzione: questi controlli funzionano solo se la data del database è in formato "Y-m-d h:m:s" ed è sincronizzata con quella del server*/
        
    $oggi date("Y-m-d");
        if(
    $dataeora[0]==$oggi){
            
    $oreminutisecondi explode(":",$dataeora[1]);
            
    $ore=$oreminutisecondi[0];
            
    $minuti=$oreminutisecondi[1];
            
    $secondi=$oreminutisecondi[2];
            
    $secondiTotale=($ore*3600)+($minuti*60)+$secondi;
            
    $oreReali=date("H");
            
    $minutiReali=date("i");
            
    $secondiReali=date("s");
            
    $secondiTotaleReali=($oreReali*3600)+($minutiReali*60)+$secondiReali
            if(
    $secondiTotaleReali-3<$secondiTotale){
                
    /*se il messaggio è più recente di 3 secondi stampo Sta scrivendo...*/
                
    echo '<p style="font-size:16px;">Sta scrivendo...</font>';
            }    
        }
    }
    $_SESSION['precedenti'] = $n
    /*metto la variabile $n nella sessione precedenti*/ 
    Spero di essere stato chiaro. Su richiesta metto l'intero codice della chat.
    Grazie per l'attenzione e alla prossima
    Ultima modifica di manu.fina; 25-08-2014 a 13:19

Permessi di invio

  • Non puoi inserire discussioni
  • Non puoi inserire repliche
  • Non puoi inserire allegati
  • Non puoi modificare i tuoi messaggi
  •  
Powered by vBulletin® Version 4.2.1
Copyright © 2025 vBulletin Solutions, Inc. All rights reserved.