Jump to content

TypeScript - Phaser 3 - mySQL - socket.io: Multiple game instances created after failed login


RobJonHol
 Share

Recommended Posts

I am having this issue where after I fail to sign in and then successfully sign into my game it will create a game instance for every time I failed to login. This also happens on failed sign up attempts. Any help would be greatly appreciated.

My repo: https://github.com/RobertHolstein/ElevaidusTS

 

Failed login attemped

RLjeJ.png

 

Two game instances after giving correct sign in info

D2DdR.png

SERVER

private listen(): void {
        this.server.listen(this.port, () => {
            console.log(`\n\n===============>\t running server on port ${this.port}\n`);
        });

        this.io.on('connect', (socket: socketIo.EngineSocket) => {
            console.log(`\n\n===============>\t connected client on port ${this.port}\n`);
            socket.on('messageFromFrontend', (m: string) => {
                console.log(`\n\n===============>\t ${m}\n`);
                this.io.emit('messageFromBackend', 'Hello from the backend!');
            });

            socket.on('signIn', (signInInfo: any) => {
                let sql = 'SELECT * FROM player WHERE username = ? AND password = ?';
                var query = this.db.query(sql, [signInInfo.username,signInInfo.password], (err, res) => {
                    if (err) {
                        console.log(err);
                        socket.emit('errorFromBackend', err.code);                        
                    }else if(res.length === 0){
                        socket.emit('errorFromBackend', 'username and or password was incorrect');                 
                    }else{
                        console.log(`\n\n===============>\t Player logging in\n`)
                        console.log(`===============>\t username: ${signInInfo.username}\n`)
                        console.log(`===============>\t password: ${signInInfo.password}\n`)
                        this.CreatePlayer(socket, { player: res[0], isNew: false });
                    }
                })
            })

            socket.on('signUp', (signUpInfo) => {
                let postPlayer = { username: signUpInfo.username, password: signUpInfo.password}
                let sql = 'INSERT INTO player SET ?';
                let query = this.db.query(sql, postPlayer, (err, res) => {
                    if(err){
                        console.log(err);
                        if(err.code === 'ER_DUP_ENTRY'){
                            socket.emit('errorFromBackend', 'this username is already in use');
                        }else{
                            socket.emit('errorFromBackend', err.code);
                        }
                    }else{
                        let player = this.CreatePlayer(socket, {player: {id:res.insertId}, isNew: true});
                    }
                }) 
            })
            
            socket.on('disconnect', () => {
            console.log(`\n\n===============>\t client disconnected\n`);
            });
        });
    }

CLIENT

/// <reference path="./phaser.d.ts"/>

import * as io from 'socket.io-client';
import 'phaser';
import { GameScene } from "./scenes/gameScene";

var signInDiv = document.getElementById('signInDiv');
var signInUsername = document.getElementById('signInUsername') as HTMLInputElement;
var signInPassword = document.getElementById('signInPassword') as HTMLInputElement;
var signInBtn = document.getElementById('signInBtn');
var signUpBtn = document.getElementById('signUpBtn');

const config: GameConfig = {
  title: "Elevaidus",
  version: "1.0",
  width: 640,
  height: 640,
  type: Phaser.AUTO,
  parent: "game",
  scene: [ GameScene ],
  input: {
    keyboard: true
  },
  physics: {
    default: "arcade",
    arcade: {
      gravity: { y: 0 },
      debug: false
    }
  },

};



export class ioService {
  private socket: SocketIOClient.Socket;

  constructor() {
    this.socket = io.connect();
    this.sendMessage('hello from the frontend!');
  }

  // EMITTER
  private sendMessage(msg: string) {
    this.socket.emit('messageFromFrontend', msg );
    this.socket.on('messageFromBackend', (m: string) => {
      console.log(`\n\n===============>\t ${m}\n`);
      });
  }

      public SignIn(): void {
        this.socket.emit('signIn', {username: signInUsername.value, password: signInPassword.value })
        this.socket.on('signedIn', (playerInfo: any) => {
          this.CreateGame(playerInfo);
        })
        this.socket.on('errorFromBackend', (err: string) => {
          alert(err);
        })
      }
      
      public SignUp(): void {
        this.socket.emit('signUp', {username: signInUsername.value, password: signInPassword.value })
        this.socket.on('signedUp', (playerInfo: any) => {
          this.CreateGame(playerInfo)
        })
        this.socket.on('errorFromBackend', (err: string) => {
          alert(err);
        })
      }
  
  private CreateGame(playerInfo: any): void{
    signInDiv.hidden = true;
    var game = new Phaser.Game(config);
    console.log(playerInfo)
  }
}

var socket = new ioService();

signInBtn.onclick = () => {
  socket.SignIn();
}
signUpBtn.onclick = () => {
  socket.SignUp();
}

 

Link to comment
Share on other sites

  • 4 weeks later...

The reason your getting multiple load is because every time you call SignIn() in the client script, it binds the signedIn event to the socket .. so once you finally get a successful login, it has multiple instances of signedIn event bound to the socket and thus calls createGame x (number of bad logins)  times.... make sense?

Link to comment
Share on other sites

14 hours ago, bryangalli said:

The reason your getting multiple load is because every time you call SignIn() in the client script, it binds the signedIn event to the socket .. so once you finally get a successful login, it has multiple instances of signedIn event bound to the socket and thus calls createGame x (number of bad logins)  times.... make sense?

This makes absolute sense. I actually figured this out a couple weeks ago and I should of came back here and updated my question. Anyways, thanks for you help on this!

Link to comment
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.

Guest
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

Loading...
 Share

  • Recently Browsing   0 members

    • No registered users viewing this page.
×
×
  • Create New...