Realtime: Los ejemplos de JavaScript no funcionan para mí

¡Hola @retendo ! Gracias por persistir el tiempo suficiente para que funcione.

// related to node/browser difference?

Lo lograste. El ejemplo de la parte superior es para JS de "navegador" y el de la parte inferior es para JS de "servidor".

Como una historia corta (no del todo precisa) de JS: al principio, Javascript solo se usaba realmente para hacer pequeñas cosas en el navegador (pequeñas animaciones). Luego, la gente comenzó a construir sitios web completos con él.

Entonces google pensó ... ¿quizás podamos ejecutar este JS en un servidor también, no solo en un navegador? Así que crearon un "subconjunto" de Javascript - nodejs, y crearon un "motor" que podría ejecutarlo llamado v8 .

Pero NodeJS realmente no tiene el mismo "dialecto". (Busque CommonJS vs AMD vs UMD). Por eso existen herramientas como babel. Ellos "traducen" JS entre los diferentes dialectos de JS.

De todos modos, lo clavó con require('@supabase/realtime-js'); para Node

Si tiene un buen ejemplo simple que funciona, tal vez podría incluso agregarlo como un ejemplo node-js en la carpeta /examples . Estamos muy abiertos a los contribuyentes.

Creo que el cambio más importante debería ser el ".canal" entre join () y on (...).
Esto parece no estar relacionado con las diferencias de node.js / browser.
¿O esto funciona de alguna manera en el navegador?
Parece que .join () devuelve un objeto Push en lugar de un canal.

Tendré que comprobar esto. ¿Tiene un repositorio existente que pueda bifurcar? Si es privado sin problemas, crearé una pequeña demostración rápida en este repositorio

Tengo un código de ejemplo aquí mismo:
https://gist.github.com/retendo/3e2ddb90a29dfd0f5a2ab81729c7ed29

Esto funciona con el código de muestra ajustado

además de eso, las rutas de los carritos salvajes funcionan en la ruta del canal.
socket.channel ('realtime: public: users') -> funciona
socket.channel (' ') -> rotosocket.channel ('realtime: ') -> roto
socket.channel ('realtime: public: *') -> roto

Sin embargo, socket.channel ('realtime: public') funciona. Simplemente omita los últimos dos puntos.

Hola @retendo, lo siento por el incomunicado: estoy viendo esto y construyendo un ejemplo básico de nodejs ahora, pero probablemente no termine hasta mañana por la mañana a mi hora.

FYI: Estos no deberían funcionar

socket.channel('') -> broken
socket.channel('realtime:') -> broken
socket.channel('realtime:public:*') -> broken (see realtime:public below)

Pero estos deberían

socket.channel('realtime:*') -> listen to changes in the database
socket.channel('realtime:public') -> listen to changes in the public schema
socket.channel('realtime:public:users') -> listen to changes in the users table

Utilice "on" para escuchar diferentes "tipos de eventos". Usando el código en su esencia:

// INSERTS
socket.channel('realtime:public')
  .join()
  .channel
  .on('INSERT', payload => {});

// UPDATES
socket.channel('realtime:public')
  .join()
  .channel
  .on('UPDATE', payload => {});

// DELETES
socket.channel('realtime:public')
  .join()
  .channel
  .on('DELETE', payload => {});

// ALL 
socket.channel('realtime:public')
  .join()
  .channel
  .on('*', payload => {});

¡Espero que esto ayude un poco! No he probado tu código todavía, ¡pero se ve genial! Veo exactamente a dónde te diriges: creando un proxy (¿tal vez con fines de autenticación?)

Para autenticación, API de socket especializadas que ocultan la estructura de la base de datos subyacente y algunas modificaciones de la carga útil.

Pequeño ejemplo empujado para ti @retendo. Usé su código como línea de base, así que gracias por contribuir

creo que el cambio más importante debería ser el ".canal" entre join () y on (...).

Vea la diferencia entre mi primera confirmación y mi segunda: https://github.com/supabase/realtime/commit/d4c9eced516518f26d0174cc86508dc9530d0738

Básicamente socket.channel() devuelve el canal y socket.channel.join() devuelve el evento de unión. Entonces estabas "accediendo" al canal a través del evento join .

Por favor, manténgame actualizado en su proxy; si puede mantenerlo lo suficientemente genérico, lo agregaré a la carpeta examples .

Eso tiene sentido. En el ejemplo original basado en el navegador, todo estaba encadenado, así que intenté replicarlo de esa manera. Pero los cambios en su segunda confirmación realmente lo aclaran.

En cuanto al ejemplo del proxy: veré qué puedo hacer. Probablemente le interese más cómo encaja la autenticación en la imagen, ¿verdad? Porque las otras cosas que mencioné deberían ser sencillas.

Sí, especialmente en la autorización. Estamos trabajando en ello ahora, por lo que es bueno tener más perspectivas / enfoques.

Gracias por colaborar aquí. Si te quedas atascado con cualquier otra cosa, háznoslo saber. Dejaré esto para cerrar a menos que te quede algo

Cerrando ahora, siéntase libre de reabrir en cualquier momento