Echtzeit-Chat mit CodeIgniter und WebSocket erstellen: praktische Anleitung

Wer schon einmal einen Online-Chat genutzt hat — von WhatsApp Web bis zu einem Live-Support-Fenster — hat bemerkt, dass Nachrichten sofort erscheinen, ohne die Seite neu laden zu müssen. Möglich ist das durch WebSockets, eine Technologie, die Browser und Server erlaubt, Daten in Echtzeit über eine einzige, dauerhaft offene Verbindung auszutauschen, statt für jede Anfrage eine neue zu öffnen, wie es das klassische HTTP tut.

In dieser Anleitung bauen wir einen einfachen Echtzeit-Chat mit CodeIgniter, einem schlanken und weit verbreiteten PHP-Framework, kombiniert mit einer PHP-Bibliothek speziell für WebSocket-Verbindungen. Ziel ist es, die Architektur und die wichtigsten Schritte zu verstehen, damit das Projekt später an eigene Bedürfnisse angepasst werden kann.

Warum klassisches HTTP für einen Chat nicht reicht

HTTP, das Protokoll, mit dem der Browser Webseiten lädt, funktioniert anfragebasiert: Der Client (der Browser) fragt den Server nach etwas, der Server antwortet, und die Verbindung wird geschlossen. Für einen Chat wäre das unpraktisch: Der Browser müsste alle paar Sekunden nachfragen "gibt es neue Nachrichten?" (eine Technik namens Polling), was Ressourcen verschwendet und spürbare Verzögerungen verursacht.

WebSockets lösen dieses Problem, indem sie einen bidirektionalen Kommunikationskanal öffnen, der aktiv bleibt: Sobald die Verbindung steht, können Server und Browser jederzeit Nachrichten senden, ohne eine neue Anfrage von Grund auf zu starten. Dasselbe Prinzip nutzen Messaging-Apps, Live-Benachrichtigungen in Admin-Dashboards und browserbasierte Mehrspieler-Spiele.

Die Architektur: zwei getrennte Prozesse

Ein wichtiges Detail vorab: CodeIgniter ist, wie die meisten klassischen PHP-Frameworks, dafür gebaut, "klassische" HTTP-Anfragen über einen Webserver wie Apache oder Nginx mit PHP-FPM zu verarbeiten. Dieses PHP-Ausführungsmodell ist nicht dafür gedacht, Tausende dauerhafter Verbindungen offen zu halten — genau das aber braucht ein WebSocket-Server.

Die gängigste Lösung, die wir hier verwenden, besteht darin, die beiden Aufgaben zu trennen:

• Die CodeIgniter-Anwendung kümmert sich weiterhin um alles andere: Seiten, Authentifizierung, Speichern des Nachrichtenverlaufs in der Datenbank, REST-APIs.
• Ein separater PHP-Prozess, über die Kommandozeile gestartet und dauerhaft laufend, verwaltet ausschließlich die WebSocket-Verbindungen mithilfe einer dedizierten Bibliothek (hier Ratchet, eine der meistgenutzten PHP-Bibliotheken dafür).

Die beiden Prozesse kommunizieren bei Bedarf miteinander (etwa um eine Nachricht in der Datenbank zu speichern), bleiben aber unabhängig: Startet der WebSocket-Server neu, läuft die Hauptseite ganz normal weiter.

Voraussetzungen

• PHP 8.2 oder neuer: die Mindestanforderung aktueller CodeIgniter-4-Versionen (4.7.4, zum Zeitpunkt des Schreibens die aktuellste, ist auch mit PHP 8.5 kompatibel).
• Composer, der PHP-Paketmanager, um CodeIgniter und die benötigten Bibliotheken zu installieren.
• Ein bereits angelegtes CodeIgniter-4-Projekt (erstellt mit composer create-project codeigniter4/appstarter projektname).
• Die aktivierte PHP-Erweiterung sockets, notwendig für den Betrieb des WebSocket-Servers.

Schritt 1: die WebSocket-Bibliothek installieren

Im CodeIgniter-Projektordner installieren wir Ratchet über Composer:

composer require cboden/ratchet

Ratchet ist eine Bibliothek, die das WebSocket-Protokoll in PHP auf Basis von ReactPHP implementiert, einem Framework für asynchrone Programmierung: Sie erlaubt unserem PHP-Skript, viele Verbindungen gleichzeitig zu verwalten, ohne beim Warten auf jede einzelne zu blockieren.

Schritt 2: die Chat-Logik schreiben

Wir erstellen eine Klasse, die Ratchets MessageComponentInterface implementiert. Diese Klasse legt fest, was passiert, wenn sich ein Nutzer verbindet, eine Nachricht sendet oder die Verbindung trennt. Ein vereinfachtes Beispiel, etwa gespeichert unter app/Libraries/ChatServer.php:

class ChatServer implements MessageComponentInterface {
  protected $clients;
  public function __construct() { $this->clients = new \SplObjectStorage; }
  public function onOpen($conn) { $this->clients->attach($conn); }
  public function onMessage($from, $msg) {
    foreach ($this->clients as $client) {
      if ($from !== $client) { $client->send($msg); }
    }
  }
  public function onClose($conn) { $this->clients->detach($conn); }
  public function onError($conn, $e) { $conn->close(); }
}

In der Praxis: Trifft eine Nachricht von einem Nutzer ein (onMessage), wird sie an alle anderen verbundenen Nutzer außer dem Absender weitergeleitet. Das ist die Grundlogik eines Gruppenchats; darauf aufbauend lassen sich separate Räume, Benutzernamen, Privatnachrichten und eine Speicherung in der Datenbank ergänzen.

Schritt 3: den WebSocket-Server starten

Dafür braucht man ein kleines Skript, das über das Terminal gestartet wird, getrennt vom normalen CodeIgniter-Ablauf, etwa chat_server.php im Projektstamm:

$server = IoServer::factory(new HttpServer(new WsServer(new ChatServer())), 8080);
$server->run();

Gestartet mit php chat_server.php, lauscht der Server auf Port 8080 und ist bereit, WebSocket-Verbindungen anzunehmen. In der Produktion sollte dieses Skript mit einem Tool wie Supervisor dauerhaft am Laufen gehalten werden, das es nach einem Absturz automatisch neu startet, und hinter einem Reverse Proxy (Nginx oder Apache) liegen, der das SSL-Zertifikat verwaltet, damit die sichere Verbindung über wss:// statt des einfachen ws:// bereitgestellt wird.

Schritt 4: das Frontend anbinden

In der CodeIgniter-View der Chat-Seite reichen wenige Zeilen natives JavaScript, um sich mit dem WebSocket-Server zu verbinden, ganz ohne externe Bibliothek:

const socket = new WebSocket('wss://deineseite.de:8080');
socket.onmessage = (event) => { /* empfangene Nachricht auf der Seite anzeigen */ };
document.getElementById('senden').onclick = () => { socket.send(nachrichtentext); };

Von hier aus lässt sich die Oberfläche mit einem CSS-Framework wie Bootstrap (häufig zusammen mit CodeIgniter genutzt) ansprechender gestalten, oder man bindet die bereits von der CodeIgniter-Anwendung verwaltete Authentifizierung ein, indem beim Verbindungsaufbau ein Token übergeben wird, um zu prüfen, wer gerade schreibt.

Eine fertige Alternative

Wer den WebSocket-Server nicht von Grund auf selbst schreiben möchte, kann sich Composer-Pakete ansehen, die gezielt für die Integration mit den spark-Kommandos von CodeIgniter 4 entwickelt wurden, etwa takielias/codeigniter4-websocket. Es liefert eine fertige Struktur mit Callbacks für Authentifizierung, Räume und Timer, startbar über einen eigenen Befehl statt eines separaten Skripts. Praktisch für schnelles Prototyping, basiert aber weiterhin auf derselben Ratchet-Bibliothek von oben.

Fazit

Einem CodeIgniter-Projekt einen Echtzeit-Chat hinzuzufügen bedeutet nicht, das Framework aufzugeben: Es bedeutet lediglich, ihm einen kleinen, dedizierten PHP-Prozess an die Seite zu stellen, aufgebaut auf einer Bibliothek wie Ratchet, der nur den "immer verbundenen" Teil übernimmt. Sobald man dieses Muster verstanden hat — eine klassische Anwendung auf der einen, ein dauerhafter WebSocket-Server auf der anderen Seite —, lässt sich dieselbe Logik auf Live-Benachrichtigungen, automatisch aktualisierte Dashboards oder jede andere Funktion übertragen, die eine sofortige Kommunikation zwischen Server und Browser erfordert.

Offizielle Quellen

• CodeIgniter 4 – Systemanforderungen
• CodeIgniter 4.7.4 – Offizielles Änderungsprotokoll
• Ratchet – WebSocket-Bibliothek für PHP (GitHub)
• codeigniter4-websocket – WebSocket-Integration für CodeIgniter 4