Sistem Berbasis Website

Contoh Aplikasi Chat Realtime dengan Ratchet, MySQL, Bootstrap, CSS, dan CodeIgniter 4

Tutorial membuat aplikasi chat realtime CodeIgniter 4 menggunakan Ratchet WebSocket, MySQL, Bootstrap, CSS, dan JavaScript lengkap dengan source code.

Contoh coding Contoh Aplikasi Chat Realtime dengan Ratchet, MySQL, Bootstrap, CSS, dan CodeIgniter 4
Langkah 6 dari 12

Membuat Server WebSocket Ratchet

Buat app/Libraries/ChatServer.php dan implementasikan MessageComponentInterface:

class ChatServer implements MessageComponentInterface
{
    private SplObjectStorage $clients;
    private MessageModel $messages;

    public function __construct()
    {
        $this->clients = new SplObjectStorage();
        $this->messages = new MessageModel();
    }

    public function onOpen(ConnectionInterface $conn): void
    {
        $this->clients->attach($conn, [
            'room' => '',
            'client_id' => '',
            'user_name' => '',
            'last_message_at' => 0.0,
        ]);
    }

    public function onClose(ConnectionInterface $conn): void
    {
        if ($this->clients->contains($conn)) {
            $this->clients->detach($conn);
        }
    }
}

SplObjectStorage menyimpan koneksi aktif beserta metadata room. Source lengkap juga memeriksa header Origin sebelum menerima koneksi.

Method onMessage() membedakan dua tipe payload:

{"type":"join","room":"umum","client_id":"...","user_name":"Agung"}
{"type":"message","message":"Halo, apakah pesan ini realtime?"}

Pesan divalidasi, disimpan, lalu hanya dikirim ke client pada room yang sama:

foreach ($this->clients as $client) {
    $clientMeta = $this->clients[$client];

    if ($clientMeta['room'] === $meta['room']) {
        $client->send($outgoing);
    }
}