on().subscribe()

Subscribe to realtime changes in your databse.

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

Parameters

  • eventrequiredINSERT | UPDATE | DELETE | *

    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

  • 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

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

Listening to deletes

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()