开源H5棋牌 cocos creator微信棋牌小游戏 幼麟棋牌客户端分析笔记

此文紧接上文的服务端分析来进行客户端的分析

LoadingLogic.js  （与初始化场景绑定 初始化各个组件 获取版本信息 加载资源）

       1.onload:显示 splash 界面

                初始化各个组件

       2.start:checkVersion

              -varURL = "http://127.0.0.1:9000";(http.js中配置的原始值)

              -sendRequest("/get_serverinfo")

 

       返回值: 包含版本信息 大厅连接地址 app网页地址

           var ret = {

                 version:config.VERSION,

                 hall:hallAddr,

                 appweb:config.APP_WEB,

           }

           cc.vv.SI = ret;（设置服务器信息）

      

       3.startPreloading加载资源

       4.onLoadComplete资源加载完毕后 loadScene("login");

 

Login.js   （与登陆场景绑定响应相关登陆按键消息）

1.     onload:

cc.vv.http.url = cc.vv.http.master_url;( cc.vv.http.master_url为初始化了的静态变量)

2.     start:

  本地存储的账号密码不为空则 cc.vv.userMgr.onAuth(ret);

 

3.     点击 游客登陆

cc.vv.userMgr.guestAuth();

       如果URL参数中不包含账号信息则随机生成账号

cc.vv.http.sendRequest("/guest");

       回调onAuth

       如果登陆成功

            //设置获取版本信息时返回的服务器地址

            cc.vv.http.url = "http://" + cc.vv.SI.hall;

            login();

                            -sendRequest("/login");

                                   -登陆成功则loadScene("hall");

Hall.js（绑定大厅场景 获取和更新相关用户信息 响应创建、加入游戏按键事件）

       1.onload:

              如果oldRoomID 不为空 则作为房间号进入此房间

        if( cc.vv.userMgr.oldRoomId!= null){

            cc.vv.userMgr.enterRoom(roomId);

        }

 

       2.Update:

              存在房间数据则自动进入到房间

        if(cc.vv &&cc.vv.userMgr.roomData != null){

           cc.vv.userMgr.enterRoom(cc.vv.userMgr.roomData);

           cc.vv.userMgr.roomData = null;

        }

 

       3.界面中绑定了CreateRoom.js 和 JoinGameInput.js组件

              CreateRoom.js（处理创建房间面板相关消息事件）

                     -cc.vv.http.sendRequest("/create_private_room");

                     创建房间成功

       cc.vv.userMgr.enterRoom(roomId);

                                   //返回数据ret中包含游戏房间服务器地址和端口信息

              -cc.vv.http.sendRequest("/enter_private_room",data,onEnter);

                              -cc.vv.gameNetMgr.connectGameServer(ret);

 

              -JoinGameInput.js（处理加入房间面板相关消息事件）

cc.vv.userMgr.enterRoom(roomId);

                            //返回数据ret中包含游戏房间服务器地址和端口信息

       -cc.vv.http.sendRequest("/enter_private_room",data,onEnter);

                   -cc.vv.gameNetMgr.connectGameServer(ret);

 

   connectGameServer:function(data){

       //连接游戏房间之前设置好游戏房间地址和端口信息

       cc.vv.net.ip = data.ip +":" + data.port;

              //emit“login” 事件 到服务端

              cc.vv.net.send("login",sd);

}

 

客户端监听两个登陆结果事件

cc.vv.net.addHandler("login_result ")；（登陆返回结果）

 

       //监听房间服务器返回登陆成功的消息

       cc.vv.net.addHandler("login_finished",function(data){

            console.log("eventlogin_finished");

            cc.director.loadScene("mjgame");

       });

 

MJGame.js     监听服务端关于游戏的消息事件

onLoad：初始化各类游戏需要的组件

       -onGameBeign()根据数据 同步客户端画面 用于恢复游戏场景 断线重连

 

客户端网络地址变化

1.    http.js中配置的原始值 获取游戏版本信息

var URL = "http://127.0.0.1:9000";

       -sendRequest("/get_serverinfo")

 

     返回值: 包含版本信息 大厅连接地址 app网页地址

         var ret = {

               version:config.VERSION,

               hall:hallAddr,

               appweb:config.APP_WEB,

         }

         cc.vv.SI = ret;（返回值包含大厅服务器地址信息）

 

2.   //设置获取版本信息时返回的服务器地址为websocket 连接地址

   cc.vv.http.url = "http://" +cc.vv.SI.hall;

              -sendRequest("/login");

                     登陆成功则loadScene("hall");

 

3. 返回数据ret中包含游戏房间服务器地址和端口信息

cc.vv.userMgr.enterRoom(roomId);

cc.vv.http.sendRequest("/enter_private_room",data,onEnter);

       返回数据

          var ret = {

             roomid:roomId,

             ip:enterInfo.ip,

             port:enterInfo.port,

             token:enterInfo.token,

             time:Date.now()

           };

 

    cc.vv.gameNetMgr.connectGameServer:function(data){

        //设置 socket-io 连接地址信息

        cc.vv.net.ip = data.ip + ":" + data.port;

              cc.vv.net.connect();

    }

 

服务端 客户端网络通讯方式

Client to Server

1.websocket发送http请求

cc.vv.net.send(event,data);

eg:

cc.vv.net.send("emoji",event.target.name);

   2.socket-io

          this.sio.emit(event,data);

 

  Server to Client

socket-io 发送事件

       socket.emit(event,data);

客户端点击游客登陆

   onBtnQuickStartClicked:function(){

       cc.vv.userMgr.guestAuth();

},

guestAuth:function(){

    //如果没有保存的账号 则随机生成一个游客账户

    if(account == null){

        account = Date.now();

       cc.sys.localStorage.setItem("account",account);

    }

    cc.vv.http.sendRequest("/guest",{account:account},this.onAuth);

}

onAuth:function(ret){

    var self = cc.vv.userMgr;

    self.account = ret.account;

    self.sign = ret.sign;

 

    //返回版本信息时 返回的服务器地址

    cc.vv.http.url = "http://" +cc.vv.SI.hall;

    self.login();

}  

    login:function(){

        var self = this;

        var onLogin = function(ret){

            //account不存在 则创建一个用户

            if(!ret.userid){

               cc.director.loadScene("createrole");

            }

            else{

                      cc.director.loadScene("hall");

            }

        };

        cc.vv.wc.show("正在登录游戏");

        cc.vv.http.sendRequest("/login",{account:this.account,sign:this.sign},onLogin);

}

 

服务端对登陆请求的处理

app.get('/login',function(req,res){

       // 查询数据库中的表 t_users是否存在数据

       db.get_user_data(account,function(data){

              if(data == null){

                     console.log("如果不存在用户数据则让客户端创建一个用户");

                     http.send(res,0,"ok");

                     return;

              }

}