Channels (WebSocket) Dasar — CompileDaily Study

Penjelasan

Channel adalah abstraksi Phoenix untuk komunikasi WebSocket dua arah yang lebih fleksibel dibanding LiveView, cocok untuk kasus seperti aplikasi chat custom atau integrasi dengan client non-browser (mobile app, game). Client bergabung ke sebuah topic lewat join/3, dan setelah bergabung bisa mengirim pesan (event) yang ditangani handle_in/3 di server, atau menerima pesan lewat push/3 dan broadcast/3. Berbeda dari LiveView yang mengelola HTML di server, Channel murni mengirim data (biasanya JSON) dan client bertanggung jawab merender tampilannya sendiri, biasanya lewat JavaScript memakai library phoenix.js. Channel didaftarkan di UserSocket lewat macro channel dengan pola topic tertentu.

Contoh Konsep

defmodule TokoAppWeb.ChatChannel do
  use TokoAppWeb, :channel

  def join("chat:lobby", _payload, socket) do
    {:ok, socket}
  end

  def handle_in("pesan_baru", %{"body" => body}, socket) do
    broadcast!(socket, "pesan_baru", %{body: body})
    {:noreply, socket}
  end
end

# lib/toko_app_web/channels/user_socket.ex
# channel "chat:*", TokoAppWeb.ChatChannel

Praktikum

Buat NotifikasiChannel yang bergabung ke topic notifikasi:user_id dan mem-broadcast event notifikasi_baru ke semua subscriber topic tersebut.

Editor Latihan

Ketik/edit bebas di sini untuk latihan — kode ini tidak dijalankan.

Tips

Gunakan LiveView untuk kebanyakan kebutuhan UI real-time karena lebih sederhana; pilih Channel hanya jika benar-benar butuh protokol custom atau client bukan browser.