La comunicazione dal vivo sul sito non lascerà indifferente il visitatore, perché puoi sempre scrivere sulla chat e ti risponderanno qualcosa, questa funzione è sempre meno comune sui siti, gli sviluppatori hanno iniziato a dimenticarsene, riferendosi maggiormente a forum e Commenti. Ma se è possibile inserire una chat sul sito, non è necessario perdere questa opportunità, gli utenti saranno solo grati. In questo tutorial vedremo come creare una chat molto interessante per il sito, utilizzando i servizi avatar, che daranno alla comunicazione una forma più piacevole. Per creare una tale chat AJAX, utilizzeremo PHP, MySQL e jQuery. Per prima cosa, esamineremo il markup HTML, il cui documento è costruito secondo HTML5, che consente di utilizzare la nuova sintassi DOCTYPE più breve e di omettere l'attributo type nei tag di script.
indice.html
Per organizzare un'area scorrevole con le chat line, utilizziamo il plugin jScrollPane. Questo plugin ha i suoi stili, che sono inclusi nella sezione head.
Il markup della chat è costituito da quattro elementi div principali: la barra in alto, il contenitore della chat, il contenitore degli utenti e la barra in basso. L'ultimo div contiene i moduli per la registrazione e la pubblicazione degli utenti. Il modulo di invio del messaggio è nascosto per impostazione predefinita e viene visualizzato solo se l'utente ha eseguito correttamente l'accesso al sistema di chat.
Nota! Le definizioni delle tabelle sono disponibili nel file tables.sql nei sorgenti. È possibile utilizzare il testo della query per creare tabelle. Inoltre, quando installi la chat sul tuo host, devi modificare le impostazioni in ajax.php sui tuoi dati per la connessione al database MySQL.
Ora che hai creato la tabella e fatto tutto ciò che dice la nota, discutiamo dello script PHP che controlla la chat. Il primo file che esamineremo è ajax.php. Gestisce le richieste AJAX lato client da jQuery e restituisce i dati in formato JSON.
ajax.php
/* Configurazione del database. Aggiungi i tuoi dettagli */ $dbOptions = array("db_host" => "", "db_user" => "", "db_pass" => "", "db_name" => ""); /* Fine della sezione di configurazione del database */ error_reporting(E_ALL ^ E_NOTICE); richiedono "classi/DB.class.php"; richiedono "classi/Chat.class.php"; richiedono "classi/ChatBase.class.php"; richiedono "classi/ChatLine.class.php"; richiedono "classi/ChatUser.class.php"; nome_sessione ("webchat"); inizio_sessione(); if(get_magic_quotes_gpc())( // Rimuovi barre aggiuntive array_walk_recursive($_GET,create_function("&$v,$k","$v = stripslashes($v);")); array_walk_recursive($_POST,create_function(" &$v,$k","$v = stripslashes($v);")); ) try( // Connetti al database DB::init($dbOptions); $response = array(); // Processo supportato azioni: switch($_GET["action"])( case "login": $response = Chat::login($_POST["name"],$_POST["email"]); break; case "checkLogged" : $response = Chat::checkLogged(); break; case "logout": $response = Chat::logout(); break; case "submitChat": $response = Chat::submitChat($_POST["chatText"] ) ; break; case "getUsers": $response = Chat::getUsers(); break; case "getChats": $response = Chat::getChats($_GET["lastID"]); break; default: lancia nuova eccezione ( "Azione errata"); ) echo json_encode($response); ) catch(Exception $e)( die(json_encode(array("error" => $e->getMessage()))); )
Per comodità, viene utilizzata un'istruzione switch per definire le azioni gestite dallo script. Implementa sottosistemi di chat, funzionalità di accesso/disconnessione e azioni per richiedere un elenco di repliche e utenti online.
L'output è sotto forma di messaggi JSON (che sono convenienti da elaborare con jQuery), gli errori generano eccezioni. L'istruzione switch distribuisce tutte le richieste ai metodi statici appropriati della classe Chat, che verranno discussi più avanti in questa sezione.
db.class.php
DB ( $istanza statica privata; $MySQLi privato; funzione privata __construct(array $dbOptions)( $this->MySQLi = @ new mysqli($dbOptions["db_host"], $dbOptions["db_user"], $dbOptions[" db_pass"], $dbOptions["db_name"]); if (mysqli_connect_errno()) ( throw new Exception("Errore database."); ) $this->MySQLi->set_charset("utf8"); ) public static function init(array $dbOptions)( if(self::$instance instanceof self)( return false; ) self::$instance = new self($dbOptions); ) public static function getMySQLiObject()( return self::$instance - >MySQLi; ) public static function query($q)( return self::$instance->MySQLi->query($q); ) public static function esc($str)( return self::$instance->MySQLi - >real_escape_string(htmlcaratteri speciali($str)); ) )
Classe DB - gestore database. Il costruttore è dichiarato privato, quindi l'oggetto non può essere creato al di fuori della classe e l'inizializzazione è possibile solo dal metodo statico init(). Prende un array con i parametri di connessione MySQL e crea un'istanza della classe, che è contenuta nella variabile statica self::$instance. Ciò garantisce che vi sia una sola connessione al database alla volta.
Il resto della classe implementa la comunicazione con il database, che si basa sul metodo static query().
ChatBase.class.php
/* Classe base usata dalle classi ChatLine e ChatUser */ class ChatBase( // Questo costruttore è usato da tutte le classi chat: public function __construct(array $options)( foreach($options as $k=>$v)( if( isset ($questo->$k))( $questo->$k = $v; ) ) ))
Questa è una semplice classe base. Il suo scopo principale è definire un costruttore che accetta un array di parametri ma conserva solo quelli definiti nella classe.
ChatLine.class.php
/* Chat line */ la classe ChatLine estende ChatBase( protected $text = "", $author = "", $gravatar = ""; public function save()( DB::query(" INSERT INTO webchat_lines (author, gravatar, text) VALUES ("".DB::esc($this->author)."", "".DB::esc($this->gravatar)."", "".DB::esc($this) ->testo)."")"); // Restituisce l'oggetto MySQLi della classe DB return DB::getMySQLiObject(); ) )
La classe ChatLine è una classe derivata da ChatBase. Un oggetto di questa classe può essere facilmente creato passando un array al costruttore con testo, il nome dell'autore e l'elemento gravatar. La proprietà della classe gravatar contiene l'hash md5 dell'indirizzo email. È necessario per ottenere un avatar utente corrispondente a un indirizzo e-mail da gravatar.com.
Questa classe definisce anche un metodo di salvataggio che salva l'oggetto nel database. Poiché il metodo restituisce un oggetto MySQLi contenuto nella classe DB, puoi verificare se l'operazione è stata completata correttamente utilizzando la proprietà related_rows.
ChatUser.class.php
Class ChatUser estende ChatBase( protected $name = "", $gravatar = ""; public function save()( DB::query(" INSERT INTO webchat_users (name, gravatar) VALUES ("".DB::esc($this ->nome)."", "".DB::esc($this->gravatar)."")"); return DB::getMySQLiObject(); ) public function update()( DB::query(" INSERT INTO webchat_users (name, gravatar) VALUES ("".DB::esc($this->name)."", "".DB::esc($this->gravatar)."") SU AGGIORNAMENTO CHIAVE DUPLICATA ultima_attività = ORA()"); ) )
La classe ha proprietà name e gravatar (notare il modificatore di accesso protetto: le proprietà sono disponibili nella classe ChatBase e possiamo impostarne i valori nel costruttore).
La classe definisce un metodo update() che aggiorna il campo last_activity con l'ora corrente. Ciò mostra che l'utente tiene aperta la finestra della chat e dovrebbe essere considerato l'autore online.
Chat.class.php
/* La classe Chat contiene metodi statici pubblici utilizzati in ajax.php */ class Chat( public static function login($name,$email)( if(!$name || !$email)( throw new Exception(" Compila tutti i campi richiesti."); ) if(!filter_input(INPUT_POST,"email",FILTER_VALIDATE_EMAIL))( throw new Exception("Indirizzo email non valido."); ) // Preparazione della cache gravatar: $gravatar = md5(strtolower (trim ($email))); $user = new ChatUser(array("name" => $name, "gravatar" => $gravatar)); // Il metodo save restituisce un oggetto MySQLi if($user-> save()- >affected_rows != 1)( throw new Exception("Il nome dato è in uso."); ) $_SESSION["user"] = array("name" => $name, "gravatar" => $gravatar); return array("status" => 1, "name" => $name, "gravatar" => Chat::gravatarFromHash($gravatar)); ) public static function checkLogged()( $response = array( "logged" => false) ; if($_SESSION["user"]["name"])( $response["logged"] = true; $response["loggedAs"] = array("name" => $ _SESSION["utente"][ "nome "], "gravatar" => Chat::gravatarFromHash($_SESSION["user"]["gravatar"])); ) restituire $risposta; ) funzione statica pubblica logout()( DB::query("DELETE FROM webchat_users WHERE name = "".DB::esc($_SESSION["user"]["name"])."""); $_SESSION = array(); unset($_SESSION); return array("status" => 1); )
Questo codice fa tutto il lavoro. Nell'istruzione switch nel file ajax.php, sono state selezionate le azioni che corrispondevano ai metodi di questa classe. Ciascuno di questi metodi restituisce un array, che viene quindi convertito in un oggetto JSON utilizzando la funzione json_encode() (questo accade nella parte inferiore del file ajax.php).
Quando un utente effettua il login, il suo nome e gravatar vengono memorizzati come elementi dell'array $_SESSION e resi disponibili nelle richieste successive.
Chat.class.php
Funzione statica pubblica submitChat($chatText)( if(!$_SESSION["user"])( throw new Exception("Hai lasciato la chat"); ) if(!$chatText)( throw new Exception("Non hai ha inserito un messaggio."); ) $chat = new ChatLine(array("author" => $_SESSION["user"]["name"], "gravatar" => $_SESSION["user"]["gravatar" ], " text" => $chatText)); // Il metodo save restituisce un oggetto MySQLi $insertID = $chat->save()->insert_id; return array("status" => 1, "insertID" => $insertID); ) funzione statica pubblica getUsers()( if($_SESSION["user"]["name"])( $user = new ChatUser(array("name" => $_SESSION["user"][" name"])) ; $user->update(); ) // Elimina le voci della chat più vecchie di 5 minuti e gli utenti inattivi per 30 secondi DB::query("DELETE FROM webchat_lines WHERE ts< SUBTIME(NOW(),"0:5:0")"); DB::query("DELETE FROM webchat_users WHERE last_activity < SUBTIME(NOW(),"0:0:30")"); $result = DB::query("SELECT * FROM webchat_users ORDER BY name ASC LIMIT 18"); $users = array(); while($user = $result->fetch_object())( $user->gravatar = Chat::gravatarFromHash($user->gravatar,30); $users = $user; ) return array("users" => $users, "total" => DB: :query("SELECT COUNT(*) as cnt FROM webchat_users")->fetch_object()->cnt); ) funzione statica pubblica getChats($lastID)( $lastID = (int)$lastID; $result = DB::query("SELECT * FROM webchat_lines WHERE id > ".$lastID." ORDER BY id ASC"); $chats = array(); while($chat = $result->fetch_object())( // Restituisce l'ora in cui il messaggio è stato creato nel formato GMT (UTC): $chat->time = array("hours" => gmdate( "H" ,strtotime($chat->ts)), "minutes" => gmdate("i",strtotime($chat->ts))); $chat->gravatar = Chat::gravatarFromHash($chat- >gravatar) ; $chats = $chat; ) return array("chat" => $chat); ) public static function gravatarFromHash($hash, $size=23)( return "http://www.gravatar.com/ avatar/" .$hash."?size=".$size."&default=". urlencode("http://www.gravatar.com/avatar/ad516503a11cd5ca435acc9bb6523536?size=".$size); ) )
Il metodo getChats() utilizza la funzione gmdate per stampare l'ora in formato GMT. Sul lato client, utilizziamo i valori di ora e minuti da impostare nell'oggetto JavaScript e, di conseguenza, l'ora viene visualizzata in base al fuso orario dell'utente.
Gli stili di chat sono contenuti nel file chat.css. Gli stili sono indipendenti dal resto della pagina e possono essere facilmente incorporati in un sito esistente. Devi solo includere il markup HTML, gli stili e i file JavaScript.
chat.css
/* Contenitore principale della chat */ #chatContainer( width:510px; margin:100px auto; position:relative; ) /* Barra superiore */ #chatTopBar( height:40px; background:url("../img/solid_gray.jpg ") repeat-x #d0d0d0; border:1px solid #fff; margin-bottom:15px; position:relative; color:#777; text-shadow:1px 1px 0 #FFFFFF; ) #chatTopBar .name( position:absolute; top:10px; left:40px; ) #chatTopBar img( left:9px; position:absolute; top:8px; ) /* Chat */ #chatLineHolder( height:360px; width:350px; margin-bottom:20px; ) . chat( background:url("../img/chat_line_bg.jpg") repeat-x #d5d5d5; min-height:24px; padding:6px; border:1px solid #FFFFFF; padding:8px 6px 4px 37px; position:relative ; margin:0 10px 10px 0; ) .chat:last-child( margin-bottom:0; ) .chat span( color:#777777; text-shadow:1px 1px 0 #FFFFFF; font-size:12px; ) . chat .text( color:#444444; display:inline-block; font-size:15px; overflow:hidden; vertical-align:top; width:190px; ) .chat .gravatar( background:url("ht tp://www.gravatar.com/avatar/ad516503a11cd5ca435acc9bb6523536?size=23") nessuna ripetizione; a sinistra:7px; posizione:assoluta; in alto:7px; ). -dimensione:11px; )
Tutto inizia con lo stile del #chatContainer div. È centrato orizzontalmente con margin:100px auto; . Questo div si divide in una barra superiore, un'area chat, un'area utente e una barra inferiore.
Il pannello superiore visualizza le informazioni sull'utente registrato. Viene posizionato in modo relativo in modo che l'avatar, il nome e il pulsante di uscita siano posizionati di conseguenza.
Poi arriva il div che contiene tutte le chat line - #chatLineHolder. Questo div ha un'altezza e una larghezza fisse e, nella parte jQuery di questo tutorial, utilizziamo il plug-in jScrollPane per trasformarlo in un riquadro a scorrimento con uno slider laterale.
chat.css
/* Area utente */ #chatUsers( background-color:#202020; border:1px solid #111111; height:360px; position:absolute; right:0; top:56px; width:150px; ) #chatUsers .user( background :url("http://www.gravatar.com/avatar/ad516503a11cd5ca435acc9bb6523536?size=30") no-repeat 1px 1px #444444; border:1px solid #111111; float:left; height:32px; margin:10px 0 0 10px; larghezza:32px; ) #chatUsers .user img( bordo:1px solido #444444; display:blocco; visibilità:nascosto; ) /* Barra inferiore */ #chatBottomBar( background:url(../img/solid_gray .jpg") repeat-x #d0d0d0; position:relative; padding:10px; border:1px solid #fff; ) #chatBottomBar .tip( position:absolute; width:0; height:0; border:10px solid transparent; border -bottom-color:#eeeeee; top:-20px; left:20px; ) #chatContainer input( background:url("../img/input_bg.jpg") repeat-x #dcdcdc; height:26px; font:13px /26px Calibri,Arial,sans-serif; colore:#777; bordo:1px solido; colore bordo:#c1c1c1 #eee #eee #c1c1c1; testo- ombra: 1px 1px 0 #E4E4E4; imbottitura:05px; margine-destra:5px; larghezza: 185px; contorno:nessuno; ) #submitForm( display:none; )
Nella seconda parte del file di stile, stiliamo il contenitore #chatUsers e gli elementi div per l'utente. Ogni utente attivo della chat è rappresentato da un'immagine gravatar di 32 x 32 pixel. L'immagine predefinita viene utilizzata come sfondo e quando l'immagine reale viene caricata dal server gravatar.com, viene visualizzata in alto. Ciò previene il fastidioso sfarfallio che di solito si verifica durante il caricamento di un'immagine.
Il resto del codice è relativo alla barra in basso e al modulo di invio. L'elemento div .tip diventa un triangolo realizzato utilizzando CSS impostando l'altezza e la larghezza su zero, mentre impostando la larghezza del tratto su grande.
chat.css
/* Modifica degli stili predefiniti per jScrollPane */ .jspVerticalBar( background:none; width:20px; ) .jspTrack( background-color:#202020; border:1px solid #111111; width:3px; right:-10px; ) .jspDrag ( background:url(../img/slider.png") no-repeat; width:20px; left:-9px; height:20px !important; margin-top:-5px; ) .jspDrag:hover( background - position:left bottom; ) /* Stili aggiuntivi */ a.logoutButton( background-color:#bbb; border:1px solid #eee !important; color:#FFFFFF !important; font-size:12px; padding:5px 9px ; position:absolute; right:10px; text-shadow:1px 1px 0 #888; top:7px; -moz-box-shadow:0 0 7px #888 inset; -webkit-box-shadow:0 0 7px #888 inset ; box-shadow:0 0 7px #888 inset; ) a.logoutButton:hover( text-shadow:1px 1px 0 #888; -moz-box-shadow:0 0 7px #666 inset; -webkit-box-shadow: 0 0 7px #666 inset; box-shadow:0 0 7px #666 inset; ) #chatContainer .blueButton( background:url("../img/button_blue.png") no-repeat; border:none !important; color: #cinque 16D7F !importante; display: blocco in linea; dimensione del carattere: 13px; altezza: 29px; allineamento testo:centro; text-shadow:1px 1px 0 rgba(255, 255, 255, 0.4); larghezza:75px; margine:0; cursore:puntatore; ) #chatContainer .blueButton:hover( posizione-sfondo: in basso a sinistra; ) p.noChats, #chatUsers .count( clear:both; font-size:12px; padding:10px; text-align:center; text-shadow:1px 1px 0 #111111; ) #chatUsers .count( font-size:11px; ) .rounded( -moz-border-radius:4px; -webkit-border-radius:4px; border-radius:4px; ) #chatErrorMessage( width :100%; alto:0; sinistra:0; posizione:fisso; colore di sfondo:#ab0909; bordo-basso:1px solido #d32a2a; dimensione carattere:23px; riempimento:16px; allineamento testo:centro; colore: #fff; text-shadow:1px 1px 0 #940f0f; )
Passiamo all'ultima parte del nostro tutorial, il codice jQuery. La chat funziona ricevendo eventi dai moduli di registrazione e invio messaggi, nonché dal pulsante "Esci" e invia anche richieste AJAX pianificate al server per verificare la presenza di nuovi messaggi e utenti.
La parte PHP gestisce le richieste AJAX nel file ajax.php. jQuery genera le seguenti richieste AJAX:
- Login utente: una richiesta POST;
- Logout utente: una richiesta POST;
- Controllo utenti che sono online: viene eseguito ogni 15 secondi;
- Verifica di nuove voci: viene generata una richiesta GET ogni secondo. Tale funzionamento può portare a un carico molto elevato sul server web, quindi lo script è ottimizzato e, a seconda dell'attività della chat, il periodo di generazione della richiesta può essere aumentato fino a 15 secondi.
Inoltre, tutto il codice della chat è organizzato in un unico oggetto chat. Contiene diversi metodi utili.
script.js
$(document).ready(function()( // Esegui il metodo init quando il documento è pronto: chat.init(); )); var chat = ( // data contiene variabili da utilizzare nelle classi: data: ( lastID: 0, noActivity: 0 ), // Init lega i gestori di eventi e imposta i timer: init: function()( // Usa il plugin jQuery defaultText incluso bottom: $("#name").defaultText("Alias"); $("#email").defaultText("Email (using Gravatar)"); // Converti div #chatLineHolder in jScrollPane, // salva l'API del plugin in chat.data: chat.data.jspAPI = $("#chatLineHolder").jScrollPane(( verticalDragMinHeight: 12, verticalDragMaxHeight: 12 )).data("jsp"); // Usa la variabile di lavoro per prevenire // multipli moduli di invio: var working = false; // Registra una persona nella chat: $("#loginForm").submit(function()( if(working) return false; working = true; // Usa la nostra funzione tzPOST // (definito di seguito): $.tzPOST("login",$(this).serialize(),function(r)( working = false; if(r.error)( chat.displayError(r.error); ) else chat .login( r.name, r.grava catrame); )); restituire falso; ));
Il metodo init() è progettato per associare gestori di eventi alla chat ed eseguire funzioni timer utilizzate per pianificare un controllo per le nuove voci di chat e un elenco di utenti online. Usiamo le nostre funzioni wrapper - $.tzGET e $.tzPOST. Si assumono l'onere di fornire un lungo elenco di parametri per le richieste AJAX.
script.js
// Invia i nuovi dati della stringa di chat: $("#submitForm").submit(function()( var text = $("#chatText").val(); if(text.length == 0)( return false; ) if(working) return false; working = true; // Genera un ID temporaneo per la chat: var tempID = "t"+Math.round(Math.random()*1000000), params = ( id: tempID, author : chat .data.name, gravatar: chat.data.gravatar, testo: text.replace(//g,">")); // Usa il metodo addChatLine per aggiungere la chat allo schermo // immediatamente senza attendere il completamento della richiesta AJAX: chat.addChatLine($.extend((),params)); // Usa il metodo tzPOST per inviare la chat tramite una richiesta AJAX POST: $.tzPOST("submitChat",$(this).serialize(),function(r)( working = false; $("#chatText"). val(""); $("div.chat-"+tempID).remove(); params["id"] = r.insertID; chat.addChatLine($.extend((),params)); )) ; restituire falso; )); // Disconnetti l'utente: $("a.logoutButton").live("click",function()( $("#chatTopBar > span").fadeOut(function()( $(this).remove(); ) ); $("#submitForm").fadeOut(function()( $("#loginForm").fadeIn(); )); $.tzPOST("logout"); return false; )); // Controlla lo stato della connessione dell'utente (aggiornamento del browser) $.tzGET("checkLogged",function(r)( if(r.logged)( chat.login(r.loggedAs.name,r.loggedAs.gravatar); ) ) ) ; // Funzioni di timeout ad esecuzione automatica (funzione getChatsTimeoutFunction()( chat.getChats(getChatsTimeoutFunction); ))(); (funzione getUsersTimeoutFunction()( chat.getUsers(getUsersTimeoutFunction); ))()); ),
Nella seconda parte dello script, continuiamo a associare i gestori di eventi. Nella funzione di invio del modulo, puoi notare che quando l'utente crea una nuova voce di chat, viene creata una stringa temporanea e visualizzata immediatamente nella finestra della chat, senza attendere il completamento della richiesta AJAX. Non appena la registrazione è completata, la riga temporanea viene rimossa dallo schermo. Quindi l'utente ha la sensazione che la chat funzioni alla velocità della luce, mentre la vera registrazione avviene in background.
Alla fine di questo pezzo di codice, vengono avviate due funzioni autoeseguibili denominate. Queste funzioni verranno passate come parametri rispettivamente ai metodi chat.getChats() o chat.getUsers(), quindi è possibile impostare timeout aggiuntivi.
script.js
// Il metodo di accesso nasconde i dati di accesso dell'utente // e visualizza il modulo di immissione del messaggio di accesso: function(name,gravatar)( chat.data.name = name; chat.data.gravatar = gravatar; $("#chatTopBar") .html( chat.render("loginTopBar",chat.data)); $("#loginForm").fadeOut(function()( $("#submitForm").fadeIn(); $("#chatText") .focus( ); )); ), // Il metodo di rendering genera il markup HTML, // necessario per altri metodi: render: function(template,params)( var arr = ; switch(template)( case "loginTopBar" : arr = [ " 
","",params.author, ":",params.text,"",params.time,"
In questa parte del codice, il metodo render() richiede attenzione. Costruisce un modello in base al parametro del modello. Il metodo quindi compila e restituisce il codice HTML richiesto, in linea con i valori del secondo parametro dell'oggetto params.
script.js
// Il metodo addChatLine aggiunge una chat line alla pagina addChatLine: function(params)( // Tutti gli orari sono visualizzati nel formato del fuso orario dell'utente var d = new Date(); if(params.time) ( // PHP restituisce l'ora in UTC (GMT) Lo usiamo per formare un oggetto data // e quindi emesso nel formato del fuso orario dell'utente // JavaScript lo converte per noi d.setUTCHours(params.time.hours,params.time.minutes); ) tempo parametrico = (d.getHours()< 10 ? "0" : "") + d.getHours()+":"+ (d.getMinutes() < 10 ? "0":"") + d.getMinutes(); var markup = chat.render("chatLine",params), exists = $("#chatLineHolder .chat-"+params.id); if(exists.length){ exists.remove(); } if(!chat.data.lastID){ // Если это первая запись в чате, удаляем // параграф с сообщением о том, что еще ничего не написано: $("#chatLineHolder p").remove(); } // Если это не временная строка чата: if(params.id.toString().charAt(0) != "t"){ var previous = $("#chatLineHolder .chat-"+(+params.id - 1)); if(previous.length){ previous.after(markup); } else chat.data.jspAPI.getContentPane().append(markup); } else chat.data.jspAPI.getContentPane().append(markup); // Так как мы добавили новый контент, нужно // снова инициализировать плагин jScrollPane: chat.data.jspAPI.reinitialise(); chat.data.jspAPI.scrollToBottom(true); },
Il metodo addChat() prende come parametro un oggetto contenente la stringa della chat, il nome dell'autore e il gravatar e inserisce la stringa della chat nella posizione appropriata nel div#chatContainer. Ogni linea di chat (a meno che non sia temporanea) ha un ID univoco assegnato da MySQL. L'id fornito è il nome della classe per la stringa di chat nel formato chat-123.
Quando il metodo addChat() viene eseguito, verifica l'esistenza della riga precedente (per chat-123, verificherà chat-122). Se esiste, il metodo inserisce una nuova riga dopo di essa. In caso contrario, aggiunge semplicemente una nuova riga al div. Questa semplice tecnica controlla l'inserimento delle righe nell'ordine corretto e lo mantiene per tutta la chat.
script.js
// Questo metodo richiede l'ultima voce della chat // (che inizia con lastID) e la aggiunge alla pagina. getChats: function(callback)( $.tzGET("getChats",(lastID: chat.data.lastID),function(r)( for(var i=0;i
"+messaggio+"
"); $("#chatUsers").html(users.join("")); setTimeout(callback,15000); )); ),Questa parte del codice gestisce le richieste AJAX. Il metodo getChats() determina quando la funzione verrà eseguita nuovamente in base alla proprietà noActivity dell'oggetto dati locale. Per ogni richiesta che non restituisce nuove righe di chat, incrementiamo il contatore. Se raggiunge una certa soglia, la richiesta successiva verrà generata con un ritardo.
script.js
// Questo metodo visualizza un messaggio di errore nella parte superiore della pagina: displayError: function(msg)( var elem = $("
L'ultima parte del codice definisce le funzioni ei metodi di supporto. Il metodo displayError() mostra una linea rossa nella parte superiore dello schermo se si verifica un errore. Quindi definisce le funzioni wrapper $.tzGET e $.tzPOST e un plug-in defaultText che restituisce il testo di riempimento per i campi di input di testo.
Il materiale è presentato a solo scopo informativo.
Ultimo aggiornamento: 31.10.2015
L'ultima volta che abbiamo definito il controller e il modello, ora creiamo il resto della chat. Definiamo prima le viste.
Codice vista principale Indice.cshtml sarà simile a questo:
@model AjaxChat.Models.ChatModel @( Layout = null; )
Questa è una vista senza una pagina master. L'elemento div con id="Username" mostrerà il nickname dell'utente. Il blocco con id="LastRefresh" serve per visualizzare l'ora dell'ultimo aggiornamento della chat e il div con id="Error" per visualizzare gli errori che possono verificarsi.
E per il login effettivo, abbiamo un campo di testo e un pulsante. Tuttavia, quando inserisci un nickname e fai clic sul pulsante, i dati non verranno immediatamente trasferiti al server, poiché non si tratta di un modulo. L'invio effettivo dei dati al server avverrà tramite un collegamento ajax, che avrà id = "LoginButton":
@Ajax.ActionLink("Login", "Index", new ( user = "" ), new AjaxOptions ( UpdateTargetId = "container", OnFailure = "LoginOnFailure", OnSuccess = "LoginOnSuccess" ), new ( @id = "LoginButton ", @style="visibility:hidden;" ))
Facendo clic sul collegamento si aggiornerà il blocco con id="container" . Per questo motivo, ci sarà un aggiornamento parziale della pagina corrente utilizzando ajax e non un normale ricaricamento della pagina. Ma non faremo clic sul collegamento noi stessi. Non lo vedremo nemmeno, dal momento che ha il set di stile "visibility:hidden;".
Il clic avverrà automaticamente nel file incluso nella vista chat.js:
$(documento).ready(function() ( // login $("#btnLogin").click(function() ( var nickName = $("#txtUserName").val(); if (nickName) ( // formiamo un collegamento con i parametri, a cui si accede var href = "/Home?user=" + encodeURIComponent(nickName); href = href + "&logOn=true"; $("#LoginButton").attr("href", href .click(); //impostando il campo con il nickname dell'utente $("#Username").text(nickName); ) )); )); // una volta effettuato l'accesso, carica la funzione dei messaggi LoginOnSuccess(result) ( Scroll(); ShowLastRefresh(); // aggiorna la chat ogni cinque secondi setTimeout("Refresh();", 5000); // invia messaggi premendo Invio $ (" #txtMessage").keydown(function (e) ( if (e.keyCode == 13) ( e.preventDefault(); $("#btnMessage").click(); ) )); //pulsante set fai clic sul gestore per inviare i messaggi $("#btnMessage").click(function() ( var text = $("#txtMessage").val(); if (text) ( //accedi al metodo Index e passa "chatMessage " parametro var href = "/Home?user=" + encodeURIComponent($("#Username").text()); href = href + "&chatMessage=" + encodeURIComponent(text); $("#ActionLink"). attr(" href", href).click(); ) )); //gestore del pulsante di uscita della chat $("#btnLogOff").click(function() ( //accedi al metodo Index e passa il parametro "logOff" var href = "/Home?user=" + encodeURIComponent($("#Username").text()); href = href + "&logOff=true"; $("#ActionLink").attr("href", href ).clic(); document.location.href = "Casa"; )); ) //se si verifica un errore, visualizza un messaggio di errore durante l'accesso alla funzione LoginOnFailure(result) ( $("#Username").val(""); $("#Error").text(result.responseText); setTimeout("$ ("#Error").empty();", 2000); ) // aggiorna il campo della chat ogni cinque secondi function Refresh() ( var href = "/Home?user=" + encodeURIComponent($( "#Username") .text()); $("#ActionLink").attr("href", href).click(); setTimeout("Refresh();", 5000); ) //Visualizza messaggio di errore function ChatOnFailure(result ) ( $("#Error").text(result.responseText); setTimeout("$("#Error").empty();", 2000); ) // dopo aver ricevuto correttamente una risposta dalla funzione del server ChatOnSuccess(result ) ( Scroll(); ShowLastRefresh(); ) //scorri fino alla fine della funzione della finestra Scroll() ( var win = $("#Messages"); var height = win.scrollHeight; win.scrollTop(height); ) // mostra la funzione dell'ora dell'ultimo aggiornamento della chat ShowLastRefresh() ( var dt = new Date(); var time = dt.getHours() + ":" + dt.getMinutes() + ":" + dt.getSeconds(); $(" #LastRefresh").testo ("L'ultimo aggiornamento era a " + ora); )
Per inviare i dati tramite login e click sul link, scriviamo le seguenti righe nel click handler:
// forma un collegamento con i parametri che verranno utilizzati per la chiamata var href = "/Home?user=" + encodeURIComponent(nickName); href = href + "&logOn=true"; // fare clic automaticamente sul collegamento ajax $("#LoginButton").attr("href", href).click();
Poiché il parametro logOn=true viene passato nella richiesta al server, il metodo Index, durante l'elaborazione di questa richiesta, invierà una vista parziale al client Chatroom: return PartialView("ChatRoom", chatModel); . Creiamo questa vista:
Questa è una vista parziale digitata con il ChatModel passato dal metodo Index. Contiene campi per l'immissione e l'invio di messaggi, nonché un pulsante per uscire dalla chat.
Inoltre è presente un blocco div id="RefreshArea", destinato direttamente alla visualizzazione di messaggi e utenti. Per rendere queste informazioni, chiama la vista parziale Storia che ora creeremo. E c'è anche un collegamento ajax invisibile che aggiorna il blocco div id="RefreshArea":
@Ajax.ActionLink("ActionLink", "Index", new ( user = "", logOn = "", logOff = "", chatMessage = "" ), new AjaxOptions ( UpdateTargetId = "RefreshArea", OnSuccess = "ChatOnSuccess" , OnFailure = "ChatOnFailure" ), new ( @id = "ActionLink", @style = "visibility:hidden;" ))
Nel file javascript sopra, dopo il login riuscito, viene chiamata la funzione LoginOnSuccess, che a sua volta chiama la funzione Refresh():
Function Refresh() ( var href = "/Home?user=" + encodeURIComponent($("#Username").text()); $("#ActionLink").attr("href", href).click( ); setTimeout("Aggiorna();", 5000); )
Questa funzione genera nuovamente una stringa di query con parametri per il collegamento ajax e fa clic su di essa automaticamente. Di conseguenza, il blocco div id="RefreshArea" verrà aggiornato con nuovi dati ogni cinque secondi.
Un'azione simile si verificherà anche quando si fa clic sul pulsante per inviare un messaggio alla chat:
Var href = "/Home?user=" + encodeURIComponent($("#Username").text()); href = href + "&chatMessage=" + codificaURIComponent(testo); $("#ActionLink").attr("href", href).click();
E poiché in entrambi i casi, quando si passano parametri al metodo Index del controller, i parametri logOn e logOff non verranno impostati, il metodo Index restituirà una vista parziale in risposta Cronologia.cshtml: return PartialView("Cronologia", chatModel);
Ora creiamo la vista parziale stessa Cronologia.cshtml:
@utilizzando AjaxChat.Models @model ChatModel
Chat online: @Model.Users.Count
@foreach(Utente ChatUser in Model.Users) ( )@msg.Data
@if (msg.User != null) ( @(msg.User.Name + ":")@msg.Text ) altrimenti ( @msg.Text
}
In conclusione, puoi ancora in qualche modo modellare l'applicazione. Alla fine, dovrebbe assomigliare a questo. All'avvio, vedremo il campo di accesso:
Piano
In questo articolo creeremo una semplice chat che può essere facilmente eseguita su qualsiasi server che abbia il supporto PHP. Non sono richiesti database perché tutte le informazioni sulla chat verranno archiviate in un semplice file di testo. Tecnologia applicata:
PHP– gestirà tutti i contenuti di terze parti dell'applicazione
- Scrivi nuovi messaggi in un file di testo
- Leggi nuovi messaggi da un file di testo
- Interroga lo stato del file di testo
- Sicurezza di base
jQuery/javascript- gestione lato client dell'applicazione. Questa applicazione è progettata da AJAX, il che significa che i messaggi verranno visualizzati in una finestra pop-up (sia tua che dell'altra parte), senza la necessità di ricaricare la pagina.
- Interroga periodicamente il server per nuovi messaggi
- Aggiunta di nuovi messaggi alla finestra della chat
- Scorri la finestra della chat sui nuovi messaggi
- Interroga e imposta il nome utente
- Limite della dimensione del messaggio per evitare enormi saggi nella finestra della chat
- Sicurezza di base
File di testo- memorizza la cronologia delle chat
Deviamo dal piano
In questo articolo, tratteremo varie cose e tecnologie interessanti e, infine, avremo chat. È vero, una chat del genere sarebbe difficile da chiamare la chat migliore con il maggior numero di opportunità. Non sarai in grado di prendere a calci o bandire le persone. Diverse persone possono darsi lo stesso nome. Non sarai in grado di vedere tutti i partecipanti alla chat attivi. In altre parole, questo non è IRC per te. È solo una demo interessante e divertente che può essere applicata anche in alcune situazioni. Se desideri migliorare ulteriormente la tua chat e aggiungere molte funzionalità diverse, ti consigliamo di seguire i materiali del nostro sito!
Struttura HTML di base
jQuery/chat PHP
Guarda, qualche prezioso markup. In effetti, il 50% di ciò che stai guardando non ha nulla a che fare con il focus di questo articolo. Il layout di pagina centra le cose. I doppi div applicati al layout della chat e della finestra di messaggio vengono utilizzati solo per aggiungere un effetto a doppio bordo della finestra di messaggio (non realmente necessario).
Le aree più importanti sono la textarea con l'id "sendie" e la message box div. Questo sarà indicato da javascript.
Parte del motore in javascript
Faremo un po' di orientamento agli oggetti con javascript. Creeremo una funzione Chat che sarà il livello più alto del resto delle funzioni relative alle cose relative alla chat.
FunctionChat()(
this.update = updateChat;
this.send = sendChat;
this.getState = getStateOfChat;
}
UpdateChat interrogherà il server se ci sono nuove righe nel file di testo. Se sono presenti, la funzione li pubblicherà nella finestra della chat. sendChat verrà attivato quando il messaggio è già stato stampato e viene premuto il pulsante invia messaggio. La funzione passerà i dati al server per un'ulteriore elaborazione. getStateOfChat interroga il server per il numero di righe in un file di testo, consentendo di confrontare i dati e determinare se ci sono nuove righe o meno. Queste informazioni vengono restituite allo stesso modo di JSON. E le funzioni si presentano così:
//ottiene lo stato della chat
funzione getStateOfChat()(
if(! istanza)(
istanza = vero;
$.ajax((
digita: "POST",
URL: "process.php",
dati:(
"funzione": "getState",
"file": file
},
tipo di dati: "json",
successo: funzione(dati)(
stato = stato dei dati;
istanza=falso;
},
});
}
}
//Aggiorna la chat
aggiornamento della funzioneChat()(
if(! istanza)(
istanza = vero;
$.ajax((
digita: "POST",
URL: "process.php",
dati:(
"funzione": "aggiornamento",
"stato": stato
"file": file
},
tipo di dati: "json",
successo: funzione(dati)(
if(data.text)(
per (var i = 0; i< data.text.length; i++) {
$("#area-chat").append($("
"+data.text[i] +"
"));}
}
document.getElementById("area di chat").scrollTop = document.getElementById("area di chat").scrollHeight;
istanza=falso;
stato = stato dei dati;
},
});
}
altro(
setTimeout(aggiornamentoChat, 1500);
}
}
//invia il messaggio
funzione sendChat(messaggio, nickname)
{
updateChat();
$.ajax((
digita: "POST",
URL: "process.php",
dati:(
"funzione": "invia",
"messaggio": messaggio
"soprannome": soprannome,
"file": file
},
tipo di dati: "json",
successo: funzione(dati)(
updateChat();
},
});
}
Tutte e tre queste funzioni sfruttano le capacità AJAX di jQuery e le associano anche a un file PHP chiamato process.php. Noi, ovviamente, dobbiamo crearlo.
Parte del motore in PHP
Alcune delle informazioni che vengono passate con AJAX sono un valore arbitrario e sono chiamate "funzioni". Fornisce solo informazioni sul file PHP su ciò che è necessario fare. Prima di tutto, imposteremo un valore e imposteremo un interruttore operatore che coprirà tutte le possibili funzioni. Imposteremo anche un array vuoto che conterrà i valori che verranno codificati in JSON e quindi restituiti.
Quando proviamo ad attivare getState, il file di testo verrà letto e verrà calcolato il numero di righe. Dopo aver aggiornato la pagina, il file viene letto completamente e vengono restituite nuove righe. Quando inviamo un messaggio, viene scritto in un file di testo come una nuova riga.
$funzione = $_POST["funzione"];
$log = array();
Interruttore($funzione) (
Caso("getState"):
$linee = file("chat.txt");
}
$log["stato"] = conteggio($linee);
rottura;
caso ("aggiornamento"):
$stato = $_POST["stato"];
if (file_exists("chat.txt")) (
$linee = file("chat.txt");
}
$conteggio = conteggio($righe);
if ($stato == $conteggio)(
$log["stato"] = $stato;
$log["testo"] = falso;
) altro (
$testo=matrice();
$log["stato"] = $stato + conteggio($linee) - $stato;
foreach ($linee come $line_num => $line) (
se ($numero_riga >= $stato)(
$testo = $riga = str_replace("\n", "", $riga);
}
}
$registro["testo"] = $testo;
}
caso("invia"):
$nickname = htmlentities(strip_tags($_POST["nickname"]));
$reg_exUrl = "/(http|https|ftp|ftps)\:\/\/+\.(2,3)(\/\S*)?/";
$messaggio = htmlentities(strip_tags($_POST["messaggio"]));
if (($messaggio) != "\n") (
if (preg_match($reg_exUrl, $messaggio, $url)) (
$messaggio = preg_replace($reg_exUrl, "".$url."", $messaggio);
}
fwrite(fopen("chat.txt", "a"), "". $nickname . "" . $messaggio = str_replace("\n", " ", $messaggio) . "\n");
}
rottura;
}
echo json_encode($log);
?>
Andiamo al sodo
Dobbiamo scrivere un po' di javascript, altrimenti la vacanza non partirà. Scarica jQuery, carica il nostro "motore", quindi segui alcuni passaggi per raccogliere diversi nomi dei partecipanti alla chat per avviare una conversazione.
Lungo la strada, impostiamo un limitatore di lunghezza del messaggio e assegniamo la funzione di invio dei messaggi al pulsante di ritorno.
Controllo periodico di nuovi messaggi
Dovremo utilizzare la funzione "aggiorna" per eseguire il polling del nostro file di testo per il nuovo testo. Poiché abbiamo bisogno di chiamare regolarmente la funzione di aggiornamento, utilizziamo la funzione javascript setInterval():
utilità
*
* Scaricare files: (download: 2128)
Nella demo dal vivo, registro e visualizzo gli indirizzi IP al solo scopo di scoraggiare azioni avverse. Spesso le chat anonime fanno sì che le persone vogliano mostrare il loro lato peggiore. Quindi, ti consiglio di annotare gli indirizzi IP, nel caso in cui dovessi bloccare l'uno o l'altro IP in futuro.
La nota: Tieni presente che questa applicazione è sviluppata in PHP, quindi non puoi semplicemente scaricare i file ed eseguirli sul tuo computer, poiché dovrai eseguire un server PHP locale. Inoltre, durante il caricamento di file sul server, non dimenticare di modificare i permessi sul file "chat.txt" in modo che il server possa scrivervi dati.
Ho iniziato a notare su molti siti la presenza di una finestra di chat o di una finestra di consulenza online. Non è un segreto che Yandex consideri la presenza di una chat o di un consulente sul sito un fattore commerciale positivo. In connessione con questo, ho provato a creare una chat ajax per il sito.
E così siamo andati a scrivere una chat su ajax php. Creiamo il file chat.js e creeremo immediatamente anche i file add.php e get_json.php, ma su di essi in seguito. Crea file chat.php . Colleghiamo jquery e chat.js ad esso. Creiamo nel file chat.php un campo con il nome del partecipante alla chat e un campo con un messaggio nella chat, nonché un pulsante con l'id btnSend per inviare un messaggio. Un gestore di eventi clic è allegato al pulsante con id btnSend nel file chat.js. La chat div con id visualizzerà i nostri messaggi di chat. Di seguito è riportato un elenco di un pezzo di codice dal file chat.php. Non prestare attenzione alle oscure classi CSS, queste sono classi di bootstrap.
In chat.js, elaboriamo i dati dai campi di input e inviamo i dati a add.php utilizzando il metodo post in formato json. Di seguito è riportato un pezzo di codice da chat.js.
$("#btnSend").click(function(elem)( //al clic otteniamo messaggi dai campi con id name e testo var name = $("#name").val(); var text = $(" # text").val(); //e usando il metodo POST in formato json li inviamo a add.php $.post("add.php", (name: name, text: text), function()( //cancella il campo di testo (ad es. rendi vuoto "") $("#testo").attr("valore", ""); )); ));
Nel file add.php otteniamo i dati. Ovviamente, dovrebbero essere controllati dopo la ricezione, ma per ora lo ometteremo. Aggiungiamo una data ai dati e li scriviamo nel file messages.txt in una riga con un separatore "_" univoco. Inoltre, affinché il file non cresca a grandi dimensioni, viene creata la protezione dall'overflow. Quando vengono raggiunte più di 100 righe di messaggio nel file messages.txt, tutte le righe vengono eliminate tranne le ultime cinque. Sono riscritti. Di seguito è riportato l'elenco di add.php .
100 if(count($strings)>100)( //ottiene tutte le righe dal file come array numerato $textarr=file("messages.txt"); $arr=array_slice($textarr, -5); / /riscrivi scrivi i dati solo nel file //le ultime 5 righe dell'array $f = fopen("messages.txt", "w+"); //nel ciclo scrivi i dati nel file, //ogni array valore su una nuova riga nel file foreach($arr as $ar)( $f = fopen("messages.txt", "a+");//open file fwrite($f, $ar);//write fclose ($f);//close file ) ) $ f = fopen("messages.txt", "a+");//open file fwrite($f, date("Ymd H:i:s") . "___ ");//scrivi fwrite($f, $ name . "___");//scrivi nel file fwrite($f, $text . "\n");//scrivi e aggiungi fine riga fclose($f );//chiudi file ) ?>
Ecco fatto, tutti i nostri messaggi vengono scritti in un file. Ora dobbiamo assicurarci che questi messaggi vengano visualizzati sullo schermo. Per fare ciò, scriveremo la funzione chatRequest() nel file chat.js. Questa funzione accede al file get_json.php e gli passa il parametro __maxId. Il parametro _maxId specifica quanti messaggi abbiamo al momento. Il valore predefinito all'inizio è 0. Di conseguenza, per cominciare, definiamo __maxId come variabile globale.
Funzione chatRequest()( // Invio di una richiesta utilizzando il metodo POST. $.post("get_json.php", (maxId: _maxId), chatResult, "json"); )
È inoltre definito nella funzione chatRequest() che se la richiesta viene completata con successo, i dati di risposta vengono restituiti in formato json e viene chiamata la funzione chatResult dal file chat.js. Ma diamo prima un'occhiata al file get_json.php.
Il file get_json.php prende i dati, calcola la stringa che non è stata visualizzata sullo schermo, ne crea un array, lo impacchetta in formato json e lo invia alla funzione chatResult(msgs).
ChatResult aggiunge i dati della stringa ricevuta all'array _messages. Lo abbiamo dichiarato all'inizio del file e ne abbiamo fatto un array. E quindi la funzione restituisce tutti i messaggi scritti in un ciclo dall'array _messages in un div con id #chat . Ho fatto in modo che venissero visualizzati solo gli ultimi cinque messaggi. Per i messaggi pari e dispari, viene visualizzata la loro disposizione. Per il layout, utilizzo di nuovo bootstrap. Elenco della funzione ChatResult.
Funzione chatResult(msgs)( // Aggiunge nuovi messaggi all'array. for(var i = 0; i =0; i--) ( var m = _messages[i]; // controlla se il messaggio è pari se (i %2= =1)( // layout html +="
"+m.testo+" "+m.dt+"
"+m.testo+" "+m.dt+"
"+m.testo+" "+m.dt+"
"+m.testo+" "+m.dt+"
Affinché la nostra chat sia costantemente aggiornata, facciamo continue richieste alla funzione chatRequest() con una frequenza di 2 secondi.
// Richiedi messaggi ogni 2 secondi setInterval(chatRequest, 2000);
Bene, abbiamo scritto una semplice chat php ajax per il sito. Per completare l'immagine, mostreremo l'elenco completo del file chat.js
Var_maxId; var_messaggi; $(document).ready(function()( // Inizializzazione. _maxId = 0; _messages = ; chatRequest(); // Richiede messaggi ogni 2 secondi setInterval(chatRequest, 2000); $("#btnSend").click( function(elem)( //quando viene cliccato, riceviamo messaggi dai campi con id name e testo var name = $("#name").val(); var text = $("#text").val(); // e usando il metodo POST in formato json li inviamo a add.php $.post("add.php", (name: name, text: text), function()( //cancelliamo il campo di testo (che cioè, lo rendiamo vuoto "") $( "#text").attr("value", ""); )); )); )); function chatRequest() ( // Invio di una richiesta utilizzando il metodo POST. $.post("get_json.php", (maxId: _maxId), chatResult, "json"); ) function chatResult(msgs)( // Aggiunta di nuovi messaggi all'array. for(var i = 0; i =0; i--) ( var m = _messages[i]; //verifica se il messaggio è pari se (i%2==1)( //layout html +="
"+m.testo+" "+m.dt+"
"+m.testo+" "+m.dt+"
"+m.testo+" "+m.dt+"
"+m.testo+" "+m.dt+"
aggiornamento 5.10.16
Ha tappato il buco più semplice dal più semplice attacco XSS. Tutti si sono stufati di rompere la chat)). Ero troppo pigro per filtrare i dati in arrivo, ma ho dovuto rifarlo. Funzione di filtraggio.
/*funzione di filtraggio*/ funzione myclear($dt)( $dt=stripslashes($dt); $dt=strip_tags($dt); $dt=trim($dt); return $dt; )
ora il file add.php ha questo aspetto
/* funzione di filtraggio*/ funzione myclear($dt)( $dt=stripslashes($dt); $dt=strip_tags($dt); $dt=trim($dt); return $dt; ) $name = myclear( $_POST["nome"]);//filtro $testo = myclear($_POST["testo"]); //era prima di //$nome = $_POST["nome"]; //$testo = $_POST["testo"]; if(($name != "") && ($testo != ""))( $strings = file("messages.txt"); if(count($strings)>100)( //ottieni tutte le stringhe da file come array numerato $textarr=file("messages.txt"); $arr=array_slice($textarr, -5); //riscrivi i dati nel file scrivi solo le ultime 3 righe dell'array $f = fopen ("messages.txt ", "w+"); //in un ciclo, scrivi i dati nel file, ogni valore dell'array su una nuova riga nel file foreach($arr as $ar)( $f = fopen(" messaggi.txt", "a+");/ /apri file fwrite($f, $ar);//scrivi fclose($f);//chiudi file ) ) $f = fopen("messages.txt", " a+");//apri il file fwrite($ f, date("Ymd H:i:s") . "___");//scrivi fwrite($f, $name . "___");//scrivi su file fwrite($f, $text . "\ n");//registra e aggiungi la fine della riga fclose($f);//chiudi il file )
