GitHub Documentation Patreon donate button

client.reconnect



  • // Initialization in the constructor

    constructor(props) {
        super(props);
    	
    	...
    	
        this.colyseus = new Colyseus.Client('wss://ws.matchscore.ru')
    
        this.GameBotRoom = this.colyseus.joinOrCreate("gamebot", {
            user_name: this.state.user_name,
            player_a: props.player_a,
            player_b: props.player_b,
            user_rank: this.state.user_rank,
            match_id: this.state.match_id,
            game_id: this.state.game_id,
            my_time: this.state.my_time,
        })
        this.GameBotRoom.then(room => {
            room.onStateChange.once((state) => {
                // console.log("room.onStateChange.once! state", state);
                this.setState(state);
            });
        })
    	
    	...
    	
    	}
    

    // Next, listen to events from the client and to the client leaving the room

    gameBotRoomRun = () => {
        this.GameBotRoom.then(room => {
    
            room.onStateChange((state) => {
                if (this.state.my_time_active === 0 && this.state.game_players[this.state.player_active] === this.state.user_name) {
                    console.log("tttt off")
                    room.send({ command: "time_off" });
                }
    
                this.setState(state);
    
            });
    
            room.onMessage((data) => {
                if (data.command === "redirect") {
                    window.location.replace(data.link);
                } else if (data.command === "room_id") {
                    //console.log("room_id - ", data.room_id);
                    //console.log("session_id - ", data.session_id);
                    this.setState({ room_id: data.room_id, session_id: data.session_id });
    
                }
    
            });
    
            room.onLeave((code) => {
                console.log("client left the room", code);
    
                this.test01();
            });
    
        })
    
    }		
    

    // Catch the silk on the element and send it to the server

    handleClick = (i) => {
    
        if (this.state.gameStatus) {
    
            if (this.state.squares_valid[i] === this.state.player_active && this.state.game_players[this.state.player_active] === this.state.user_name) {
    
                this.GameBotRoom.then(room => {
                    room.send({ command: "test", sector: i, xIsNext: this.state.xIsNext });
                });
    
            }
        }
    }
    

    // Everything works great! But I decided to add a response to reconnecting the client (loss of connection)

    // Server

         async onLeave (client, consented: boolean) {
           // flag client as inactive for other users
           this.state.players[client.sessionId].connected = false;
         
           try {
             if (consented) {
                 throw new Error("consented leave");
             }
         
             // allow disconnected client to reconnect into this room until 20 seconds
             await this.allowReconnection(client, 30);
         
             // client returned! let's re-activate it.
             this.state.players[client.sessionId].connected = true;
         
           } catch (e) {
         
             // 20 seconds expired. let's remove the client.
             delete this.state.players[client.sessionId];
           }
         }
    

    // Client

    serverReconnect = () => {
    
        //localhost
        //let client = new Colyseus.Client('ws://localhost:8014')
        //server
    
        let client =  new Colyseus.Client('wss://ws.matchscore.ru')
    
    
        client.reconnect(this.state.room_id, this.state.session_id).then(room => {
            // console.log("joined successfully", room);
            //this.setState({ pingServerTime: 60 });
            console.log("serverReconnect!!!")
            clearInterval(this.TimerId);
    
            //room.onClick += this.GameBotRoom.onClick 
            //this.GameBotRoom += room.onClick.onClick
            //room.onMessage += this.GameBotRoom.onMessage
            //room.onLeave += this.GameBotRoom.onLeave
            //room.onMessageCallback
    
    
            room.onStateChange((state) => {
                console.log("onStateChange - serverReconnect");
                this.setState(state);
    
            });
    
            //room.send({ command: "message", message: "message!!!" });
        });
    
    }
    

    // Reconnecting is working fine, client is being updated! But the previous one

     this.GameBotRoom = this.colyseus.joinOrCreate("gamebot", {.... 
    

    through which all the logic of the game passes, does not send messages to the server, it loses connection and the process goes to serverReconnect
    If you add a click response on serverReconnect, then it reconnects (which is expected ... with an error)

    A room.onLeave from the initial

    this.GameBotRoom.then(room => {

    stops working when reconnecting, and in

    client.reconnect(this.state.room_id, this.state.session_id).then(room => {

    does not work...

    Help with advice on how to redirect processing to its original state (I’ve been suffering for two days ...)



  • Solved! Everything is working!!! Did the button click processing through the state on the client


 

GitHub Documentation Patreon donate button

© 2019 Endel Dreyer