Einfacher Chat mit Ajax

Andal91 · 3. März 2019

Hallo,

ich möchte gerne eine ganze einfach Datenbankabfrage für einen Chat machen.

Der Chat wird kaum benutzt, und mir reicht erstmal eine automatische aktualisierung der Nachrichten.

Ich habe 2 Dateien:

- "Index.php" -> Darstellung der Chatbox

- "chat.php" -> Abfrage der von der Datenbank (Maximal 30 Nachrichten)

In der Index befidnet sicher folgender Code um die chat.php erneut abzufragen und ins Element "Chat" zu schreiben.

Code

$(document).ready(function() {
    $("#chat").load("funktionen/chat.php");
    var refresh = setInterval(function() {
        $("#chat").load("funktionen/chat.php");
    }, 2000);
});

Das funktioniert soweit sehr gut, nur lasse ich auch die Profilbilder anzeigen und man sieht wie die immer wieder neu geladen werden.

Wie schaffe ich es, dass nur der neuste Eintrag geladen wird und nicht immer die letzten kompletten 30 Einträge?

Danke

basti1012 · 3. März 2019

dann schreib doch das php Script um .Da kann man ohne probleme eingeben wie viel und in welcher reinfolge deine Einträge angezeigt werden

Andal91 · 3. März 2019

Hi basti,

verstehe ich nicht ganz. Ich ersetze ja mit Javascript das komplette Div und muss somit auch immer alle Einträge aus der DB lesen und ausgeben.

Ich möchte aber nur die neuen auslesen und dem div hinzufügen.

basti1012 · 3. März 2019

Man liest eine Db mit Php aus und nicht mit Javascript.

Dann sollte man da schon nur das holen was man brauch und nicht 30 Einträge die man dann mit Javascript noch verkürzen muß,

Aber vieleicht verblöde ich gerade auch.

Warten wir mal ab was die Chat profis sagen.

Vieleicht solltest du auch mal zeigen wie dein Php Script zu den Chat aussehen tut , oder vielcht auch Link zu den Chat damit man mal dein Quellcode sehen kann.

Andal91 · 3. März 2019

Sorry, aber ich glaube wir reden aneinander vorbei.

Egal.

m.scatello · 3. März 2019

Zeige dein PHP-Script (chat.php)

Andal91 · 3. März 2019

PHP

<?php

include("../../system/datenbank.php");

// Nachrichten auslesen
$statement = $pdo->prepare("SELECT * FROM chat ORDER BY timestamp DESC LIMIT 30");
$statement->execute(array());   
while($row = $statement->fetch()) {
    $benutzer_id        = $row['benutzer_id'];
    $nachricht          = $row['nachricht'];
    $timestamp          = $row['timestamp'];
   
    
    // Benutzerdaten auslesen
    $statement2 = $pdo->prepare("SELECT * FROM benutzer WHERE id = :benutzer_id LIMIT 1");
    $statement2->execute(array('benutzer_id' => $benutzer_id));   
    while($row2 = $statement2->fetch()) {
        $benutzername          = $row2['benutzername'];
        $bild_nummer            = $row2['bild_nummer'];
        $bild_endung            = $row2['bild_endung'];
        $geburt                 = $row2['geburtstag'];
        $alter = floor((time() - $geburt) / 60 / 60 / 24 / 365);
        
        echo '<div class="content_down_chat_inhalt_nachricht">
                <div class="content_down_chat_inhalt_bild"><img src="profilbilder/'.$bild_nummer.$bild_endung.'" /></div>
                <div class="content_down_chat_inhalt_text">
                    <ul>
                        <li class="benutzername"><a href="">'.$benutzername.' '.$alter.'</a></li>
                        <li class="nachricht">'.$nachricht.'</li>
                    </ul>
                </div>
              </div>';
    }
}

?>

Alles anzeigen

basti1012 · 3. März 2019

du brauchst doch nur noch die 30 in einer 1 aus zutauschen dann hast du doch den letzen Beitrag

Code

ORDER BY timestamp DESC LIMIT 1;

Oder liege ich da jetzt falsch ?

Genau wie deine 2 te while Schleife, da es ja LIMIT 1 ist kann ja nicht mehr als ein Eintrag kommen und somit wird die Schleife ja auch nicht gebraucht. Selbst Limit 1 könnte man auch Weg machen weil es eigentlich ja nur eine benutzerid geben sollte und nie mehr als 1 Person finden darf.

Oder liege ich da auch falsch ????

m.scatello · 4. März 2019

Zitat von basti1012

Oder liege ich da jetzt falsch ?

Ja.

Denkanstoß: Was passiert denn, wenn Chatteilnehmer ganz schnell mehr als einen Beitrag schreiben?

basti1012 · 4. März 2019

Wie kann man das denn dann abfragen? Die will ja nur den letzten Beitrag haben. Wenn den aber über drei neue Beiträge da sind müsste man ja wissen bis wohin gelesen wurde. Da das bei jeden Chat Teilnehmer anders sein kann würde ich erst abfragen ob und wie viele Einträge I in den letzten 5 Minuten oder so geschrieben wurde. Wenn keinen dann lasse ich den letzten Eintrag anzeigen und bei ein oder mehrb dann die neuen Einträge . Ist das schon besser ?

oder hast du da eine bessere idee

m.scatello · 4. März 2019

Man merke sich die ID des zuletzt angezeigten Beitrages und selektiert dementsprechend.

Andal91 · 4. März 2019

@scatello

Das würde ich soweit hinkriegen aber wie kann ich mit Javascript den neuen Eintrag in das Div hinzufügen? Momentan wird ja das ganze Div ausgetauscht.

m.scatello · 5. März 2019

Packe jeden Eintrag in ein eigenes div

Andal91 · 5. März 2019

Habs folgend lösen können:

Vorher (Text wird ersetzt)

Code

Div.InnerHTML = "Chatverlauf"

Nacher (Text wird hinzugefügt)

Code

Div.InnerHTML += "Chatverlauf"

Mir war nicht klar, dass ich auch HTML hinzufügen kann und nicht nur ersetzen kann.

Einfacher Chat mit Ajax

Jetzt mitmachen!

Teilen

Tags