我无法让Supabase实时监听Postgres更改来工作

Question

受到 Supabase 文档的启发，我在 React Native 应用程序中有这段代码：

useEffect(() => {
  if (session?.user?.id === null) return
  const channel = supabase
    .channel('value-db-changes', { selfBroadcast: true })
    .on(
      'postgres_changes',
      {
        event: 'UPDATE',
        schema: 'public',
        table: 'messages',
        filter: `user_id=${session?.user?.id}`
      },
      (payload) => console.log('Supabase change', payload)
    )
    ?.subscribe()
}, [session?.user?.id])

VSCode 警告我，当我编辑数据库中的行时，

Property 'subscribe' does not exist on type 'never'

和

console.log

永远不会显示。

Answer 1

您的代码似乎是正确的。问题可能是您忘记在 supabase 上启用复制。

打开您的supabase项目仪表板，从左侧菜单中选择“数据库”，然后选择“复制”。单击“源”下的“表格”按钮，然后选择您允许实时使用的表格。

Answer 2

您可能正在使用旧版本的 Supabase，但正在尝试 v2 语法。

Supabase v1 实时文档： https://supabase.com/docs/reference/javascript/subscribe

根据 v2 的最新更新 - https://supabase.com/blog/supabase-js-v2,

// v2
supabaseClient
  .channel('any_string_you_want')
  .on(
    'postgres_changes',
    {
      event: 'INSERT',
      schema: 'public',
      table: 'movies',
    },
    (payload) => {
      console.log(payload)
    }
  )
  .subscribe()

// v1
supabase
  .from('movies')
  .on('INSERT', (payload) => {
    console.log(payload)
  })
  .subscribe()

我对此代码也有类似的问题，但使用 v1 语法安装正确的版本是有效的，

npm uninstall @supabase/supabase-js@rc
npm uninstall @supabase/supabase-js
npm install @supabase/supabase-js

Answer 3

嗨👋🏼，通过将您的代码片段与supabase文档进行比较，它通常应该可以工作。

我假设你的监听器没有被触发，因为其中之一：

• 过滤器太具体，您的更改不会触发它：例如您是否正在使用与您正在收听的相同的

  messages

  来编辑

  user.id

  表格？
• Supabase 文档中没有

  selfBroadcast

  选项，快速互联网搜索也没有找到它

作为第一步，我将设置最广泛的订阅并测试该订阅是否被触发以及有效负载中的内容。然后逐步创建过滤器以仅侦听感兴趣的事件。

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

Answer 4

您可能还需要检查 RLS。该用户是否有权访问正在更改的行？