Problema con ejecución secuencial en Javascript

[fbedia]

Hola! Espero que puedan ayudarme porque estoy ya desesperado con este tema....

Se trata de una aplicación que estoy haciendo con NodeJS que como sabrán se programa en javascript. Pues bien, el problema es el siguiente:

Se trata de una aplicación donde un usuario crea un juego y otro usuario puede unirse.
El creador y el oponente añaden una serie de "items" que se disputarán.

Cuando un usuario se conecta, lo que quiero hacer es cargar los juegos y mostrarselos.... Lo que hago es:

1º: Una consulta SQL que me devuelva los juegos activos.

2º: Mediante un bucle for, voy recorriendo el resultado de la consulta que contiene los IDs

3º: Dentro del buble for, realizo otra consulta para obtener los items depositados... y a continuacion procedo mediante socket.emit a enviar la informacion.

El problema esta en que el buble for no espera a que se ejecute lo que hay dentro de el! ¿Que puedo hacer? ¿Alguna idea?

El codigo es el siguiente:

Código Javascript:

io.on('connection',function(socket) {
    console.log("Nueva conexion al socket");
    
    //SQL para obtener la informacion de los juegos:
    db_connection.query('SELECT juegos.id, juegos.creador, usuarios.avatar, usuarios.realname FROM juegos, usuarios WHERE juegos.creador=usuarios.steamid ORDER BY finalizado ASC, fecha_fin DESC LIMIT 0,100', function(error1,juegos){
        if(error1) {
            log.error("No pueden obtenerse los datos de los juegos!");
            console.log("ERROR -> "+error1);
            return;
        } else {
            if(!juegos[0]) {
                //Si no existen juegos emito un succes false
                socket.emit('juegos',{success: false});
            } else {
                //Mediante un bucle for recorro los juegos
                for (var i in juegos) {
                    console.log("Bucle for entra en su ejecucion numero "+i+". El ID del juego es "+juegos[i].id);
                    //Cargo los items del juego
                    db_connection.query('SELECT market_hash_name,icon,value,del_creador FROM juegos_items WHERE id_juego='+juegos[i].id, function(error3,items){
                        if((error3)||(!items[0])) {
                            log.error("Error en la carga de Items de un duelo");
                        } else {
                            console.log("Cargando los items del juego con ID:"+juegos[i].id);
                            //Avatar del oponente:
                            db_connection.query('SELECT realname, avatar FROM usuarios WHERE steamid='+juegos[i].oponente, function(error2,oponente){
                                if((error2)||(!oponente[0])) {
                                    console.log("Emito los datos del Id juego "+juegos[i].id);
                                    socket.emit('juegos',{
                                        success: true,
                                        gameId: juegos[i].id,
                                        creador: juegos[i].creador,
                                        creador_avatar: juegos[i].avatar,
                                        creador_nick: juegos[i].realname,
                                        oponente: null,
                                        oponente_avatar: null,
                                        oponente_nick: null,
                                        items: items
                                    });
                                } else {
                                    socket.emit('juegos',{
                                        success: true,
                                        gameId: juegos[i].id,
                                        creador: juegos[i].creador,
                                        creador_avatar: juegos[i].avatar,
                                        creador_nick: juegos[i].realname,
                                        oponente: juegos[i].oponente,
                                        oponente_avatar: oponente[0].avatar,
                                        oponente_nick: oponente[0].realname,
                                        items_creador: items
                                    });
                                }
                            });
                        }
                    });
                }
            }
        }
    });
    
});
 

Mirad el log:



Bucle for entra en su ejecucion numero 0. El ID del juego es 1
Bucle for entra en su ejecucion numero 1. El ID del juego es 2
Cargando los items del juego con ID:2
Cargando los items del juego con ID:2
Emito los datos del Id juego 2
Emito los datos del Id juego 2

Quiero que el codigo se ejecute secuencialmente... El log deberia mostrar algo asi:

Bucle for entra en su ejecucion numero 0. El ID del juego es 1
Cargando los items del juego con ID:1
Emito los datos del Id juego 1
Bucle for entra en su ejecucion numero 1. El ID del juego es 2
Cargando los items del juego con ID:2
Emito los datos del Id juego 2

Espero haberme explicado bien!
Cualquier duda muy gustosamente tratare de aclararla.

Muchas gracias por vuestro tiempo

[barbel]

Sinceramente, nunca he trabajado con esas librerias así que hablo un poco sin saber, pero te comento un problema similar que tenia yo en Ajax.

Yo utilizaba una llamada ajax a otro archivo, para recuperar un valor de la base de datos, que después utilizaba en el resto del código javascript.
Me fallaba por ajax se ejecutaba más lento que el código javascript, por lo tanto cuando llamaba a ajax, se seguía ejecutando el resto del código antes de que ajax, devolviera el valor que necesitaba.

Por lo tanto es posible que tu problema sea similar que el bucle for continua cuando aun estas ejecutando la función anterior.

Un saludo!

[fbedia]

Iniciado por barbel

Sinceramente, nunca he trabajado con esas librerias así que hablo un poco sin saber, pero te comento un problema similar que tenia yo en Ajax.

Yo utilizaba una llamada ajax a otro archivo, para recuperar un valor de la base de datos, que después utilizaba en el resto del código javascript.
Me fallaba por ajax se ejecutaba más lento que el código javascript, por lo tanto cuando llamaba a ajax, se seguía ejecutando el resto del código antes de que ajax, devolviera el valor que necesitaba.

Por lo tanto es posible que tu problema sea similar que el bucle for continua cuando aun estas ejecutando la función anterior.

Un saludo!

Si, en esencia el problema es el mismo.

Gracias por interesarte.

[Pantaláimon]

Buenas,

yo también desconozco esas librerías pero ya que usas node, usa promesas para evitar que tu codigo parezca esto:


Por ejemplo:

Código Javascript:

function obtenerItems() {
    return new Promise((resolve, reject) => {
        db_connection.query('mi query', (error, items) => {
             if (errors) {
                  reject(new Error('error 1'))
             } else {
                  resolve(items)
             }
        })
    })
}
 
function hacerAlgoConLosItems(items) {
    return new Promise((resolve, reject) => {
        db_connection.query('query que hace algo con ' + items, (error) => {
             if (errors) {
                  reject(new Error('error 2'))
             } else {
                  resolve()
             }
        })
    })
}
 
// y luego hacer algo así para qu se ejecute una detrás de la otra.
obtenerItems()
    .then(hacerAlgoConLosItems)
    .catch((error) => {
         console.log(error.message) // mostrar el error si se ha producido
    })
 

Un saludo!

[manuparquegiralda]

Verás tienes que hacer algo más recursivo, no debes hacerlo con un bucle for ya que el bucle te recorrerá todos los valores de los juegos sin esperar a que el resultado de cada juego sea devuelto.

Deberías buscar el resultado de un juego y cuando lo obtengas, entonces buscar el resultado del siguiente y así mientras haya juegos. No sé si me he explicado bien. Te pondré algo a modo de ejemplo simple para que lo veas:

Código Javascript:

if(!juegos[0]) {
    //Si no existen juegos emito un succes false
    socket.emit('juegos',{success: false});
} else {
    //Mediante un bucle for recorro los juegos
 
    //Cargo los items del primer juego, ( el cero es el primer index del array)
    cargarDatosJuego( juegos, 0 );
}
 
function cargarDatosJuego( juegos, i ) {
    if ( !juegos[ i ] ) {
        console.log("No hay más juegos por cargar");
        return false;
    }
 
    db_connection.query('SELECT market_hash_name,icon,value,del_creador FROM juegos_items WHERE id_juego='+juegos[i].id, function(error3,items){
        if((error3)||(!items[0])) {
            log.error("Error en la carga de Items de un duelo");
 
            cargarDatosJuego( juegos, i++ ); // Volvemos a llamar a la función sumando uno al index para cargar el siguiente juego
 
        } else {
            console.log("Cargando los items del juego con ID:"+juegos[i].id);
            //Avatar del oponente:
            db_connection.query('SELECT realname, avatar FROM usuarios WHERE steamid='+juegos[i].oponente, function(error2,oponente){
                if((error2)||(!oponente[0])) {
                    console.log("Emito los datos del Id juego "+juegos[i].id);
                    socket.emit('juegos',{
                        success: true,
                        gameId: juegos[i].id,
                        creador: juegos[i].creador,
                        creador_avatar: juegos[i].avatar,
                        creador_nick: juegos[i].realname,
                        oponente: null,
                        oponente_avatar: null,
                        oponente_nick: null,
                        items: items
                    });
                } else {
                    socket.emit('juegos',{
                        success: true,
                        gameId: juegos[i].id,
                        creador: juegos[i].creador,
                        creador_avatar: juegos[i].avatar,
                        creador_nick: juegos[i].realname,
                        oponente: juegos[i].oponente,
                        oponente_avatar: oponente[0].avatar,
                        oponente_nick: oponente[0].realname,
                        items_creador: items
                    });
                }
 
                cargarDatosJuego( juegos, i++ ); // Volvemos a llamar a la función sumando uno al index para cargar el siguiente juego
 
            }
        }
    }
}
 

Obviamente es mucho más optimizable, pero esta es la idea, no sé si estará bien escrito o habrá errores, pero bueno eso ya lo miras tu. El caso es que tienes que llamar a la función dentro de la función una y otra vez mientras haya juegos por cargar y cuando no hay más juegos, la detienes.

Es un códifo un tanto lioso y no me he parado a estudiar si hay variables compartidas que también tendrían que estar en la función y demás detalles. No copies y pegues, lo único que intento es pasarte una idea de como hacerlo.