Das Tutorial setzt voraus, dass ihr bereits die Grundlagen von Comet hier erlernt habt: [wiki]AJAX / Comet Chat Tutorial[/wiki]
== JavaScript ==
Wir ändern unsern Chat Konstruktor Aufruf ab. Wir werden nicht mehr mit JavaScript Zeitstempeln, sondern mit Primärschlüsseln arbeiten:
== PHP Backend ==
Unser PHP Backend wird versuchen die Daten aus der Datenbank zu holen. Falls der lastupdate nicht angegeben wird, so zeigen wir die letzten 10 Nachrichten an.
Um die Serverlast zu reduzieren werden die Verbindungen maximal 30 Sekunden gehalten.
Alles anzeigen
== Neue Einträge ==
Um das Beispiel "rund" zu machen, binden wir ein Formular ein, dass wir in einem iframe laden:
=== Iframe ===
Der Iframe muss in der Hauptseite platziert werden:
=== Formular ===
Alles anzeigen
== Download ==
Ladet euch das Archiv hier herunter. Die betroffenen Zeilen sind die example3-* Files: demo.easy-coding.de/ajax/comet-chat-tutorial/download.zip
== JavaScript ==
Wir ändern unsern Chat Konstruktor Aufruf ab. Wir werden nicht mehr mit JavaScript Zeitstempeln, sondern mit Primärschlüsseln arbeiten:
== PHP Backend ==
Unser PHP Backend wird versuchen die Daten aus der Datenbank zu holen. Falls der lastupdate nicht angegeben wird, so zeigen wir die letzten 10 Nachrichten an.
Um die Serverlast zu reduzieren werden die Verbindungen maximal 30 Sekunden gehalten.
Quellcode
- <?php
- require('connect.php');
- function getNewMessagesSince($timestamp, $limit) {
- $lastupdate = array();
- $html = '';
- // get last ten messages
- if($timestamp == -1) {
- $sql = 'SELECT id, body FROM nachrichten ORDER BY id DESC LIMIT '.intval($limit);
- }
- // get latest messages
- else {
- $sql = 'SELECT id, body FROM nachrichten WHERE id > '.intval($timestamp).' ORDER BY id DESC LIMIT '.intval($limit);
- }
- $res = mysql_query($sql);
- while ($row = mysql_fetch_array($res)) {
- $lastupdate[] = $row['id'];
- $html .= '<li>'.htmlentities($row['body'], ENT_QUOTES, 'UTF-8').'</li>';
- }
- if(count($lastupdate)) {
- rsort($lastupdate);
- return array(
- 'lastupdate' => array_shift($lastupdate),
- 'html' => $html
- );
- }
- return false;
- }
- $lastupdate = isset($_POST['lastupdate']) ? $_POST['lastupdate'] : null;
- $limit = isset($_POST['limit']) ? $_POST['limit'] : 10;
- $timeout = time() + 10;
- while(!($row = getNewMessagesSince($lastupdate, $limit)) && time() < $timeout) {
- usleep(200000);
- }
- echo json_encode($row);
== Neue Einträge ==
Um das Beispiel "rund" zu machen, binden wir ein Formular ein, dass wir in einem iframe laden:
=== Iframe ===
Der Iframe muss in der Hauptseite platziert werden:
=== Formular ===
Quellcode
- <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
- <html xmlns="http://www.w3.org/1999/xhtml" dir="ltr" xml:lang="de">
- <head>
- <title>AJAX & Comet</title>
- <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
- </head>
- <body>
- <?php
- if(count($_POST)) {
- require('connect.php');
- $sql = 'INSERT INTO nachrichten (body) VALUES ("'.mysql_real_escape_string($_POST['body']).'")';
- mysql_query($sql) or die(mysql_error());
- }
- ?>
- <form method="post">
- <textarea name="body"></textarea>
- <input type="submit" />
- </form>
- </body>
- </html>
== Download ==
Ladet euch das Archiv hier herunter. Die betroffenen Zeilen sind die example3-* Files: demo.easy-coding.de/ajax/comet-chat-tutorial/download.zip
11.943 mal gelesen