Supabase Realtime Subscriptions with Ionic 7 and VueJS 3 not working properly

60 views Asked by At

I am building an app with Ionic 7.1.1 and VueJS 3. Apart from that I am using Supabase for my data.

I am declaring my respective database / table as being realtime, as stated in the documentation. Furthermore I am able to retrieve data with my supabase-js based client.

If i now instantiate a supabase as follows from within my "onMounted"-Hook ...

subscriptionInserts.value = supabase
      .channel('schema-db-changes')
      .on(
          'postgres_changes',
          {
            event: '*',
            schema: 'public',
          },
          (payload) => console.log(payload)
      )
      .subscribe((status, err) => {
        if(err) console.log("SUBSCRIPTION ERROR:", err);
        else console.log("SUBSCRIPTION STATUS CHANGED:", status);
      })

... I get the following result in my browser console:

SUBSCRIPTION STATUS CHANGED: SUBSCRIBED

After 10 seconds (always 10 seconds) I receive SUBSCRIPTION STATUS CHANGED: CLOSED.

Does anyone has any idea why my connection is closed always after 10 seconds?

I tried realizing my subscription in different hooks and tried to listen to different events respectively tables. Nothing did help and my subscription got cancled always after 10 seconds. Within these 10 seconds everything is fine but after no events are triggered anymore.

I also used the supabase inspector. Everything works quite fine so it seems to be either a VueJS specific problem or something related to Ionic.

0

There are 0 answers