了解socket.io不了解socket的先复习一下。socket.io可以理解为对WebSocket的封装。就好比前端jQuery对原生javascript的封装。Soket.io依赖事件驱动模型,灵活的使用自定义事件和调用事件完成更多的场景,而不需要依赖过多的原生事件。在服务端安装第三方模块APInpminstallexpresssocket.io开启一个Socket服务端,端口为88varexpress=require('express');varapp=express();varhttp=require('http').Server(app);vario=require('socket.io')(http);http.listen(88);使用on监听事件,定义事件连接:监听客户端连接,回调函数会通过这个连接的socketemit:trigger使用客户端的事件io.on('connection',function(client){//保存当前登录用户到对象onlinePersons,向所有在线用户发送在线提示//serverLogin是客户端调用的自定义事件client.on('serverLogin',function(_person){v??ar_personObj=JSON.parse(_person);onlinePersons[_personObj.id]=_personObj;//向所有在线用户发起在线提醒//触发客户端的clientTips事件//clientTips为客户端自定义事件io.emit('clientTips',JSON.stringify(onlinePersons));})//当检测到客户端移动时,会向所有在线用户发送移动信息,并触发客户端clientMove事件//serverMove是客户端调用client.on的自定义事件('serverMove',function(_person){v??ar_personObj=JSON.parse(_person);onlinePersons[_personObj.id]=_personObj;console.log('serverLogin',onlinePersons);//clientTips是客户端的自定义事件io.emit('clientMove',_person);});})ClientAPI因为socket.io是对websocket的二次封装,所以有必要先介绍socket.io的js库创建和服务端连接varsocket=io.connect('ws://localhost:88');连接成功后,通过emitsocket.emit('serverLogin',JSON.stringify(person));调用服务端事件在客户端,同样使用on定义服务端调用的事件socket.on('clientTips',function(){})项目应用本案例模拟网游运行步骤npminstallexpresssocket.ionodesocketServer案例思路serveropen服务在服务器端监听客户端的连接。io.on('connection',function(client){})在服务端定义在线事件client.on('serverLogin',function(_person){}),然后发送在线事件保存用户属性。客户端连接到服务器socket=io.connect('ws://localhost:88');连接成功后,将在线属性发送给服务端socket.emit('serverLogin',JSON.stringify(person));服务端接收到客户端的在线用户属性,保存在对象onlinePersons中,将用户广播给所有在线客户端io.emit('clientTips',JSON.stringify(onlinePersons));客户端收到一个新的用户从服务器自动创建一个角色socket.on('clientTips',function(){})角色在游戏中移动并重复发送坐标到服务器,服务器将新的坐标广播到所有在线客户端,然后客户端根据新坐标移动角色。
