一．背景介绍

　　本项目打算实现一个基于web浏览器的即时通信视频系统，因此先进行初步的需求模块分析，可以划分为如下的功能模块，用户管理模块：提供登录、注册、退出、查看用户列表等功能；好友管理模块：提供查找好友、添加好友、删除好友、申请状态查询、好友列表等功能；即时通讯管理模块：包括文字消息、图片消息、表情消息、语音消息、视频片段消息、历史消息管理等功能；视频管理模块：包括房间管理、视频控制、文字消息、窗口大小控制、窗口拖动等功能，基于以上基础的需求分析后，对该项目进行进一步的软件系统分析和设计

二．设计方案

       本系统是基于B/S架构的网络即时通信视频系统，在使用上具有跨平台、高兼容、低成本等特征，用户无需安装客户端即可使用该系统。Client/Server（C/S）和 Browser/Server（B/S）是我们常用的对软件的网络结构特点的表述方式，但它们背后蕴含着一种普遍存在的软件架构风格，即 客户-服务模式 架构风格。客户-服务模式的架构风格是指客户代码通过请求和应答的方式访问或者调用服务代码。客户是主动的，服务是被动的。客户知道它向哪个服务发出请求，而服务却不知道它正在为哪个客户提供服务，甚至不知道正在为多少客户提供服务。 客户-服务模式的架构风格具有典型的模块化特征，降低了系统中客户和服务构件之间耦合度，提高了服务构件的可重用性。

       依据系统架构设计的传统原则，系统可以分为四层：访问层、功能层、标准层、基础层，系统架构图如下：

三．视图分析

       分解视图：

       软件架构模型是在高层抽象上对系统中关键要素的描述，而且表现出抽象的层次结构。

　　构建软件架构模型的基本方法就是在不同层次上分解（decomposition）系统并抽象出其中的关键要素。分解是构建软件架构模型的关键步骤，分解视图也是描述软件架构模型的关键视图，一般分解视图呈现为较为明晰的分解结构（breakdown structure）特点。分解视图用软件模块勾划出系统结构，往往会通过不同抽象层级的软件模块形成层次化的结构。通过采取面向功能的分解，画出分解视图如下：

       依赖视图：

       依赖视图展现了软件模块之间的依赖关系。比如一个软件模块A调用了另一个软件模块B，那么我们说软件模块A直接依赖软件模块B。如果一个软件模块依赖另一个软件模块产生的数据，那么这两个软件模块也具有一定的依赖关系。依赖视图在项目计划中有比较典型的应用。比如它能帮助我们找到没有依赖关系的软件模块或子系统，以便独立开发和测试，同时进一步根据依赖关系确定开发和测试软件模块的先后次序。依赖视图在项目的变更和维护中也很有价值。比如它能有效帮助我们理清一个软件模块的变更对其他软件模块带来影响范围。

　　本系统分为用户管理模块、好友管理模块、即时通信管理模块、视频管理模块和文件存储管理模块，这些模块通过User类、Relationship类、ApplicationStatus类、FriendMessage类、VideoMessage类、VideoMessage类和FileStorage类紧密联系在一起，其中前三类处理用户管理和好友关系模块，后面四种类处理消息模块，形成有机的整体，因此画出相关UML类图如下所示

　　执行视图

　　执行视图展示了系统运行时的时序结构特点，比如流程图、时序图等。执行视图中的每一个执行实体，一般称为组件（Component），都是不同于其他组件的执行实体。如果有相同或相似的执行实体那么就把它们合并成一个。执行实体可以最终分解到软件的基本元素和软件的基本结构，因而与软件代码具有比较直接的映射关系。在设计与实现过程中，我们一般将执行视图转换为伪代码之后，再进一步转换为实现代码。

登录模块流程图

用户加入时序图

用户退出时序图

添加好友流程图

好友私聊流程图

即时通信消息发送流程图

加入房间过程流程图

服务器处理流程图

WebRTC通信连接时序图

工作分配视图

工作分配视图将系统分解成可独立完成的工作任务，以便分配给各项目团队和成员。工作分配视图有利于跟踪不同项目团队和成员的工作任务的进度，也有利于在个项目团队和成员之间合理地分配和调整项目资源，甚至在项目计划阶段工作分配视图对于进度规划、项目评估和经费预算都能起到有益的作用。

该项目的成员只有两个人，前后端分离，一人负责前端一人负责后端，每个人的工作非常明确，因此无需进行工作分配。

四．数据库设计

用户表：

好友关系表：

申请状态表：

公共聊天消息表：

好友私聊消息表：

私聊消息表类似于公共聊天，因为系统提供公共聊天和私聊两种方式，为避免混淆建立两张独立的数据表，好友私聊表中接收者唯一，且消息类型仅为用户消息

用户视频消息表：

文件存储表

文件存储表用来存储即时通信和视频聊天中产生的文件信息

五．运行环境和技术说明

　　系统使用的主要技术为WebRTC技术，包括其架构、接口和信令处理，WebSocket技术，Node.js开发平台，STUNR/URN/ICE三种NAT穿越技术。所使用的ide为vscode，数据库为mysql，部分关键技术分析如下。

　　WebRTC的本质是将实时通讯所需要的音视频的采集，编解码，多媒体数据压缩、传输与显示等模块都封装在引擎里，集成在浏览器当中，从而屏蔽底层硬件实现或操作系统之间的差异。WebRTC的目标是建立一个健壮的实时通信平台，通过它，可以实现不同的浏览器间，不同的操作系统间的实时通信。WebRTC主要分为网页应用程序、网页应用程序开发接口、WebRTC本地C++应用程序开发接口、传输和会话、音频引擎和视频引擎六个部分。

　　WebRTC的WebAPI层中提供了多种音视频接口，而实现音视频数据的采集，传输以及会话功能的是以下三个接口:MediaStream, PeerConnection和DataChanel。MediaStream用于从媒体源获取媒体数据，如来自麦克风和摄像头音视频流;PeerConnection用于在两个浏览器之间进行一对一((P2P)连接;DataChannel表示一个在两个节点之间的双向的数据通道。由于各个浏览器厂商不同以及WebRTC的标准化工作还未完成，所以目前这几个API的名称在不同浏览器及同一浏览器的不同版本之间略有差异，比如getUserMedia在当前版本的Chrome中是webkitGetUserMedia，而在Firefox中叫做mozGetUserMediao。

　　WebSocket是HTMLS中最强大的通信功能，定义了一个全双工的通信信道，只需Web上的一个Socket即可进行通信，能减少不必要的网络流量并降低网络延迟。它的本质是先通过HTTP/HTTPS协议进行握手后创建一个用于交换数据的TCP连接，此后服务端与客户端通过此TCP连接进行实时通信。HTML5的WebSocket能使数据从几千字节减少到两字节，延迟从150ms减少到50ms，并且完美淘汰传统的轮询、Comet以及流推送等解决方案.

六．概念原型工作机制

　　概念是人对能代表某种事物或发展过程的特点及意义所形成的思维结论

　　概念原型是一种虚拟的、理想化的软件产品形式

　　结合上述分析，并画出相关E-R图如下

　　总结项目的概念原型工作过程如下：

　　项目参与者分为普通用户和管理员，普通用户可以进行注册并登录，其具有个人信息界面，保存有个人信息，普通用户可以进行好友添加，并进行即时通信，即时通信可以针对单个好友进行私聊，也可以进行群通新，通信的类型有文字消息、视频片段消息、图片消息等、还可以直接进行视频会话，管理员可以对已注册的用户进行管理，注销用户信息。

　　以上就是个人工程实践的软件系统分析和设计，在实际操作之后加深了对课程内容的理解，能够帮助培养软件工程思维，如有错误还望指正。

web即时通信与视频系统--软件系统分析与设计