热门标签 | HotTags
当前位置:  开发笔记 > 编程语言 > 正文

Nodejs实现多人同时在线移动鼠标的小游戏分享_node.js

最近因为项目需要,所以研究了一下nodejs的websocket实现,socket.io,这是nodejs后台应用websocket广泛使用的框架。


最近因为项目需要,所以研究了一下nodejs的websocket实现,socket.io,这是nodejs后台应用websocket广泛使用的框架。

准备工作

1.安装socket.io,使用命令npm install socket.io

2.windows系统的话,需要vc编译环境,因为安装socket.io的时候,会编译vc代码

游戏基本原理

1.服务器监听客户端的连接

2.客户端连接成功时候,绑定页面移动鼠标事件,事件里处理发送当前坐标给服务器

3.服务器保存一个全局的坐标对象,并以客户端唯一编号为键值

4.有新连接来的时候,把坐标广播给其它客户端

5.客户端断开连接的时候,服务端删除它的坐标信息,并广播给其它客户端

开始实现服务端代码

scoket.io建立服务器监听的时候,需要依赖一个http连接,用来处理升级协议用,所以也需要一个http模块,代码如下:

代码如下:


var http = require('http'),

io = require('socket.io');



var app = http.createServer().listen(9091);

var ws = io.listen(app);

然后定义一个全局的坐标对象

代码如下:


var postiOns= {};

开始监听客户端的连接,并新增广播函数(其实可用socket.io自带的广播方法io.sockets.broadcast.emit),核心代码如下:

代码如下:


ws.on('connection', function(client){

// 广播函数

var broadcast = function(msg, cl){

for(var k in ws.sockets.sockets){

if(ws.sockets.sockets.hasOwnProperty(k)){
if(ws.sockets.sockets[k] && ws.sockets.sockets[k].id != cl.id){
ws.sockets.sockets[k].emit('position.change', msg);
}

}

}

};

console.log('\033[92m有新的连接来:\033[39m', postions);

// 客户端连接成功之后,就发送其它客户端的坐标信息

client.emit('position.change', postions);

// 接收客户端发送消息

client.on('position.change', function(msg){

// 目前客户端的消息就只有坐标消息

postions[client.id] = msg;

// 把消息广播给其它所有的客户端

broadcast({

type: 'position',

postion: msg,

id: client.id

}, client);

});

// 接收客户端关闭连接消息

client.on('close', function(){

console.log('close!');

// 删除客户端,并通知其它客户端

delete postions[client.id];

// 把消息广播给其它所有的客户端

broadcast({

type: 'disconnect',

id: client.id

}, client);

});

// 断开连接

client.on('disconnect', function(){

console.log('disconnect!');

// 删除客户端,并通知其它客户端

delete postions[client.id];

// 把消息广播给其它所有的客户端

broadcast({

type: 'disconnect',

id: client.id

}, client);

})

// 定义客户端异常处理

client.on('error', function(err){

console.log('error->', err);

})

});

分析上面的代码,关键点在于

1.新的客户端连接成功,发送其它客户端的坐标信息

2.客户端更新坐标信息的时候,通知其它客户端

3.客户端断开连接,通知其它客户端

4.广播消息类型分为修改坐标与移除坐标

编写客户端html页面

由于socket.io是自定义的框架,所以客户端需要引用socket.io.js,这个js可以从socket.io模块里查找,路径一般为node_modules\socket.io\node_modules\socket.io-client\dist,里面有合并与压缩两个版本,开发的时候可以用合并版.

完整代码如下:

代码如下:























推荐阅读
  • 本文探讨了2019年前端技术的发展趋势,包括工具化、配置化和泛前端化等方面,并提供了详细的学习路线和职业规划建议。 ... [详细]
  • 本文探讨了Web开发与游戏开发之间的主要区别,旨在帮助开发者更好地理解两种开发领域的特性和需求。文章基于作者的实际经验和网络资料整理而成。 ... [详细]
  • 了解如何快速搭建属于自己的个人博客,无需编程基础,适合Mac和Windows用户。通过本文,您将学会使用GitHub Pages和Hexo构建一个完全自主的在线空间。 ... [详细]
  • PHP 编程疑难解析与知识点汇总
    本文详细解答了 PHP 编程中的常见问题,并提供了丰富的代码示例和解决方案,帮助开发者更好地理解和应用 PHP 知识。 ... [详细]
  • Python 异步编程:ASGI 服务器与框架详解
    自 Python 3.5 引入 async/await 语法以来,异步编程迅速崛起,吸引了大量开发者的关注。本文将深入探讨 ASGI(异步服务器网关接口)及其在现代 Python Web 开发中的应用,介绍主流的 ASGI 服务器和框架。 ... [详细]
  • Symfony是一个功能强大的PHP框架,以其依赖注入(DI)特性著称。许多流行的PHP框架如Drupal和Laravel的核心组件都基于Symfony构建。本文将详细介绍Symfony的安装方法及其基本使用。 ... [详细]
  • Spring Cloud学习指南:深入理解微服务架构
    本文介绍了微服务架构的基本概念及其在Spring Cloud中的实现。讨论了微服务架构的主要优势,如简化开发和维护、快速启动、灵活的技术栈选择以及按需扩展的能力。同时,也探讨了微服务架构面临的挑战,包括较高的运维要求、分布式系统的复杂性、接口调整的成本等问题。最后,文章提出了实施微服务时应遵循的设计原则。 ... [详细]
  • 本文探讨了如何在Node.js环境中,通过Tor网络使用的SOCKS5代理执行HTTP请求。文中不仅提供了基础的实现方法,还介绍了几种常用的库和工具,帮助开发者解决遇到的问题。 ... [详细]
  • 探讨了在Express应用中,如何实现同一路由下既返回HTML文件又发送JSON数据的技术挑战与解决方案。 ... [详细]
  • Node.js 开发入门:环境搭建与配置
    随着Node.js技术的日益成熟及其即将发布的1.0稳定版,越来越多的开发者开始关注并尝试这一高性能的服务器端JavaScript平台。本文将引导读者如何在Windows环境下安装配置Node.js,并介绍一些常用的开发工具和框架。 ... [详细]
  • 利用NVM实现Node.js多版本管理
    本文详细介绍如何使用NVM(Node Version Manager)进行Node.js的多版本管理,包括安装配置、版本切换等操作。 ... [详细]
  • 使用 NDB 提升 Node.js 应用调试体验
    本文介绍了由 Google Chrome 实验室推出的新一代 Node.js 调试工具 NDB,旨在为开发者提供更加高效和便捷的调试解决方案。 ... [详细]
  • Node.js 入门指南(一)
    本文介绍了Node.js的安装步骤、如何创建第一个应用程序、NPM的基本使用以及处理回调函数的方法。通过实际操作示例,帮助初学者快速掌握Node.js的基础知识。 ... [详细]
  • 收割机|篇幅_国内最牛逼的笔记,不接受反驳!!
    收割机|篇幅_国内最牛逼的笔记,不接受反驳!! ... [详细]
  • 随着毕业设计的结束,我终于有时间更新我的博客了。这次,我将分享如何在自己的服务器上搭建 Bitwarden,一个广受好评的开源密码管理工具。 ... [详细]
author-avatar
mobiledu2502907117
这个家伙很懒,什么也没留下!
PHP1.CN | 中国最专业的PHP中文社区 | DevBox开发工具箱 | json解析格式化 |PHP资讯 | PHP教程 | 数据库技术 | 服务器技术 | 前端开发技术 | PHP框架 | 开发工具 | 在线工具
Copyright © 1998 - 2020 PHP1.CN. All Rights Reserved | 京公网安备 11010802041100号 | 京ICP备19059560号-4 | PHP1.CN 第一PHP社区 版权所有