Empresas
Empleos
  • Sobre nosotros
  • Soluciones
    • Publicación de vacantes
      Publica tu vacante y recibe candidatos calificados en 48h.
    • Evaluación de candidatos
      500+ pruebas técnicas y psicológicas, más anti-fraude.
    • Headhunting
      Búsqueda ejecutiva a la medida de principio a fin.
    • Nómina + EOR
      Dispersión de nómina y EOR en más de 15 países de LATAM.
  • Precios
  • Empleos

0

231
Vistas
Arrastrar y soltar con Socket io

Estoy creando un juego de cartas multijugador con node, express y socket io. Tengo problemas para pasar las acciones de arrastrar y soltar realizadas por un jugador a la pantalla de un segundo jugador conectado.

Básicamente, uso esta función para manejar el evento de caída en el lado del cliente. Obtengo la identificación de la tarjeta movida y luego la agrego a la zona de caída donde se movió

 function handleBoxDrop(e) { const id = e.dataTransfer.getData('text'); let dropzone = e.target; socket.emit('drop', id); socket.on('drop', (id) => { let temp = document.getElementById(id); dropzone.appendChild(temp); }); e.dataTransfer.clearData(); }

y en el lado del servidor usé esto:

 o.on('connection', (socket) => { console.log('a user connected'); socket.on('drop', (id) => { io.emit('drop', id); }); });

Pero cuando muevo una tarjeta, la tarjeta no se mueve en el otro navegador o se mueve al lugar equivocado. No se que estoy haciendo mal, por favor ayuda. Gracias:)

about 4 years ago · Juan Pablo Isaza
1 Respuestas
Responde la pregunta

0

necesita mover la función socket.on fuera de la función de caída del controlador

 function handleBoxDrop(e) { '''your code''' } socket.on('drop', e => { '''append to dropzone''' })

El método socket.on crea un oyente y solo necesita crearse una vez. Puede llamarlo justo después de instanciar el objeto de socket.

 const socket = websocket() socket.on('drop', e => {})
about 4 years ago · Juan Pablo Isaza Denunciar
Responde la pregunta
Encuentra empleos remotos

¡Descubre la nueva forma de encontrar empleo!

Top de empleos
Top categorías de empleo
Empresas
Publicar vacante Precios Comercial
Legal
Términos y condiciones Política de privacidad
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Recomiéndame algunas ofertas
Necesito ayuda