基于nodejs的即时通讯系统毕业论文.doc

1、目 录 摘 要II目 录IV第一章 绪论11.1引言11.2课题背景21.3设计的内容、目的及意义2第二章 Nodejs软件说明42.1 Nodejs概述42.2 Nodejs的模块52.3 Nodejs及相关模块的安装52.4 测试程序7第三章 系统可行性分析83.1 技术可行性83.2 经济可行性83.3 系统开发运行环境8第四章 系统需求分析94.1 系统性能需求分析94.2系统功能需求94.3 系统开发原则11第五章 系统总体设计125.1 系统设计的主要内容125.2 采用的主要技术12第六章 详细设计146.1基本页面的实现156.2用户登录界面226.3发送图片226.4发送表情

2、246.5文字颜色266.6按键操作286.7在线用户统计28第七章 系统测试307.1测试准备307.2测试过程307.3测试结果30第八章 软件使用说明书318.1产品概述318.2 服务器启动318.3 运行客户端318.4 开始聊天32设计总结33参考文献34附录一 外文翻译（原文）35附录二 外文翻译（中文翻译）42致 谢46第一章 绪论1.1引言即时通讯（Instant Messenger，简称IM），是指能够即时发送和接收互联网消息等的业务。自1998年面世以来，特别是近几年的迅速发展，即时通讯的功能日益丰富，逐渐集成了电子邮件、博客、音乐、电视、游戏和搜索等多种功能。即时通讯不

3、再是一个单纯的聊天工具，它已经发展成集交流、资讯、娱乐、搜索、电子商务、办公协作和企业客户服务等为一体的综合化信息平台。是一种终端连网即时通讯网络的服务。即时通讯不同于e-mail在于它的交谈是即时的。大部分的即时通讯服务提供了状态信息的特性显示联络人名单，联络人是否在在线与能否与联络人交谈。近年来，随着无线通信的快速发展，移动互联网为传统的Internet注入了新的活力，同时也为即时通讯带来了一场革命，交互双方已经不再局限于以网络终端设备为唯一的接入手段，PC机在传统的网络即时通讯中所起的作用正在被手机、平板电脑所取代。这使得即时通讯更加大众化和人性化，即使不会使用电脑的人现在也可以享受到即

4、时通讯给人们带来的变化。纵观即时通讯软件业的迅速发展，设计并开发一个即时通讯平台，对于现阶段的学习和研究，都是极为有意义的，基于这个前提和起因，我选择了设计即时通讯系统作为我的毕业设计。即时通讯软件是目前计算机用户进行交流最普遍的方式之一，各种各样的聊天软件也层出不穷；服务提供商也提供了越来越丰富的通讯服务功能。即时通信中最基本的功能就是通过计算机之间的文本数据的互换的形式实现思想的交流和沟通，它的优点是方便快捷，为人们之间创建了一种新型的、廉价的、快速的、简便的沟通方式。本文分析了即时通讯系统的原理及其实现过程，探讨了Socket技术与多线程技术在不/S模式下的局域网即时通讯系统的应用。 本

5、毕业设计就是模拟WebQQ 聊天软件，开发一个包括文字聊天、文件传输等功能的聊天软件。系统主要采用不/S架构JavaScript开发平台、html5协议以及Socket等技术来完成。主要实现的功能有登录、聊天、发送表情图片以及文件传输等功能。系统采用，按照应用程序服务器端、应用程序客户端此设计思想，可以将任务合理分配到客户机端和服务器端从而降低了系统的通信开销。此系统共分为两个模块：客户端模块和服务器端模块。通过运行、测试与分析，该多功能聊天软件运行稳定、可靠，具有一定的实用价值。48 1.2课题背景 即时通讯（Instant Messenger，简称IM），是指能够即时发送和接收互联网消息等

6、的业务。自1998年面世以来，特别是近几年的迅速发展，即时通讯的功能日益丰富，逐渐集成了电子邮件、博客、音乐、电视、游戏和搜索等多种功能。即时通讯不再是一个单纯的聊天工具，它已经发展成集交流、资讯、娱乐、搜索、电子商务、办公协作和企业客户服务等为一体的综合化信息平台。近年来，随着无线通信的快速发展，移动互联网为传统的Internet注入了新的活力，同时也为即时通讯带来了一场革命，交互双方已经不再局限于以网络终端设备为唯一的接入手段，PC机在传统的网络即时通讯中所起的作用正在被手机、平板电脑所取代。这使得即时通讯更加大众化和人性化，即使不会使用电脑的人现在也可以享受到即时通讯给人们带来的变化。在

7、社区、论坛和普通网页中加入即时聊天功能，用户进入网站后可以通过聊天窗口跟同时访问网站的用户进行即时交流，从而提高了网站用户的活跃度、访问时间、用户黏度。把即时通讯功能整合到网站上是未来的一种趋势，这是一个新兴的产业，已逐渐引起各方关注即时通讯除了能加强网络之间的信息沟通外，最主要的是可以将网站信息与聊天用户直接联紧在一起。通过网站信息向聊天用户群及时群发送，可以迅速吸引聊天用户群对网站的关注，从而加强网站的访问率与回头率。但是运用nodejs技术开发的即时通讯系统并不多，本文的即时通讯系统即是运用这种技术开发设计的，对于开发者来说它的技术实现简单易懂，对于用户来说更容易掌握，界面图形化实现能更

8、好的服务于大众。1.3设计的内容、目的及意义该系统的设计内容以即时通讯的发展为背景，基于nodejs技术设计、开发的即时通讯系统。该系统可用应用于企业局域网信息交流。该系统设计了局域网内用户信息的交流，文件的传输等功能。目前，即时通讯系统的流行与高速发展已经越来越快，给人们提供了更多的选择，一款好的即时通讯软件能使人们交流更加通畅便捷，从而提高人们的生活和工作效率。聊天软件作为使用最为广泛的即时性通讯工具，它在拥有文字聊天基础功能的同时，为满户的需求，还增加了文件传输的功能，成为现在最为主流的网上应用软件。本论文主要对聊天软件的文字聊天、文件传输功能进行分析与研究，总结出相关的理论与知识。运用

9、nodejs技术开发设计的即时通讯系统，实现了新技术在即时通讯方面的应用，而且也丰富即时通讯软件，使nodejs技术的优越性得到了充分的体现，为有兴趣的开发者提供了素材。每一个流行语言的出现都会伴随着各种相关应用的诞生,而流行程度又决定了这些应用的多样性。用PHP实现的即时通讯系统就要比用Perl实现的多得多,社区力量的比较可见一斑，JavaScript社区的影响也越来越大。 上 50个最受关注的项目中13个是JavaScript相关的,可以看出JavaScript的繁荣程度。服务器端JavaScript:nodejs出势必会引发一系列即时通讯系统的开发,本系统便是对此领域的探索。第二章 No

10、dejs软件说明2.1 Nodejs概述Nodejs是一个可以快速构建网络服务及应用的平台 。该平台的构建是基于Chromes JavaScript runtime，也就是说，实际上它是对Google V8引擎（应用于Google Chrome浏览器)进行了封装。V8引擎执行Javascript的速度非常快，性能非常好。Node对一些特殊用例进行了优化，提供了替代的API，使得V8在非浏览器环境下运行得更好。例如，在服务器环境中，处理二进制数据通常是必不可少的，但Javascript对此支持不足，因此，V8.Node增加了Buffer类，方便并且高效地处理二进制数据。因此，Node不仅仅简单地

11、使用了V8，还对其进行了优化，使其在各环境下更加给力。V8引擎本身使用了一些最新的编译技术。这使得用Javascript这类脚本语言编写出来的代码运行速度获得了极大提升，却节省了开发成本。对性能的苛求是Node的一个关键因素。 Javascript是一个事件驱动语言，Node利用了这个优点，编写出可扩展性高的服务器。Node采用了一个称为“事件循环(event loop）”的架构，使得编写可扩展性高的服务器变得既容易又安全。提高服务器性能的技巧有多种多样。Node选择了一种既能提高性能，又能减低开发复杂度的架构。这是一个非常重要的特性。并发编程通常很复杂且布满地雷。Node绕过了这些，但仍提供

12、很好的性能。虽然让Javascript运行于服务器端不是Node的独特之处，但却是其一强大功能。不得不承认，浏览器环境限制了我们选择编程语言的自由。任何服务器与日益复杂的浏览器客户端应用程序间共享代码的愿望只能通过Javascript来实现。虽然还存在其他一些支持Javascript在服务器端 运行的平台，但因为上述特性，Node发展迅猛，成为事实上的平台。Nodejs可以在不新增额外线程的情况下，依然可以对任务进行并行处理 Nodejs是单线程的。它通过事件轮询（event loop）来实现并行操作，对此，我们应该要充分利用这一点 尽可能的避免阻塞操作，取而代之，多使用非阻塞操作。2.2 N

13、odejs的模块Nodejs使用Module模块去划分不同的功能，以简化应用的开发。Modules模块有点象C语言中的类库。每一个Nodejs的类库都包含了十分丰富的各类函数，比如http模块就包含了和http功能相关的很多函数，可以帮助开发者很容易地对比如http,tcp/udp等进行操作，还可以很容易的创建http和tcp/udp的服务器。在程序中使用模块是十分方便的，只需要如下：在这里，引入了http类库，并且对http类库的引用存放在http变量中了。这个时候，nodejs会在我们应用中搜索是否存在node_modules的目录，并且搜索这个目录中是否存在http的模块。如果nodej

14、s找不到这个目录，则会到全局模块缓存中去寻找，用户可以通过相对或者绝对路径，指定模块的位置，比如：var myModule = require(./myModule.js); 模块中包含了很多功能代码片断，在模块中的代码大部分都是私有的，意思是在模块中定义的函数方法和变量，都只能在同一个模块中被调用。当然，可以将某些方法和变量暴露到模块外，这个时候可以使用exports对象去实现。2.3 Nodejs及相关模块的安装下面介绍下Nodejs的安装，首先在nodejs的网站上根据操作系统下载相关的安装包，对于Windows下的安装，可以如下进行：第一步：下载安装文件下载地址：官网http:/www

15、.nodejs.org/download/。第二步：安装nodejs下载完成后，双击node-v0.10.28-x86.msi,开始安装nodejs，默认是安装在C盘Program Files文件夹下面。第三步：安装相关环境打开nodejs的安装目录下你会发现里面自带了npm,直接用npm安装坏境即可进入node.js command prompt 命令窗口。在项目文件夹下安装相关环境键入命令：npm install express 回车等待安装express键入命令：npm install socket.io 回车等待安装 socket.io安装什么组件，取决于环境搭建需求。2.4 测试程序

16、新建一个server.js文件，内容如下 var http = require(http), server = http.createServer(function(req, res) res.writeHead(200, Content-Type: text/plain ); res.write(hello world!); res.end(); );server.listen(80);console.log(server started);软件安装成功后，运行node server，检查服务器端是否准备就绪，打开浏览器输入localhost就可运行。第三章 系统可行性分析3.1 技术可行性

17、所谓可行性分析，是关于项目的内容以及条件:例如供应需求，设备规模，环境利益等方面进行调查和分析，预测项目完成后可能获得的经济和环境效益进行预测，提出项目是否应该投资以及运行方式的意见的一种系统分析方法。可行性研究是为保证投资效果而在项目实施之前从经济、技术、管理等角度对项目进行的全面综合分析。它的基本任务包括从经济视角出发进行全面的分析研究、对项目运营后所产生的经济效益进行预测、对己经确定的几种方案论证进行选择。它的目标是合理利用资源，实现预定的社会效益与经济效益。 本文中主要讨论的是技术可行性。主要从项目实施的技术角度，合理设计技术方案，并进行比选和评价。NodeJS上的ExpressJS框

18、架可以方便实现众多功能:新建Server，配置，设置路由，通过NPM命令npm install，运行NodeJs中的NPM包即可安装。因此，本系统的开发是完全可以实现的。3.2 经济可行性基于局域网、B/S架构的即时通讯系统在很多资料上都能找到，包括书本和网络上都有很多类似的系统，开发这样一个系统所需要的花费不是很大，需要的开发工具、需要的软件等都可以在网上找到，不需要购买，所以不需要花费太多金钱，在经济上完全能够完成本系统的设计。3.3 系统开发运行环境本设计是一个局域网即时通讯软件，要在短时间内开发出来并且满足客户要求，无论是硬件还是软件都要选择合适，要求如下：开发设备完善；开发机器的性能

19、必须稳定；操作系统的选择应该适当；开发出的程序可以在尽可能多的平台上运行；可在Windows XP或Windows 7系统中完美运行。第四章 系统需求分析4.1 系统性能需求分析此次开发的网络聊天工具可作为企业局域网的交流工具使用，通信的安全性不是很高，但要求信息的响应速度要较快，让用户充分享受到网络即时消息的方便和快捷。本聊天工具由服务器端程序和客户端程序两部分组成，整体采用JavaScript端平台开发，采用HTML通信协议，使用Socket技术。服务器是可以进行监听，记录客户端请求和验证客户端身份的合法性，客户端程序面向实际用户，它有必要的界面的按钮，向用户提供网络即时消息的功能。本聊天

20、系统需包含如下基本功能：(1)客户端的主要功能：用户登录与好友聊天表情发送文件传输(2)服务器端的主要功能： 启动和关闭后台服务器建立连接监听客户端请求4.2系统功能需求聊天工具由服务器端和客户端组成，要分析清楚两方面所要完成的任务，对设计来说，等于完成了一半。根据聊天的通信步骤，系统的功能模块如图4-1所示即时通讯系统客户端服务器端登录功能聊天功能字体颜色设计发送表情功能发送图片功能建立连接断开连接监听客户请求返回响应发送请求图4-1(1) 服务器端服务器端完成3大功能：建立连接、断开连接、监听客户请求。这3大功能的具体含义如下：建立连接：系统启动时建立连接，绑定本地计算机的一个端口，不断地

21、监听是否有客户端请求连接或者断开连接。断开连接：关闭监听窗体，系统断开连接。监听客户请求：服务器端是个信息枢纽，所有向服务器端请求的客户端的信息都要传到服务器端，再由服务器根据客户端的请求按要求分发出去，客户端再向服务器端发送各种请求，如：登录，退出等。(2)客户端客户端完成以下几大功能：用户注册、用户登录、聊天功能、表情图片发送功能。用户登录：客户端与服务器建立通信通道，接收来自服务器的监听。通过系统的登录界面，输入昵称，然后发送到服务器进行验证。如果验证通过，则打开程序的主界面。聊天功能：客户在与好友建立通信连接后，便可以与好友进行聊天，聊天时发送的是文本信息。表情图片发送功能：用户之间可

22、以相互发送表情和图片。4.3 系统开发原则考虑到系统的可重用性和伸缩性，需要将本系统的网络通信底层和应用系统分离开。这样，基于可重用的网络通信层，可以实现其他各种实时性较高的应用系统。本系统在架构设计上分4个层次，从上到下一次为即时通讯系统、CSocket、CAsyncSocket和Windows Sockets API。本系统最底层是Socket通信层，将负责客户端和服务器之间快速的数据交换，它通过接口层和最上面应用层保持实时数据联系。用户将通过网页进入到本系统。Socket底层设计分两大部分：协议设计和连接处理设计；CSocket层的目的是提供底层和系统的一个中介媒体的作用，但是不能设计的

23、太复杂，以免延误数据传送时间。第五章 系统总体设计5.1 系统设计的主要内容本聊天工具采用客户端/服务器端的模式来设计，可以将任务合理分配到客户端和服务器端，从而降低了系统的通信开销。(1)客户端客户层端也叫应用表示层，是应用程序的用户接口部分。给聊天工具设计一个客户层具有很多优点，这是因为客户层担负着用户与应用之间的对话功能。它用于检查用户的输入数据，显示应用的输出数据，为了使用户能直观地进行操作，客户层需要使用图形用户接口。若聊天用户变更，系统只须改写显示控制和数据检查程序即可，而不会对影响造成影响。数据检查的内容只限于数据的形式和值的范围，不包括有关业务本身的处理逻辑。(2)服务层服务层

24、又叫功能层，相当于应用的本体，它是将具体的业务处理逻辑编入程序中。例如，用户需要检索数据，系统设法将有关检索要求的信息一次性地传送给功能表；而用户登录后，聊天登录信息是由功能层处理过的检索结果数据，它也是一次性传送给表示层的。在应用设计中，必须避免在表示层和功能层之间进行多次的数据交换，这就需要尽可能进行一次性的业务处理，达到优化整体设计的目的。5.2 采用的主要技术（1）NodejsNodejs是一个可以快速构建网络服务及应用的平台 。该平台的构建是基于Chromes JavaScript runtime，也就是说，实际上它是对Google V8引擎（应用于Google Chrome浏览器)

25、进行了封装。V8引擎执行Javascript的速度非常快，性能非常好。Node对一些特殊用例进行了优化，提供了替代的API，使得V8在非浏览器环境下运行得更好。例如，在服务器环境中，处理二进制数据通常是必不可少的，但Javascript对此支持不足，因此，V8.Node增加了Buffer类，方便并且高效地处理二进制数据。因此，Node不仅仅简单地使用了V8，还对其进行了优化，使其在各环境下更加给力。V8引擎本身使用了一些最新的编译技术。这使得用Javascript这类脚本语言编写出来的代码运行速度获得了极大提升，却节省了开发成本。对性能的苛求是Node的一个关键因素。 Javascript是一

26、个事件驱动语言，Node利用了这个优点，编写出可扩展性高的服务器。Node采用了一个称为“事件循环(event loop）”的架构，使得编写可扩展性高的服务器变得既容易又安全。提高服务器性能的技巧有多种多样。Node选择了一种既能提高性能，又能减低开发复杂度的架构。这是一个非常重要的特性。并发编程通常很复杂且布满地雷。Node绕过了这些，但仍提供很好的性能。虽然让Javascript运行于服务器端不是Node的独特之处，但却是其一强大功能。不得不承认，浏览器环境限制了我们选择编程语言的自由。任何服务器与日益复杂的浏览器客户端应用程序间共享代码的愿望只能通过Javascript来实现。虽然还存在

27、其他一些支持Javascript在服务器端 运行的平台，但因为上述特性，Node发展迅猛，成为事实上的平台。Nodejs可以在不新增额外线程的情况下，依然可以对任务进行并行处理 Nodejs是单线程的。它通过事件轮询（event loop）来实现并行操作，对此，我们应该要充分利用这一点 尽可能的避免阻塞操作，取而代之，多使用非阻塞操作。（2）基于Socket的编程从概念上理解，Socket是网络编程中最常见的是客户/服务器模式，也是我们本聊天工具的基础。以该模式编程时，服务器端有一个进程或多个进程在指定的端口等待客户来连接，一旦连接成功，便按设计的数据交换方法和格式进行数据传输。客户端向服务器

28、端提出连接请求，连接之后进行通信。Socket是一种用于表达两台机器之间连接终端的软件抽象。对于一个给定的连接，在每台机器上都有一个Socket,可以想象一条虚拟的电缆工作在两台机器之间，电缆插在两台机器的Socket上。当然，物理硬件和两台机器之间的“电缆”这些连接装置都是未知的，抽象的，所以目的就是为了让我们不必了解更多的细节。简单说，一台计算机上的Socket同另一台计算机通话创建一个通信信道，程序员可以用这个信道在两台机器之间发送消息。第六章 详细设计详细设计阶段的根本目标是确定应该怎样具体实现所要求的系统，也是就是说，经过这个阶段的设计工作，应该得出对目标系统的精确描述，详细设计结果

29、基本上决定了最终的程序代码的质量，为了实现该即时通讯系统需要布置服务器，设计显示页面，聊天功能设置，及表情发送，文件传输等按钮的设置。利用上面的如上的测试代码，创建一个HTTP服务器并监听端口。图6-1从命令行运行node server或者node server.js,服务器便可启动了，此刻我们就可以在浏览器栏输入localhost进行访问，也可以输入本机IP127.0.0.1。6.1基本页面的实现主界面的构建，因为是比较大众化的应用了，界面不用多想，脑海中已经有大致的雏形，它有一个呈现消息的主窗体，还有一个输入消息的文本框，同时需要一个发送消息的按钮，这三个是必备的。另外就是，这里还准备实现

30、以下四个功能，所以界面上还有设置字体颜色，发送表情，发送图片和清楚记录四个按钮。最后的页面显示如下：图6-1HTML代码如下： hichat HiChat :) connecting to server. 样式文件main.css代码如下：html, body margin: 0; background-color: #efefef; font-family: sans-serif;.wrapper width: 500px; height: 640px; padding: 5px; margin: 0 auto; background-color: #ddd;#loginWrapper po

31、sition: fixed; top: 0; right: 0; bottom: 0; left: 0; background-color: rgba(5, 5, 5, .6); text-align: center; color: #fff; display: block; padding-top: 200px;#nickWrapper display: none;.banner height: 80px; width: 100%;.banner p float: left; display: inline-block;.controls height: 100px; margin: 5px

32、 0px; position: relative;#historyMsg height: 400px; background-color: #fff; overflow: auto; padding: 2px;#historyMsg img max-width: 99%;.timespan color: #ddd;.items height: 30px;#colorStyle width: 50px; border: none; padding: 0;/*custom the file input*/.imageLable position: relative;#sendImage posit

33、ion: absolute; width: 52px; left: 0; opacity: 0; overflow: hidden;/*end custom file input*/#messageInput width: 440px; max-width: 440px; height: 90px; max-height: 90px;#sendBtn width: 50px; height: 96px; float: right;#emojiWrapper display: none; width: 500px; bottom: 105px; position: absolute; backg

34、round-color: #aaa; box-shadow: 0 0 10px #555;#emojiWrapper img margin: 2px; padding: 2px; width: 25px; height: 25px;#emojiWrapper img:hover background-color: blue;.emoji display: inline;footer text-align: center;为了让项目有一个良好的目录结构便于管理，我们在WWW文件夹下新建一个styles文件夹存放样式文件main.css,然后新建一个scripts文件夹存放需要的js文件比如hic

35、hat.js,而我们的服务器文件server.js位置不变还是放到最外层。同时再新建一个content文件夹用于存放其他资源比如图片等，其中content文件夹里再建一个emoji文件夹用于存放表情gif图，最后我们项目的目录结构应该是这样的：node_moduleswww content emoji scriptsstyles6.2用户登录界面图6-26.3发送图片基本的聊天功能已经实现，下一步，我们想让用户可以发送图片，那样程序便更加完美了。图片不同于文字，但通过将图片转化为字符串形式后，便可以像发送普通文本消息一样发送图片了，只是在显示的时候将它还原为图片。在这之前，我们已经将图片按钮在

36、页面放好了，其实是一个文件类型的input，下面只需在它身上做功夫便可。用户点击图片按钮后，弹出文件选择窗口供用户选择图片。之后我们可以在JavaScript代码中使用FileReader来将图片读取为base64格式的字符串形式进行发送。而base64格式的图片直接可以指定为图片的src，这样就可以将图片用img标签显示在页面了。为此我们监听图片按钮的change事件，一但用户选择了图片，便显示到自己的屏幕上同时读取为文本发送到服务器。代码如下：document.getElementById(sendImage).addEventListener(change, function() /检查

37、是否有文件被选中 if (this.files.length != 0) /获取文件并用FileReader进行读取 var file = this.files0, reader = new FileReader(); if (!reader) that._displayNewMsg(system, !your browser doesnt support fileReader, red); this.value = ; return; ; reader.onload = function(e) /读取成功，显示到页面并发送到服务器 this.value = ; that.socket.emi

38、t(img, e.target.result); that._displayImage(me, e.target.result); ; reader.readAsDataURL(file); ; , false);现在启动服务器打开程序，我们就可以发送图片了。图6-36.4发送表情文字总是很难表达出说话时的面部表情的，于是表情就诞生了。前面已经介绍过如何发送图片了，严格来说，表情也是图片，但它有特殊之处，因为表情可以穿插在文字中一并发送，所以就不能像处理图片那样来处理表情了。根据以往的经验，其他聊天程序是把表情转为符号，比如我想发笑脸，并且:)这个符号代表笑脸表情，然后数据传输过程中其实传输的是一个冒号加右括号的组合，当每个客户端接受到消息后，从文字当中将这些表情符号提取出来，再用gif图片替换，这样呈现到页面我们就能看到表情文字的混排了。首先得将所有可用的表情图片显示到一个小