Canali Presence e Broadcast
Vada oltre le modifiche alle tabelle con Supabase Realtime Presence per monitorare chi è online e Broadcast per inviare messaggi temporanei tra client.
Canali Presence e Broadcast è una lezione Supabase Backend as a Service gratuita su CoddyKit. Questa è la lezione 4 di 4. Puoi leggere la lezione completa qui gratuitamente — poi esercitati direttamente nel browser con un editor di codice integrato e un tutor IA disponibile 24/7. Fa parte del percorso di apprendimento Supabase Backend as a Service, e i tuoi progressi si sincronizzano tra il web e l'app CoddyKit. Il corso Supabase Backend as a Service include 4 lezioni in totale.
Parti di questa lezione non sono ancora state tradotte e vengono mostrate in inglese.
Two More Realtime Features
Besides Postgres change streams, Supabase Realtime offers Presence (track online users) and Broadcast (send transient messages). Neither requires a database table.
What Is Presence?
Presence lets each client share small state (like a username or cursor position) and see everyone else's state in the same channel in real time.
Creating a Channel
A channel is a named room clients join.
const room = supabase.channel('room-1', {
config: { presence: { key: 'user-42' } }
});Tracking Presence
After subscribing, call track to publish your state to everyone in the channel.
room.subscribe(async (status) => {
if (status === 'SUBSCRIBED') {
await room.track({ name: 'Ada', online_at: Date.now() });
}
});Reading Who Is Online
Listen for sync events and read the current presence state of all members.
room.on('presence', { event: 'sync' }, () => {
const state = room.presenceState();
console.log('Online:', Object.keys(state).length);
});Join and Leave Events
Presence emits join and leave events so you can animate users appearing and disappearing.
room.on('presence', { event: 'join' }, ({ newPresences }) => {
console.log('Joined:', newPresences.length);
});What Is Broadcast?
Broadcast sends low-latency messages to everyone in a channel without storing them. Great for cursors, typing indicators, and game moves.
Sending a Broadcast
Use send with a custom event name and payload.
room.send({
type: 'broadcast',
event: 'cursor',
payload: { x: 120, y: 80 }
});Receiving a Broadcast
Subscribe to the same event name to handle incoming messages.
room.on('broadcast', { event: 'cursor' }, ({ payload }) => {
console.log('Cursor at', payload.x, payload.y);
});Cleaning Up
Always remove channels when a component unmounts to free connections.
function cleanup(channel, supabase) {
supabase.removeChannel(channel);
return 'removed';
}
console.log(cleanup('chan', { removeChannel: () => {} }));Choosing the Right Tool
Use Postgres changes for persisted data, Presence for online status, and Broadcast for fast disposable messages.
Quick Check
Test your understanding of Presence and Broadcast.
Recap
You learned to track online users with Presence and send ephemeral messages with Broadcast, plus when to use each versus Postgres change streams, and to clean up channels.
Impara Supabase Backend as a Service con un tutor IA — gratis
Scrivi ed esegui vero codice nel tuo browser, ricevi aiuto istantaneo da un tutor IA disponibile 24/7, e riprendi da dove hai lasciato sul web o nell'app.
- Corsi
- 11
- Lezioni
- 40
Domande Frequenti
La lezione «Canali Presence e Broadcast» è gratuita?
Sì — il testo completo di «Canali Presence e Broadcast» è gratuito qui sul web. Per esercitarvi in modo interattivo (un editor di codice integrato e un tutor IA 24/7) e sbloccare il resto del corso Supabase Backend as a Service, passa a CoddyKit PRO. Il corso Supabase Backend as a Service include 4 lezioni in totale.
Cosa imparerò in «Canali Presence e Broadcast»?
Vada oltre le modifiche alle tabelle con Supabase Realtime Presence per monitorare chi è online e Broadcast per inviare messaggi temporanei tra client. Eserciti Supabase Backend as a Service con codice pratico che esegui direttamente nel browser, e un tutor IA 24/7 risponde alle tue domande mentre lavori sulla lezione.
Ho bisogno di esperienza per iniziare Supabase Backend as a Service?
Non è richiesta alcuna esperienza precedente. Supabase Backend as a Service su CoddyKit è strutturato per principianti e studenti avanzati, quindi puoi iniziare da qui o dall'inizio e procedere al tuo ritmo. Questa è la lezione 4 di 4.
Quanto tempo richiede la lezione «Canali Presence e Broadcast»?
La maggior parte delle lezioni CoddyKit richiede circa 5–10 minuti. Ogni lezione è breve e interattiva, quindi fai progressi costanti e riprendi esattamente da dove hai lasciato su web e app.
Posso scrivere ed eseguire codice in questa lezione Supabase Backend as a Service?
Sì. Ogni lezione Supabase Backend as a Service include un editor di codice integrato, quindi scrivi ed esegui codice reale direttamente nel tuo browser e ricevi feedback istantaneo dall'IA — nessuna configurazione locale necessaria.
Tutte le lezioni di questo corso
- Comprendere le sottoscrizioni realtime
- Sottoscrizione alle modifiche delle tabelle
- Creazione di una funzionalità di chat live
- Canali Presence e Broadcast