Identité
Pour faire du multijoueur, il faut bien sûr une identité afin de différencier les joueurs. Pour ça, je vais utiliser un système de token. Pour le moment, je ne veux pas utiliser de système de login/password, c’est peut-être quelque chose que j’intègrerai plus tard.
Dans mon fichier client, au niveau de la classe link, j’ajoute la méthode login() qui va me permettre de demander ou d’envoyer un token. J’appelle la nouvelle méthode dès que le client est connecté au serveur via socket.io et au passage je masque la div #serveur_info qui me permet d’indiquer au client que le serveur n’est pas disponible.
socket_connexion( ){
if (typeof io != "undefined" && io != null){
this.socket = io.connect( 'http://wars.io:3333' );
//quand la connexion est établie
this.socket.on('connect', () => {
e(this.socket.id);
this.login();
$("#serveur_info").hide();
});
}
}
login(){
e("> Login : envois de token");
//on regarde si l'user a un token
this.token = getCookie("warsio_token");
if(this.token == null){
//demande de connection
e("demande de token au serveur");
this.send_to_server( "message", { action : "request_token" });
}else{
e("token exist et vaut : " + this.token);
this.send_to_server( "message" , { action : "set_token" , params : { "token" : this.token } });
}
}
Au niveau du serveur, je crée la variable users qui va me permettre d’enregistrer les utilisateurs à venir.
constructor(server_config){
//INIT SERVER
e("/**************************************\n*\n* Server started\n* ==============\n*\n**************************************/");
super();
this.server_config = server_config;
this.users = {}; //liste des utilisateurs
this.init();
}
Request token
Je crée la nouvelle méthode request_token() qui va directement retourner une réponse au client avec un token tout frais. Concernant la méthode de génération de token, j’utilise une fonction récursive qui génère un token sous forme d’une longue chaîne de caractères et vérifie si l’un des clients n’a pas déjà ce token. Ceci va me permettre d’avoir des tokens uniques pour chaque client.
request_token(user_socket){
this.send_to_client( user_socket, "message" , { action : "response_request_token", params : { token : this.get_random_token() } } );
}
get_random_token(){
let token = Math.random().toString(36).substr(2) + Math.random().toString(36).substr(2);
if(this.users[ token ] == undefined){
return token;
}else{
return this.get_random_token();
}
}
Set token
Au niveau de la méthode set_token(), je vérifie si le token est bien passé en paramètre. S’il n’existe pas encore dans la liste des utilisateurs, alors je l’enregistre sous forme d’un objet dont la clé est le token, et la valeur une liste d’informations. J’ajoute un état « free » qui veut dire que l’utilisateur n’est pas encore dans une partie et qu’il est simplement connecté.
set_token(user_socket, params){
e("> definition de token");
let response_params = {
connected : true,
state : "free"
};
//this.users[params]
if(this.users[ params.token ] == undefined ){
this.users[ params.token ] = {
connected : true,
socket_id : user_socket.id,
state : "free"
};
}
//renvois des données au client ?
this.send_to_client( user_socket, "message" , {
action : "response_set_token",
params : response_params
});
}
Réponse
Pour le retour côté client, je crée la méthode response_request_token() qui enregistre le token en cookie ainsi que dans une variable et je rebalance un login() juste derrière.
//liste des actions réseaux
response_request_token(params){
setCookie( "warsio_token" , params.token);
this.token = params.token;
this.login();
}
Pour la méthode response_set_token(), j’affiche simplement les menus de la home, c’est-à-dire « Créer une partie » et « Rejoindre une partie ».
response_set_token(params){
if(params.connected){
this.connected = true;
$("#menu .option_step_home").show(300);
}
}
28/05/2016
Yann Vangampelaere - nouslesdevs -