Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Real time not working in Local Dev #21624

Open
2 tasks done
Mohammed-Yasin-Mulla opened this issue Feb 28, 2024 · 20 comments
Open
2 tasks done

Real time not working in Local Dev #21624

Mohammed-Yasin-Mulla opened this issue Feb 28, 2024 · 20 comments
Labels
awaiting-details For issues needing detail from the opener. bug Something isn't working needs-analysis Issue status is unknown and/or not possible to triage with the current info realtime Supabase Realtime related self-hosted Issues related to self hosting

Comments

@Mohammed-Yasin-Mulla
Copy link
Contributor

Bug report

  • I confirm this is a bug with Supabase, not my application.
  • I confirm I have searched the Docs, GitHub Discussions, and Discord.

Describe the bug

Real-Time is NOT working on local-dev env but works fine on the supabase instance
using the same code

also tried re-installing local docker image as well

Enabled in the config.toml file
image

also have real-time enabled in local dev using the studio
Screenshot from 2024-02-28 11-42-19

Code snippet :

const supabase = createClient<Database>(
  supabaseUrl,
  supabaseAnonKey,
  {
    auth: {
      storage: AsyncStorage,
      autoRefreshToken: true,
      persistSession: true,
      detectSessionInUrl: false,
    },
  }
);


  useEffect(() => {
    const subscription = supabase
      .channel('custom-all-channel')
      .on('postgres_changes', { event: '*', schema: 'public', table: 'user_orders' }, payload => {
        refetch();
        console.warn(payload);
      })
      .subscribe();

    return () => {
      refetch();
      supabase.removeChannel(subscription);
    };
  }, []);

To Reproduce

  • spin up a local supabase instance
  • link your local instance to your supabase instance and sync the data
  • enable real-time in your local supabase project
  • try using it on your client projects to your local supabase instance to see real-time not working

Expected behaviour

Real-time functionality should work as it works on the supabase instance

System information

  • OS: [Ubuntu]
  • Version of supabase-js: [2.38.0]
  • Version of Node.js: [v18.19.1]
@Mohammed-Yasin-Mulla Mohammed-Yasin-Mulla added the bug Something isn't working label Feb 28, 2024
@encima
Copy link
Member

encima commented Feb 28, 2024

Thanks for reporting this, can you confirm that realtime also does not work in the dashboard (selecting realtime in the menu and joining a channel)?
Do all of the docker containers report healthy and what are the logs from realtime? 🙏

@encima encima added self-hosted Issues related to self hosting realtime Supabase Realtime related needs-analysis Issue status is unknown and/or not possible to triage with the current info labels Feb 28, 2024
@Mohammed-Yasin-Mulla
Copy link
Contributor Author

@encima Unfortunately the real-time menu is not available in the local-dev instance,
image

I do have the database replication on for the user_orders table.
image

I am not that experienced with docker, please do let me know if I need to share some more info on this.
image

image

These are the logs I captured just after I removed a row from the table
image

There still are no changes reflected

@Mohammed-Yasin-Mulla
Copy link
Contributor Author

Mohammed-Yasin-Mulla commented Feb 28, 2024

Just confirmed once again, that it does work on the supabase instance.
Points ✅ in the supabase instance

  • Database Replications is turned on for the table user_orders
  • Enable Realtime turned on using the studio when editing the table

@encima
Copy link
Member

encima commented Feb 28, 2024

Ah yes, sorry, my bad, you are right.

The docker logs you included are the most useful here, they point to an issue with authentication. This could be an issue with the user you are subscribing to or the JWT secret you have set locally

@Mohammed-Yasin-Mulla
Copy link
Contributor Author

Mohammed-Yasin-Mulla commented Feb 28, 2024

I am using supabase sms auth, without changing anything. I do not seem to have any issues with the other functions of supabase.

I have set up pre-defined OTP for specific phone numbers in the config.toml file
maybe this can be an issue?
image

@encima
Copy link
Member

encima commented Feb 28, 2024

Possible, can you try subscribing to a channel using a token signed by your JWT secret? Or a user token?

@Mohammed-Yasin-Mulla
Copy link
Contributor Author

@encima I am sorry I didn't get you when you said subscribing to a channel.
I removed one of the numbers so that I could get an SMS from Twilio and sign in in my local supabase instance, but I still didn't receive any real-time updates.

I do have the same numbers as in Test Phone Numbers in the supabase console in the supabase instance as well but I do not have any issues there.

@encima
Copy link
Member

encima commented Feb 29, 2024

@Mohammed-Yasin-Mulla No need to apologise, I probably was not clear!

Instead of using your user, could you try and authenticate using a custom JWT, see the example here?

Then we will know if this is an issue with your SMS auth or with Realtime!

@Mohammed-Yasin-Mulla
Copy link
Contributor Author

I tried that but still no luck,
Note: I am using a react-native project because of which I can not use the lib jose & jsonwebtoken

Error Message :

Android Bundling failed 3579ms
The package at "node_modules/jsonwebtoken/verify.js" attempted to import the Node standard library module "crypto".
It failed because the native React runtime does not include the Node standard library.
Learn more

So I used react-native-pure-jwt

My code snippet

import { sign } from 'react-native-pure-jwt';

const supabaseJWT = 'super-secret-jwt-token-with-at-least-32-characters-long';

async function getSupabaseJWT(userid: string) {
sign(
{
userid,
role: 'authenticated',
exp: Math.floor(Date.now() / 1000)   60 * 60,
}, // body
supabaseJWT, // secret
{alg: 'HS256'})
.then((val: string) => setCustomJWT(val)) // token as the only argument
.catch(console.error); // possible errors
}

// JWT Token gen -> eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJyb2xlIjoiYXV0aGVudGljYXRlZCIsImV4cCI6MTcwOTMxOSwidXNlcmlkIjoiNjg1ODhiNGQtMzdlZS00NmQzLWIyYjAtMjRkMmMyMGZkZmY3In0.LhT3NJniY-Las1_mAX1yuO4HmCF4eJB6MA-skbyGgD4

Implementation of real-time

// Note: this is React native project
const supabase = createClient<Database>(supabaseUrl, supabaseAnonKey, {
auth: {
storage: AsyncStorage,
autoRefreshToken: true,
persistSession: true,
detectSessionInUrl: false,
},
global: {
	headers: {
		Authorization: `Bearer ${customJWT}`,
	},
},
});

  

useEffect(() => {
supabase.realtime.setAuth(customJWT);

const channel = supabase
.channel('db-changes')
.on(
'postgres_changes',
{
event: '*',
schema: 'public',
table: 'user_orders',
},
payload => console.log(payload)).subscribe(msg => console.log(`Subscribed ${msg}`));

 return () => {
      supabase.removeChannel(channel);
    };
    }

Error Log

LOG  Subscribed CHANNEL_ERROR

@encima
Copy link
Member

encima commented Mar 3, 2024

Check your logs in the Log Explorer in the dashboard, there is likely an issue with the token you are generating and any errors will tell you if there is an issue with the token or if it is missing information (in this case, it is probably because you are not setting the userid key)

@Mohammed-Yasin-Mulla
Copy link
Contributor Author

I am unsure whether it's specific to me, but I cannot see the logs in the local dashboard.
image

image

@Mohammed-Yasin-Mulla
Copy link
Contributor Author

@encima could you please check if you can use the real-time feature using the local instance It would confirm that then It is an issue specific to mine.

@encima
Copy link
Member

encima commented Mar 5, 2024

Hi @Mohammed-Yasin-Mulla ,

Sorry, I should have mentioned that I had tried this successfully locally.

For the logs, these are not enabled by default, if you edit the supabase/config file then you can change enabled to true under the analytics heading, here:
image

@ivasilov
Copy link
Member

ivasilov commented Mar 6, 2024

@Mohammed-Yasin-Mulla the realtime inspector is now available in the latest docker image. Can you try upgrading and see if you can see any realtime events?

@Mohammed-Yasin-Mulla
Copy link
Contributor Author

Mohammed-Yasin-Mulla commented Mar 7, 2024

Hello, guys sorry for the late response,

These are the logs from my local instance,
image

In my opinion, the top three messages are error messages.

Error Messages :

1)  Event Message
14:36:41.044 project=realtime-dev external_id=realtime-dev [error] Auth error: {:error, :expected_claims_map}

Metadata
[
  {
    "external_id": "default",
    "project": "default"
  }
]

2) Event Message
Using execute/3 with a single event value is deprecated. Use a measurement map instead.

Metadata
[
  {
    "external_id": "default",
    "level": "warning",
    "project": "default"
  }
]

3) Event Message
14:36:39.959 project=realtime-dev external_id=realtime-dev [error] Auth error: {:error, :expected_claims_map}

Metadata
[
  {
    "external_id": "default",
    "project": "default"
  }
]

A Gentle Note: This same code works well on my managed Supabase project

@tb1995
Copy link

tb1995 commented Mar 14, 2024

@Mohammed-Yasin-Mulla

I had the same issues that you did.
This solved the problem:

supabase/realtime#748 (comment)

@Mohammed-Yasin-Mulla
Copy link
Contributor Author

Hey,
sorry for replying after a long time

@tb1995 thank you for the response, I am developing it on react native (mobile devices), The URL http://127.0.0.1:54331 is a localhost URL, which points to the device where the code is running. If you're trying to access this URL from your mobile app, it's trying to connect to a server running on your mobile device, which is likely not what you want.

If your server is running on your development machine and you want to access it from your mobile app, you need to replace 127.0.0.1 with the local IP address of your development machine. This IP address should be in the same local network as your mobile device.

In my case, the IP address is 192.168.29.141. Which was the same URL I am facing issues on.

@Hallidayo
Copy link
Contributor

Hi @Mohammed-Yasin-Mulla - Just checking in here, Is this working for you now?

@Hallidayo Hallidayo added the awaiting-details For issues needing detail from the opener. label Jun 3, 2024
@Mohammed-Yasin-Mulla
Copy link
Contributor Author

@Hallidayo I was unable to resolve this issue

@fjnoyp
Copy link

fjnoyp commented Jul 9, 2024

Having the same issue, creating a basic table and then adding/removing rows on a local setup does not trigger the Supabase Dart SDK's listen method. The following code only runs once on app start, but adding or removing rows in the local db http://127.0.0.1:54323/project/default/database does nothing. I enabled realtime sync on the local studio url.

    Supabase.instance.client.from('orgs').stream(primaryKey: ['id']).listen((List<Map<String, dynamic>> response) {
      print('response: $response');
    });

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
awaiting-details For issues needing detail from the opener. bug Something isn't working needs-analysis Issue status is unknown and/or not possible to triage with the current info realtime Supabase Realtime related self-hosted Issues related to self hosting
Projects
Status: No status
Development

No branches or pull requests

6 participants