Skip to main content
Deno 2 is finally here 🎉️
Learn more
Module

x/live/deps.ts>supabase.RealtimeChannel

deco is the edge-native site editor and app framework for building dynamic, high-performance sites with a built-in visual admin UI.
deco-cx/deco
Go to Latest
class supabase.RealtimeChannel
Re-export
import { supabase } from "https://deno.land/x/live@1.36.6/deps.ts";
const { RealtimeChannel } = supabase;

A channel is the basic building block of Realtime and narrows the scope of data flow to subscribed clients. You can think of a channel as a chatroom where participants are able to see who's online and send and receive messages.

Constructors

new
RealtimeChannel(
topic: string,
)

Properties

bindings: { [key: string]: { type: string; filter: { [key: string]: any; }; callback: Function; id?: string; }[]; }
joinedOnce: boolean
joinPush: Push
pushBuffer: Push[]
rejoinTimer: Timer
state: CHANNEL_STATES
timeout: number
topic: string

Topic name can be any string.

Methods

on(
type: `${REALTIME_LISTEN_TYPES.PRESENCE}`,
filter: { event: `${REALTIME_PRESENCE_LISTEN_EVENTS.SYNC}`; },
callback: () => void,
): RealtimeChannel

Creates an event handler that listens to changes.

on<T extends { [key: string]: any; }>(
type: `${REALTIME_LISTEN_TYPES.PRESENCE}`,
filter: { event: `${REALTIME_PRESENCE_LISTEN_EVENTS.JOIN}`; },
callback: (payload: RealtimePresenceJoinPayload<T>) => void,
): RealtimeChannel
on<T extends { [key: string]: any; }>(
type: `${REALTIME_LISTEN_TYPES.PRESENCE}`,
filter: { event: `${REALTIME_PRESENCE_LISTEN_EVENTS.LEAVE}`; },
callback: (payload: RealtimePresenceLeavePayload<T>) => void,
): RealtimeChannel
on<T extends { [key: string]: any; }>(
type: `${REALTIME_LISTEN_TYPES.POSTGRES_CHANGES}`,
filter: RealtimePostgresChangesFilter<`${REALTIME_POSTGRES_CHANGES_LISTEN_EVENT.ALL}`>,
callback: (payload: RealtimePostgresChangesPayload<T>) => void,
): RealtimeChannel
on<T extends { [key: string]: any; }>(
type: `${REALTIME_LISTEN_TYPES.POSTGRES_CHANGES}`,
filter: RealtimePostgresChangesFilter<`${REALTIME_POSTGRES_CHANGES_LISTEN_EVENT.INSERT}`>,
callback: (payload: RealtimePostgresInsertPayload<T>) => void,
): RealtimeChannel
on<T extends { [key: string]: any; }>(
type: `${REALTIME_LISTEN_TYPES.POSTGRES_CHANGES}`,
filter: RealtimePostgresChangesFilter<`${REALTIME_POSTGRES_CHANGES_LISTEN_EVENT.UPDATE}`>,
callback: (payload: RealtimePostgresUpdatePayload<T>) => void,
): RealtimeChannel
on<T extends { [key: string]: any; }>(
type: `${REALTIME_LISTEN_TYPES.POSTGRES_CHANGES}`,
filter: RealtimePostgresChangesFilter<`${REALTIME_POSTGRES_CHANGES_LISTEN_EVENT.DELETE}`>,
callback: (payload: RealtimePostgresDeletePayload<T>) => void,
): RealtimeChannel
on(
type: `${REALTIME_LISTEN_TYPES.BROADCAST}`,
filter: { event: string; },
callback: (payload: { [key: string]: any; type: `${REALTIME_LISTEN_TYPES.BROADCAST}`; event: string; }) => void,
): RealtimeChannel

The following is placed here to display on supabase.com/docs/reference/javascript/subscribe.

presenceState<T extends { [key: string]: any; } = { }>(): RealtimePresenceState<T>
send(payload: { [key: string]: any; type: string; }, opts?: { [key: string]: any; }): Promise<RealtimeChannelSendResponse>
subscribe(callback?: (status: `${REALTIME_SUBSCRIBE_STATES}`, err?: Error) => void, timeout?: number): RealtimeChannel

Subscribe registers your client with the server

track(payload: { [key: string]: any; }, opts?: { [key: string]: any; }): Promise<RealtimeChannelSendResponse>
unsubscribe(timeout?: number): Promise<"ok" | "timed out" | "error">

Leaves the channel.

Unsubscribes from server events, and instructs channel to terminate on server. Triggers onClose() hooks.

To receive leave acknowledgements, use the a receive hook to bind to the server ack, ie: channel.unsubscribe().receive("ok", () => alert("left!") )

untrack(opts?: { [key: string]: any; }): Promise<RealtimeChannelSendResponse>
updateJoinPayload(payload: { [key: string]: any; }): void