Skip to main content

on().subscribe()

Subscribe to realtime changes in your databse.

const mySubscription = supabase
.from('*')
.on('*', payload => {
console.log('Change received!', payload)
})
.subscribe()

Parameters#

  • eventrequiredSupabaseEventTypes

    The database event which you would like to receive updates for, or you can use the special wildcard * to listen to all changes.

  • callbackrequiredobject

    A callback that will handle the payload that is sent whenever your database changes.

Notes#

  • Realtime is disabled by default for new Projects for better database performance and security. You can turn it on by managing replication.
  • If you want to receive the "previous" data for updates and deletes, you will need to set REPLICA IDENTITY to FULL, like this: ALTER TABLE your_table REPLICA IDENTITY FULL;

Examples#

Listen to all database changes#

const mySubscription = supabase
.from('*')
.on('*', payload => {
console.log('Change received!', payload)
})
.subscribe()

Listening to a specific table#

const mySubscription = supabase
.from('countries')
.on('*', payload => {
console.log('Change received!', payload)
})
.subscribe()

Listening to inserts#

const mySubscription = supabase
.from('countries')
.on('INSERT', payload => {
console.log('Change received!', payload)
})
.subscribe()

Listening to updates#

By default, Supabase will send only the updated record. If you want to receive the previous values as well you can enable full replication for the table you are listening too:

alter table "your_table" replica identity full;
const mySubscription = supabase
.from('countries')
.on('UPDATE', payload => {
console.log('Change received!', payload)
})
.subscribe()

Listening to deletes#

By default, Supabase does not send deleted records. If you want to receive the deleted record you can enable full replication for the table you are listening too:

alter table "your_table" replica identity full;
const mySubscription = supabase
.from('countries')
.on('DELETE', payload => {
console.log('Change received!', payload)
})
.subscribe()

Listening to multiple events#

You can chain listeners if you want to listen to multiple events for each table.

const mySubscription = supabase
.from('countries')
.on('INSERT', handleRecordInserted)
.on('DELETE', handleRecordDeleted)
.subscribe()

Listening to row level changes#

You can listen to individual rows using the format {table}:{col}=eq.{val} - where {col} is the column name, and {val} is the value which you want to match.

const mySubscription = supabase
.from('countries:id=eq.200')
.on('UPDATE', handleRecordUpdated)
.subscribe()