五子棋系统分析

1 系统分析
1.1系统功能
本次设计的是一款基于HTML5、Node.js、Mongodb的一款多人在线五子棋游戏。

由于HTTP协议的无状态性，所以不利于建立客户端和服务器之间的通信，所以传统的网页游戏都是基于flash技术。

本系统利用HTML5提供的Web Socket功能可以方便的实现游戏数据的事实传输功能，服务端采用Node.js开发，Node.js是一个javascript运行环境，使得Javascript能够在服务器端运行。

Node.js的非阻塞特性，使得它非常利于大量数据的高并发处理，目前已在很多网页游戏和手机端游戏的服务器有所应用。

用户游戏过程中的数据采用MongoDB进行存储，MongoDB是一款性能优越的NoSQL 数据库，它以一种二进制JSON(BSON)进行存储，而本系统的客户端和服务器端都是使用javascript作为开发语言，javascript对于JSON的支持非常好，能方便的在JSON数据类型和Javascript对象之间进行灵活转换。

1.2系统总体结构
该系统分为服务器端程序和客户端程序、服务器端主要由消息转发处理模块组成，客户端主要由通信模块、五子棋游戏逻辑与绘制模块和用户消息处理模块组成。

系统结构如图所示。

1.3系统功能模块分析
1.3.1消息转发处理模块
消息转发处理模块是服务器端的核心模块，游戏服务器端程序通常只进行对用户消息的接受转发，数据存储等核心功能，其他功能交由客户端处理，这样可以减轻多人同时在线时的服务器压力，消息转发处理模块接受客户端通过HTML5 Web Socket建立的链接，处理客户端发送的消息，并向客户端发送消息进行通讯。

1.3.2 通讯模块
通信模块包括了HTML5 Web Socket对象初始化、消息接收、消息发送、界面显示等子功能模块。

HTML5 Web Socket对象初始化模块：WebSocket protocol 是HTML5一种新的协议(protocol)。

它是实现了浏览器与伺服器全双工通信。

虽然WebSocket API已成为HTML的标准之一，但是实现websocket的协议，浏览器扮演者一个很重要的
角色。

但因为websocket还未最终版本，草拟不断更新，所以不同的版本会支持不同的draft，初始化模块主要功能是对浏览器版本进行判断，然后创建不同浏览器所支持的Web Socket对象，进行同一封装。

消息接收模块：消息接受模块先与服务器建立连接。

以消息监听的方式与服务器端进行通讯，通过为已建立连接的Web Socket对象注册监听函数。

当指定事件发生会触发对应的已注册监听函数，如连接成功，连接失败，消息接收等事件，在接收到消息后会调用消息处理模块。

消息发送模块：消息发送模块主要用于发送，建立链接时的用户信息，用户聊天信息，与指定用户进行游戏的请求信息。

和游戏逻辑相关的信息会转交给游戏逻辑模块处理。

通过是通过WebSocket对象的send方法进行发送。

界面显示模块：界面显示模块主要接受消息并调用消息处理模块后，对处理结果的反馈显示，如接受到的聊天信息显示，连接的建立成功提示，在线用户显示，和五子棋游戏相关的游戏界面的显示会由游戏逻辑与绘制模块处理。

1.3.3消息处理模块
消息处理模块包括了加入游戏消息处理、用户登录消息处理、用户注销消息、用户离开游戏消息处理、用户状态更新消息处理、显示全部用户消息处理等子功能模块
加入游戏消息处理：当收到其他用户请求加入游戏消息时，提示用户进行选择是否同意进行游戏，将用户选择结果发送至服务器。

用户登录消息处理：当收到新用户登录消息时，对新加入用户的名称和状态进行显示。

用户注销信息处理：收到用户注销信息时，更新户列表删除指定用户。

用户离开游戏消息处理：游戏进行中，另一方用户退出游戏时，会发送此消息。

收到消息后会提示用户，对方掉线，并调用游戏逻辑和绘制模块结束游戏。

用户状态更新消息处理：根据收到的消息对用户当前状态进行设置，游戏状态分为等待中、游戏中、准备中。

显示全部用户消息处理：对接受到的服务器端用户列表信息进行处理，更新用户列表。

1.3.4 游戏逻辑与绘制模块
游戏逻辑与绘制模块包括了设置当前行棋方、设置按钮状态、下子事件处理、游戏界面绘制、游戏信息处理、游戏流程处理等子功能模块。

设置当前行棋方模块：设置当前下子的游戏用户，黑子方或白子方，用于其他模块进行判断。

设置按钮状态模块：设置按钮状态模块会根据当前行棋方和游戏状态等信息设置刷新按钮、连接用户按钮、注销按钮、开始按钮、和棋、悔棋、认输等按钮是否可用。

下子事件处理：对用户点击鼠标落子事件进行处理，落子成功后进行界面的重绘，更新棋盘canvas，并进行胜负判定。

游戏界面绘制：包括棋盘界面绘制，棋子绘制以及显示的时间、用户等文字信息的canvas绘制。

游戏信息处理：对和棋、悔棋、认输、开始游戏等信息进行处理，向服务器发送相应数据，并调用游戏界面绘制模块对游戏界面进行更新。

游戏流程处理：游戏逻辑的核心模块，存储游戏的当前状态并调用其他模块进行游戏。

2.详细设计
2.1系统结构设计
根据本文的需求分析决定采用基于浏览器的作为客户端的B/S模式。

B/S模式是一种以Web为基础的系统体系结构。

B/S模式采取请求和响应模式，首先浏览器发起请求，以URI的方式向服务器申请资源。

Web服务器直接向浏览器返回请求结果。

B/S模式简化了客户端，它无需像C/S模式那样在不同的客户端安装不同的客户应用程序，而只需安装通用的浏览器软件。

这样不但可以节省客户机的硬盘与内存，而且使安装过程更加简便、网络结构更加灵活。

相对于C/S模式，B/S模式的维护具有更大的灵活性，当应用逻辑发生变化时，它不需再为每一个客户应用程序升级，而只需对Web服务器上的服务处理程序进行修改升级。

服务器端采用Node.js架构，近年来服务器端架构有了显著的变化，从CGI 到Java、J2EE，再到LAMP和Ruby On Rails。

而本次选用的Node.js是一个较为有前景的全新架构。

Node.js是一个JavaScript运行环境，它实际是对Google V8引擎进行了封装。

Google V8引擎执行非常快，性能非常好。

Node.js对一些特殊用例进行了优化，使得V8在非浏览器环境运行的更好。

由于Javascript的函数式编
程等特性，基于非阻塞式编程更有优势。

采用Node.js 来实现网络游戏服务器的开发，除了能利用JavaScript的动态语言的优势特性、强大的开源社区和V8引擎的优越性能外，在网络数据传输的异步化方面具有快速、实时等事件编程模型；特别在HTML5的应用开发中，还具有前后端代码共享、DSL灵活定义等特点。

数据存储方面采用了非关系型数据库MongoDB，MongoDB是一个基于分布式文件存储的数据库。

由C++语言编写。

旨在为WEB应用提供可扩展的高性能数据存储解决方案，有着高性能、易部署、易使用，存储数据非常方便等特点。

因为MongoDB数据存储以BSON/JSON文档，这对于Web应用程序有很大的意义，尤其是Javascript程序。

Javascript程序喜欢以JSON形式传输，这使得整个项目的数据表示可采用统一的模型。

所有这一切都无需任何前期架构设计。

用户客户端使用了HTML5技术，而非传统的flash技术。

HTML5允许Web 页面运行应用，就像一般的应用那样独立运行。

HTML5具有很多功能强大的新特性，而此系统主要应用WebSocket和Canvas功能。

HTML5中内置了基于Web sockets的即时通讯功能，WebSockets将允许任何Web页面设计人员轻松地添加实时数据流。

WebSocket提供了一个受欢迎的技术，以替代我们过去几年一直在用的Ajax技术。

这个新的API提供了一个方法，从客户端使用简单的语法有效地推动消息到服务器。

Canvas使得我们可以在web中绘制各种图形。

给人感觉单在这点上有点模糊我们web和桌面程序的感觉。

在html5外web中也有基于xml的绘图如：VML、SVG。

而Canvas为基于像素的绘图。

Canvas是一个相当于画板的html节点，我们能以javascript操作绘图。

2.2模块设计。