说明:实在对不住诸位,的确是我弄错了,views/index.ejs里的对 socket.io.js的引用使用了我本地的绝对路径,需要修改为<script src="/socket.io/socket.io.js"></script>即可,对此我重新打了个包。再次歉意!!!
上周做了javascript版的象棋游戏【详见 js 写中国象棋游戏_应用backbone、canvas】,在iteye上发布后,承蒙诸位赏脸,有所反响。
经广大朋友指点,本周在前一游戏的基础上增加了 双方玩家可在 浏览器 上 在线对战 的 功能,有朋友提议用 ajax 或 falsh 可以通信,但前者较初级,后者非前端技术。衡量下接受了另一个网友提议的 nodeJS + websocket,实际开发是使用 express + socket.io 框架实现。因暂无 nodeJS 服务器可用,需要大家先自己在电脑上配置下环境运行,非常简单。
配置方法:
1、下载附件文件压缩包,解压到本地,如 E:/chess
2、如无 nodeJS 先安装 http://nodejs.org/
2、运行 cmd,执行 npm install -g express [ 安装express框架包 ]
3、命令进入chess文件夹 执行 npm install [ 安装依赖包,主要是 socket.io ] 【注意文件夹路径,有人反馈,找不到,是因为解压方式的不同,可能会是 E:/chess/chess 】
4、启动 node app.js
上述四步即可,如果无法运行 可留言。
功能介绍:
1、使用chrome打开 本地服务 ,可以先通过 ipconfig 查询自己的本地IP,如172.7.1.60,用浏览器打开本地IP加端口号,如 http://172.7.1.56:3000 ,会自动为网址后添加随机数作为房间号, 如 http://172.7.1.56:3000/31 【如只本地测试也可以打开 http://127.0.0.1:3000 】, 此时会提示“暂无其他玩家,将本页面网址发给朋友打开,即可进行游戏连接”。如图
2、当另一可访问你电脑的玩家打开同样的网址,或自己再本机用另一浏览器打开同样的网址, 会提示 “对方已进入,可以开始游戏”。注意房间号要相同。
3、当双方都点击开始后,棋子自动从棋盒进入棋盘并摆放好位置。如图
4、双方按象棋规则进行,被吃掉的子会自动放回棋盒。如图
5、当一方获胜时,提示胜利
6、此时可以点击开始 进行新一轮游戏
7、当一方离开时,提示“对方已离开”
8、右下角,有一个简单的实时聊天框,以供双方及时通讯
象棋本身的制作规则建议看 【详见 js 写中国象棋游戏_应用backbone、canvas】。
本案例主要使用了
jQuery - 底层
Backbone - MVC框架,对象棋视图、模型、事件有效管理
express - 封装 nodeJS,作后台服务
socket.io - 封装 websocket,作数据通信
本来是想做一个可多房间选择版的,已初步完成并可用,但因还需要维护各房间状态,本周无法及时发布,暂弃。如图
还望广大朋友支持的功能有
1、如何做各种状态下的声音提示
2、找一个可以免费使用的支持nodeJS的服务器,放上去可供大家直接试用
3、支持摄像头实时视频
现在我们前端开发可以用 nodeJS 搭后台环境,可以用 socket 做通信,前端已经已经成为越来越重要的存在,望广大前端爱好者,共同努力,扩大我们前端的作用 及 影响。
有意见、建议欢迎留言
相关推荐
中国象棋 HTML5源码 支持人机对战
java课程设计:基于java实现的中国象棋游戏-支持局域网联机对战.zip java课程设计:基于java实现的中国象棋游戏-支持局域网联机对战.zip java课程设计:基于java实现的中国象棋游戏-支持局域网联机对战.zip java课程...
基于QT的网络对战中国象棋游戏
一个棋类游戏实现了中国象棋游戏--红石。它的客户端是cocos creator写的,服务器是node.js写的,服务端是一个非常简单的服务器。使用MySQL存储信息。 文件组成 客户端:客户端,使用 Cocos Creator 打开智能 sever...
象棋巫师源代码,适合初学习者了解象棋引擎原理。
NULL 博文链接:https://jiangxiao-2000.iteye.com/blog/1897220
基于Qt实现的双人联网对战的中国象棋游戏
JavaScript 中的简单国际象棋 AI。使用 chess.js 和 chessboard.js 库。 关于 chess-ai 是 JavaScript 中的一个简单的国际象棋 AI。 chess-ai 的主要关注点是应用程序的决策部分。人工智能范围之外的所有功能都是...
vc++象棋程序,可实现人机对弈代码取自GitHub
中国象棋源码,包含自动下棋算法,高级功能可配置
一个用java制作的国际象棋小游戏源代码,想学习java游戏编程的可以参考一下
Android应用程序象棋,可实现对战打谱,适合学习
由C++编写的象棋对战软件,自带界面(需要安装easyX库才可以运行),象棋AI由博弈论,广度优先搜索等算法构成。可AI对战也可以双人对战,自动绘制棋盘,鼠标点击操作棋子。
这是一款人机对弈的中国象棋程序,可以选择搜索层数,可以悔棋。
中国象棋源码
——学习参考资料:仅用于个人学习使用! javascript代码-使用JS中国象棋AI人工智能 人机对战的源代码