Async axios Dont Versprechen NodeJS mit laufen

Question

Ich entwickle ein Multiplayer-Spiel mit vue auf Client-Seite und nojejs als Spielserver (I vue-sockets.io bin mit Clients und Server zu kommunizieren). Wenn ich die Spielinstanz auf der Knotenseite erstelle, wird sie Kacheln haben und ausgeblendet (beide Bildergruppen stammen von einer API). Dafür werden die Axios verwendet, das Problem ist, dass das erstellte Spiel vor dem Ausführen der Axios an den Client zurückgegeben wird. So erhält der Kunde das Spiel ohne die Bilder.

createGame(playerName, socketID, boardSize) { 
    this.contadorID = this.contadorID+1; 

     var game = new MemoryGame(this.contadorID, playerName, boardSize); 

     new Promise(function(resolve, reject) { 
      console.log("a"); 
      game.getTiles().then(response=>{ 
       console.log("getTiles"); 
     game.tiles = game.getRandomNPieces(response.data.data, game.board.length/2); 
       console.log(game.tiles); 
     }).catch(function (error) { 
     console.log(error); 
     }); 
      console.log('=>' + game.tiles); 
     }).then(function(result) { // (***) 
      console.log("b"); 
      game.getHidden().then(response=>{ 
     game.hidden = game.getRandomHidden(response.data.data); 
     }).catch(function (error) { 
     console.log(error); 
     }); 
     }).catch(function (error) { 
      console.log(error); 
     }); 
    game.player1SocketID = socketID; 
    this.games.set(game.gameID, game); 
    return game; 
} 

Das Programm erreicht nie den zweiten axios Anruf. Das gameList-Protokoll stammt aus dem Spiel, das an den Benutzer zurückgegeben wird.

Spiel Instanz in Client 1 (die das Spiel erstellt):

Spiel Instanz in Client 2 (das Spiel in der Lobby und hat bereits die Fliesen):

Answer 1

Da createGame() erscheint Wenn Sie einige asynchrone Operationen verwenden, um das Spiel richtig zu initialisieren, können Sie nicht einfach ein fertiges Spielobjekt von createGame() zurückgeben. Wie Sie bereits festgestellt haben, gibt createGame() das Spielobjekt zurück, bevor einer der asynchronen Vorgänge abgeschlossen wurde. Also, was Sie tun müssen, ist, dass Sie ein Versprechen zurückgeben müssen, dessen aufgelöster Wert das Spielobjekt ist, und dann müssen Sie alle asynchronen Operationen richtig verketten, damit Ihr Hauptversprechen gelöst wird, wenn das Spielobjekt fertig ist. Hier ist eine Möglichkeit zu strukturieren, dass:

createGame(playerName, socketID, boardSize) { 
    this.contadorID = this.contadorID+1; 

    var game = new MemoryGame(this.contadorID, playerName, boardSize); 

    console.log("a"); 
    return game.getTiles().then(response=> { 
     console.log("getTiles"); 
     game.tiles = game.getRandomNPieces(response.data.data, game.board.length/2); 
     console.log(game.tiles); 
     console.log('=>' + game.tiles); 
     console.log("b"); 
     // return nested promise so it chains into main promise chain 
     return game.getHidden().then(response=>{ 
      game.hidden = game.getRandomHidden(response.data.data); 
     }); 
    }).then(() => { 
     // finish initializing game object and 
     // make it be the resolved value of the returned promise 
     game.player1SocketID = socketID; 
     this.games.set(game.gameID, game); 
     return game; 
    }).catch(function (error) { 
     // log error and rethrow so promise stays rejected 
     // this will log for any of our rejected promises since they are chained 
     console.log(error); 
     throw error; 
    }); 
} 

Und dies ändert createGame() ein Versprechen zurück, so dass Sie die Art und Weise ändern, müssen Sie es wie folgt verwenden:

someObj.createGame(...).then(game => { 
    // game object is ready to use here 
}).catch(err => { 
    // error creating game object 
});