Créer un chat en temps réel avec CodeIgniter et WebSocket : guide pratique

Si vous avez déjà utilisé un chat en ligne — de WhatsApp Web à une fenêtre de support en direct — vous avez remarqué que les messages apparaissent instantanément, sans avoir à recharger la page. Cela est possible grâce aux WebSockets, une technologie qui permet au navigateur et au serveur d'échanger des données en temps réel via une connexion unique et continuellement ouverte, au lieu d'en ouvrir une nouvelle pour chaque requête comme le fait le protocole HTTP classique.

Dans ce guide, nous allons construire un chat simple en temps réel avec CodeIgniter, un framework PHP léger et très répandu, associé à une bibliothèque PHP dédiée à la gestion des WebSockets. L'objectif est de comprendre l'architecture et les étapes clés, afin de pouvoir ensuite adapter le projet à vos besoins.

Pourquoi le HTTP classique ne suffit pas pour un chat

Le protocole HTTP, celui que le navigateur utilise pour charger les pages web, fonctionne requête par requête : le client (le navigateur) demande quelque chose au serveur, le serveur répond, puis la connexion se ferme. Pour une messagerie, cette approche serait peu pratique : le navigateur devrait sans cesse demander « y a-t-il de nouveaux messages ? » toutes les quelques secondes (une technique appelée polling), gaspillant des ressources et introduisant un délai perceptible.

Les WebSockets résolvent ce problème en ouvrant un canal de communication bidirectionnel qui reste actif : une fois la connexion établie, le serveur et le navigateur peuvent tous deux envoyer des messages à tout moment, sans devoir refaire une requête depuis le début. C'est le même principe qu'utilisent les applications de messagerie, les notifications en direct dans les tableaux de bord d'administration et les jeux multijoueurs dans le navigateur.

L'architecture : deux processus distincts

Un détail important à comprendre avant de commencer : CodeIgniter, comme la plupart des frameworks PHP traditionnels, est conçu pour traiter des requêtes HTTP « classiques » via un serveur web comme Apache ou Nginx avec PHP-FPM. Ce modèle d'exécution PHP n'est pas conçu pour maintenir ouvertes des milliers de connexions persistantes, ce qui est pourtant exactement ce dont un serveur WebSocket a besoin.

La solution la plus courante, et celle que nous allons utiliser ici, consiste à séparer les deux responsabilités :

• L'application CodeIgniter continue de gérer tout le reste : pages, authentification, enregistrement de l'historique des messages en base de données, API REST.
• Un processus PHP distinct, lancé depuis la ligne de commande et maintenu en exécution continue, gère exclusivement les connexions WebSocket à l'aide d'une bibliothèque dédiée (ici Ratchet, l'une des bibliothèques PHP les plus utilisées à cet effet).

Les deux processus communiquent entre eux lorsque nécessaire (par exemple pour enregistrer un message en base de données), mais restent indépendants : si le serveur WebSocket redémarre, le site principal continue de fonctionner normalement.

Prérequis

• PHP 8.2 ou version ultérieure : c'est l'exigence minimale des versions récentes de CodeIgniter 4 (la 4.7.4, la dernière disponible à l'heure où nous écrivons, est également compatible avec PHP 8.5).
• Composer, le gestionnaire de dépendances PHP, pour installer CodeIgniter et les bibliothèques nécessaires.
• Un projet CodeIgniter 4 déjà créé (via composer create-project codeigniter4/appstarter nom-du-projet).
• L'extension PHP sockets activée, nécessaire au fonctionnement du serveur WebSocket.

Étape 1 : installer la bibliothèque WebSocket

Dans le dossier du projet CodeIgniter, installez Ratchet via Composer :

composer require cboden/ratchet

Ratchet est une bibliothèque qui implémente le protocole WebSocket en PHP en s'appuyant sur ReactPHP, un framework de programmation asynchrone : il permet à notre script PHP de gérer de nombreuses connexions simultanément sans se bloquer en attendant chacune d'elles.

Étape 2 : écrire la logique du chat

Créons une classe qui implémente l'interface MessageComponentInterface de Ratchet. Cette classe définit ce qui se passe lorsqu'un utilisateur se connecte, envoie un message ou se déconnecte. Un exemple simplifié, à enregistrer par exemple dans 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(); }
}

En pratique : lorsqu'un message arrive d'un utilisateur (onMessage), on le retransmet à tous les autres utilisateurs connectés, sauf à l'expéditeur. C'est la logique de base d'un chat de groupe ; à partir de là, on peut ajouter des salons séparés, des pseudonymes, des messages privés et un enregistrement en base de données.

Étape 3 : démarrer le serveur WebSocket

Il faut un petit script à lancer depuis le terminal, séparé du flux normal de CodeIgniter, par exemple chat_server.php à la racine du projet :

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

En le lançant avec php chat_server.php, le serveur restera à l'écoute sur le port 8080, prêt à accepter des connexions WebSocket. En production, ce script doit être maintenu actif avec un outil comme Supervisor, qui le redémarre automatiquement en cas de plantage, et placé derrière un reverse proxy (Nginx ou Apache) gérant le certificat SSL, afin d'exposer la connexion sécurisée wss:// plutôt que le simple ws://.

Étape 4 : connecter le frontend

Dans la vue CodeIgniter de la page de chat, quelques lignes de JavaScript natif suffisent pour se connecter au serveur WebSocket, sans bibliothèque externe :

const socket = new WebSocket('wss://votresite.fr:8080');
socket.onmessage = (event) => { /* afficher le message reçu dans la page */ };
document.getElementById('envoyer').onclick = () => { socket.send(texteMessage); };

À partir de là, on peut enrichir l'interface avec un framework CSS comme Bootstrap (souvent utilisé avec CodeIgniter) pour rendre le chat plus agréable, ou intégrer l'authentification déjà gérée par l'application CodeIgniter, en transmettant un jeton au moment de la connexion pour vérifier qui écrit.

Une alternative prête à l'emploi

Pour ceux qui préfèrent ne pas écrire le serveur WebSocket de zéro, il existe des paquets Composer conçus spécifiquement pour s'intégrer aux commandes spark de CodeIgniter 4, comme takielias/codeigniter4-websocket, qui fournit une structure prête à l'emploi avec des callbacks pour l'authentification, les salons et les timers, démarrable via une commande dédiée plutôt qu'un script séparé. Pratique pour prototyper rapidement, tout en reposant sur la même bibliothèque Ratchet décrite plus haut.

Conclusion

Ajouter un chat en temps réel à un projet CodeIgniter ne signifie pas abandonner le framework : il s'agit simplement de lui associer un petit processus PHP dédié, basé sur une bibliothèque comme Ratchet, qui ne gère que la partie « toujours connectée ». Une fois ce schéma compris — une application classique d'un côté, un serveur WebSocket persistant de l'autre — on peut étendre la même logique à des notifications en direct, des tableaux de bord mis à jour automatiquement, ou toute autre fonctionnalité nécessitant une communication instantanée entre serveur et navigateur.

Sources officielles

• CodeIgniter 4 – Prérequis système
• CodeIgniter 4.7.4 – Journal des modifications officiel
• Ratchet – bibliothèque WebSocket pour PHP (GitHub)
• codeigniter4-websocket – intégration WebSocket pour CodeIgniter 4