es.davy.ai

Preguntas y respuestas de programación confiables

¿Tienes una pregunta?

Si tienes alguna pregunta, puedes hacerla a continuación o ingresar lo que estás buscando.

Socket.io HTML: Enviar contenido único a la página HTML de clientes únicos.

05 Aug, 2023 Programación

Estoy utilizando NodeJS y Socket.io. Estoy recibiendo una consulta del usuario (https://localhost:3000?id=12345) y utilizando esta consulta quiero enviar un contenido único específico para este usuario.
Ahora mi problema es que todos los clientes están obteniendo datos de acuerdo a la última consulta del último cliente.
He intentado crear salas y otras soluciones que he pensado o encontrado en línea, pero sin suerte.

Estoy obteniendo la consulta de la página así:

app.get('/', async ({ query }, response) => { ... }

Cliente

$(document).ready(function () {
  socket.emit('room', key);
  socket.on('a1', function (data) {
    $("#a1").empty().append(data);
  });
  socket.on('a2', function (data) {
    $("#a2").empty().append(data);
  });
  socket.on('a3', function (data) {
    $("#a3").empty().append(data);
  });
  socket.on('a4', function (data) {
    $("#a4").empty().append(data);
  });
  ...
});

Servidor
```js
io.on('connection', function (socket) {
  console.log('Conexión');
  socket.removeAllListeners();
  socket.on('create', function (data) {
    console.log(`Data: ${data}`);
    socket.join(data);
    io.in(data).emit('a1', a1);
    io.in(data).emit('a2', a2);
    io.in(data).emit('a3', a3);
    io.in(data).emit('a4', a4);
  });
});
...

Realmente no puedo entender cómo separar la consulta de cada cliente desde el servidor y luego enviar un contenido único a cada cliente sin que el contenido de un cliente interfiera con otro.
Mi idea inicial era crear una sala por cliente y enviar su contenido único utilizando esa sala, pero por alguna razón, parece que el contenido termina en todos los clientes.

¡Muchas gracias!

Tags:  , , ,

Answer

  1. Avatar for davy.ai
    davy.ai

    Para enviar contenido único a cada cliente basado en su consulta, puedes usar el método socket.join() para crear una sala para cada consulta y luego emitir datos a esa sala específica utilizando io.to(room).emit(). Aquí tienes un ejemplo:

    Cliente

    $(document).ready(function () {
  var urlParams = new URLSearchParams(window.location.search);
  var id = urlParams.get('id');
  socket.emit('join', id);

  socket.on('uniqueContent', function (data) {
    $('#content').empty().append(data);
  });
});

    Servidor

    io.on('connection', function (socket) {
  socket.on('join', function(id) {
    socket.join(id); // crea una sala para esta ID de consulta
    // envía contenido único solo a este cliente
    io.to(socket.id).emit('uniqueContent', `Aquí tienes tu contenido único para la ID de consulta ${id}`);
    // o envía contenido único a todos los clientes en esta sala
    io.to(id).emit('uniqueContent', `Aquí tienes contenido único para la ID de consulta ${id}`);
  });
});

    Ten en cuenta que en el código del cliente, estamos llamando a socket.join() con la ID de consulta, y en el código del servidor, estamos usando io.to() para emitir datos a esa sala específica. También podemos usar socket.id para enviar datos solo a ese cliente (en caso de que no queramos enviar datos a todos los clientes en la sala).

Comments are closed.