学位论文jqueryajax聊天室完整版.docx

学位论文jqueryajax聊天室完整版.docx

《学位论文jqueryajax聊天室完整版.docx》由会员分享，可在线阅读，更多相关《学位论文jqueryajax聊天室完整版.docx（77页珍藏版）》请在冰豆网上搜索。

学位论文jqueryajax聊天室完整版

基于jQuery的Ajax聊天室应用

摘要

随着网络的逐渐普及，以及网络技术的不断发展，人们通过网络进行交流的方式变得多样化。

网络聊天室便是其中之一。

聊天室的即时交流方式满足了网络中多人同时聊天交流的需要，使得较多的人在同一个聊天页面进行交流变得方便，简单。

本设计的目的是采用jQuery框架开发一个网络聊天室。

jQuery是一个快速和简洁的JavaScript库，它简化了HTML文件的文档遍历、事件处理、动画以及快速Web开发应用的Ajax技术。

本聊天室具有常用聊天室的所有功能，包括多人同时在线聊天,能显示在线用户列表，同时，为了管理聊天室中的用户，设计了用户注册登陆功能,增加了聊天室的操作性。

本文首先介绍了聊天室所使用到的一些关键技术，例如jQuery技术和Ajax技术，接着介绍了该系统的设计思路，然后是对系统的详细介绍，包括系统中创建的数据库以及系统的具体功能介绍。

聊天室在互联网上的应用非常普遍，实现的方法也是多种多样，相比之下，采用优秀的jQuery框架实现的聊天室更加高效、流畅，更加富有前景。

关键词：

聊天室；jQuery；Ajax

JQueryAjax-basedChatRoomApplication

Abstract

Withtheincreasingpopularityofthenetworkandthedevelopmentofnetworktechnology,thewaytocommunicatewithothersthroughthenetworkbecomesdiverse.Internetchatroomisoneoftheway.Itmeetstheneedofpeoplethatcancommunicatewithotherswhoareonlineinstantly,andmakespeoplechattingonthesamepagebecomesconvenientandsimple.

ThedesignaimstodevelopachatroombasedonjQuerystructure.jQueryisafastandconciseJavaScriptLibrarythatsimplifiesHTMLdocumenttraversing,eventhandling,animating,andAjaxinteractionsforrapidwebdevelopment.Thechatroomhasallcommonfunctions,includingmorethanonechattinginthesametimeandcandisplayandupdatethelistofonlineusersinstantly.Meanwhile,inordertomanagetheusers,thechatroomhastheuserregistrationloginfunctionwhichincreasetheoperabilityofthechatroom.

Thepaperfirstintroducesthekeytechnologiesusedsuchasjqueryandajax,thenintroducedthesystemdesignandrequirementsanalysis,followedbyadetaileddescriptionofthesystem,includingadatabasecreatedandspecificfeaturesintroducedinthedesign.TheapplicationofthechatroomisverycommonontheInternet,andtheapproachesofimplementationarevaried.Comparedwiththosetraditional,thechatroombasedonjQueryismoreeffectiveandfast,andhaveabrightoutlook.

Keywords:

ChatRoom;Ajax;jQuery

目录

引言1

第1章绪论2

1.1系统概述2

1.2需求背景2

1.3系统开发目的与意义2

第2章开发工具及相关技术介绍3

2.1开发工具3

2.1.1MyEclipse介绍3

2.1.2MySQL数据库介绍3

2.1.3Tomcat6.0服务器3

2.2关键技术4

2.2.1JSP4

2.2.2JavaScript4

2.2.3Ajax技术5

2.2.4jQuery技术5

2.2.5Struts技术5

2.3系统环境6

2.3.1开发环境6

2.3.2运行环境6

第3章jQuery技术8

3.1jQuery简介8

3.2配置jQuery环境8

3.3编写简单的jQuery代码8

3.4jQuery选择器8

3.5jQuery与Ajax的应用9

第4章系统设计17

4.1基于jQuery的Ajax聊天室功能要求17

4.2聊天室总体功能结构图17

4.3聊天室总体架构17

4.4模块设计19

4.5数据库设计20

第5章系统实现22

5.1项目代码结构设计22

5.2详细设计介绍22

5.2.1登录功能设计22

5.2.2注册功能设计25

5.2.3聊天功能设计28

第6章系统测试38

6.1单元测试38

6.2集成测试39

6.3系统测试39

结论与展望41

致谢42

参考文献43

附录44

附录A外文文献及其翻译44

附录B主要参考文献的题录及摘要51

插图清单

图5-1项目代码结构图22

图5-2登陆页面图23

图5-3登陆失败图23

图5-4注册页面图26

图5-5聊天页面图29

图5-6xia的登录页面图31

图5-7ss的登录页面图31

图5-8ss的聊天页面图32

图5-9xia的聊天页面图32

表格清单

表4-1用户信息表21

表4-2聊天信息表21

表6-1用户登录信息等价类划分38

表6-2用户登录信息测试用例39

引言

Internet是目前世界上最大的计算机互联网络，它遍布全球，将世界各地各种规模的网络连接成一个整体。

作为Internet上一种先进的，易于被人们所接受的信息检索手段，WorldWideWeb（简称WWW）发展十分迅速，成为目前世界上最大的信息资源宝库。

如今，人们不仅可以在网上查询自己需要的资源，而且可以通过网络进行实时的沟通。

从实时性和有效性上都超过了用信件和Email，并且在费用上要低于电话。

因而各种聊天服务备受用户青睐，在这方面的开发与应用也较多，聊天服务也成为互联网提供的重要服务之一，因此，建立一个好的在线交流聊天系统十分重要。

互联网的大多数网站都建有聊天室，并且有专业聊天网站提供聊天服务。

网上聊天系统是为人们进行交流和联系提供的一个平台。

利用现代的网络资源优势和技术优势，通过提供完善的网上聊天系统，以达到增进人们与人们之间的信息交流和沟通的目的。

第1章绪论

1.1系统概述

近年来计算机技术的快速发展，特别是计算机网络的发展，越来越深刻的改变了人们生活的方方面面，使得人们能以更低廉的价格，开发出更方便、更实用的网络工具。

各种在线服务系统，更是深刻的影响了人们的联系和交流方式，使得人们可以在远隔千里之遥随时通讯。

过去的种种陈旧的联系方式，已经不能满足现代生活的需要。

网上聊天系统作为一种方便拥有共同兴趣爱好的人们之间联系的实用系统便应运而生。

本设计主要是实现一个能够方便人们在线交流的聊天室，能够及时显示在线人员和聊天内容。

1.2需求背景

随着计算机网络日新月异的发展，人们的交流方式越来越多，传统的交流方式，如：

信件、电报、电话等已经难以满足人们的交流要求，在互联网上即时的和好友取得联系，已经成为当今社会人们主流的联系方式。

两台计算机之间进行即时通讯、发送文件等交流方式已经成为时代的潮流。

因此出现了QQ等聊天工具。

然而QQ等聊天工具虽然方便、实用，但是，娱乐功能太多，有很多吸引人的娱乐功能，从一定程度上来说，是一种娱乐工具，不能作为用于作为即时通讯、文件共享的专用工具。

目前，用于实现单一的即时通讯、文件共享的软件实在太少，并且，它们中大部分都是绝对的C/S模式，对远程服务器有非常大的依赖性，没有彻底实现点对点的交流。

在常见的聊天室开发中，有基于ASP、基于SOCKET、基于JAVA开发的聊天室，本系统采用基于JSP采用jQuery和Ajax技术进行开发。

JSP将网页逻辑与网页设计和显示分离，支持可重用的基于组件的设计，使基于Web的应用程序的开发变得迅速和容易。

因此，采用JSP开发在线聊天系统可以提高开发效率和系统性能。

网上聊天系统是常见的，也是比较有代表性的Internet应用系统之一，其实现的难点是聊天怎样保存聊天内容以及怎么样将聊天的信息及时快捷地在服务器和用户之间进行传递和共享。

目前常见的聊天内容保存方式有三种：

一是利用数据库直接保存聊天内容；二是利用文本文件保存聊天内容三是利用Application对象保存聊天内容。

这三种聊天内容保存方法的基本过程和开发的难易程度相似。

本系统采用第二种方式，将聊天信息存入数据库中，管理起来较方便。

1.3系统开发目的与意义

网络聊天系统是为人与人之间进行交流和联系提供的一个平台。

通过提供完善的聊天服务和规范的管理，可以达到增进人与人之间的感情，促进人们之间的沟通，方便人们联系的目的；同时本系统可以拉近人与人之间的距离，丰富人们的业余时间，为人们在网络中交友提供了便捷的渠道。

第2章开发工具及相关技术介绍

2.1开发工具

2.1.1MyEclipse介绍

MyEclipse企业级工作平台（MyEclipseEnterpriseWorkbench，简称MyEclipse）是对EclipseIDE的扩展，利用它我们可以在数据库和JavaEE的开发、发布以及应用程序服务器的整合方面极大的提高工作效率。

它是功能丰富的JavaEE集成开发环境，包括了完备的编码、调试、测试和发布功能，完整支持HTML，Struts，JSP，CSS，JavaScript，Spring，SQL，Hibernate。

2.1.2MySQL数据库介绍

MySQL是一个小型关系型数据库管理系统，开发者为瑞典MySQLAB公司。

MySQL是一种关联数据库管理系统，关联数据库将数据保存在不同的表中，而不是将所有数据放在一个大仓库内。

这样就增加了速度并提高了灵活性。

MySQL的SQL“结构化查询语言”。

SQL是用于访问数据库的最常用标准化语言。

MySQL软件采用了GPL（GNU通用公共许可证）。

由于其体积小、速度快、总体拥有成本低，尤其是开放源码这一特点，许多中小型网站为了降低网站总体拥有成本而选择了MySQL作为网站数据库。

MySQL是一个快速、多线程、多用户的SQL数据库服务器。

它支持正规的SQL查询语言和采用多种数据类型，能对数据进行各种详细的查询等。

MySQL数据库的主要特征有：

（1）MySQL的核心程序采用完全的多线程编程。

线程是轻量级的进程，它可以灵活地为用户提供服务，而不过多的系统资源。

用多线程和C语言实现的MySql能很容易充分利用CPU。

（2）MySQL可运行在不同的操作系统下。

（3）MySQL有一个非常灵活而且安全的权限和口令系统。

当客户与MySQL服务器连接时，他们之间所有的口令传送被加密，而且MySQL支持主机认证。

（4）MySQL支持ODBCforWindows。

（5）MySQL支持大型的数据库。

MySQL可以方便地支持上千万条记录的数据库。

作为一个开放源代码的数据库，MySQL可以针对不同的应用进行相应的修改。

（6）MySQL拥有一个非常快速而且稳定的基于线程的内存分配系统，可以持续使用面不必担心其稳定性。

事实上，MySQL的稳定性足以应付一个超大规模的数据库。

（7）强大的查询功能。

MySQL支持查询的SELECT和WHERE语句的全部运算符和函数，并且可以在同一查询中混用来自不同数据库的表，从而使得查询变得快捷和方便[10]。

2.1.3Tomcat6.0服务器

Tomcat是Apache软件基金会（ApacheSoftwareFoundation）的Jakarta项目中的一个核心项目，由Apache、Sun和其他一些公司及个人共同开发而成。

因为Tomcat技术先进、性能稳定，而且免费，因而深受Java爱好者的喜爱并得到了部分软件开发商的认可，成为目前比较流行的Web应用服务器。

Tomcat同样也很受广大程序员的喜欢，因为它运行时占用的系统资源小，扩展性好，支持负载平衡与邮件服务等开发应用系统常用的功能；而且它还在不断的改进和完善中，任何一个感兴趣的程序员都可以更改它或在其中加入新的功能。

Tomcat是一个轻量级应用服务器，在中小型系统和并发访问用户不是很多的场合下被普遍使用，是开发和调试JSP程序的首选。

当配置正确时，Apache为HTML页面服务，而Tomcat实际上运行JSP页面和Servlet。

另外，Tomcat和IIS、Apache等Web服务器一样，具有处理HTML页面的功能，另外它还是一个Servlet和JSP容器，独立的Servlet容器是Tomcat的默认模式。

不过，Tomcat处理静态HTML的能力不如Apache服务器。

目前Tomcat最新版本为7.0.27Released。

本系统采用Tomcat6.0版本。

2.2关键技术

2.2.1JSP

JSP（JavaServerPages）是由SunMicrosystems公司倡导、许多公司参与一起建立的一种动态网页技术标准。

JSP技术有点类似ASP技术，它是在传统的网页HTML文件（*.htm,*.html）中插入Java程序段（Scriptlet）和JSP标记（tag），从而形成JSP文件（*.jsp）。

用JSP开发的Web应用是跨平台的，既能在Linux下运行，也能在其他操作系统上运行。

JSP页面由HTML代码和嵌入其中的Java代码所组成。

服务器在页面被客户端请求以后对这些Java代码进行处理，然后将生成的HTML页面返回给客户端的浏览器。

JavaServlet是JSP的技术基础，而且大型的Web应用程序的开发需要JavaServlet和JSP配合才能完成。

JSP具备了Java技术的简单易用，完全的面向对象，具有平台无关性且安全可靠，主要面向因特网的所有特点。

JSP是一种编译性程序，当一个JSP应用程序被首次访问时，JSP所在的服务器首先将JSP程序转变成为java程序，然后编译成class类文件，最后加载到服务器内存中为客户端请求提供服务。

客户请求结束后，依然驻留内存，等待第二次请求到达。

所以JSP网页在执行上通常是首次执行比较慢，但以后的执行速度要快很多。

这是ASP程序锁不具备的[9]。

JSP有五种内置对象：

1.request对象：

该对象封装了用户提交的信息，通过调用该对象相应的方法可以获取封装的信息，即使用该对象可以获取用户提交信息。

它是HttpServletRequest的实例。

2.response对象：

对客户的请求做出动态的响应，向客户端发送数据。

3.Session对象：

session对象是一个JSP内置对象，它在第一个JSP页面被装载时自动创建，完成会话期管理。

从一个客户打开浏览器并连接到服务器开始，到客户关闭浏览器离开这个服务器结束，被称为一个会话。

当一个客户访问一个服务器时，可能会在这个服务器的几个页面之间反复连接，反复刷新一个页面，服务器应当通过某种办法知道这是同一个客户，这就需要session对象。

4.application对象：

服务器启动后就产生了这个application对象，当客户在所访问的网站的各个页面之间浏览时，这个application对象都是同一个，直到服务器关闭。

但是与session不同的是，所有客户的application对象都是同一个，即所有客户共享这个内置的application对象。

5.out对象：

out对象是一个输出流，用来向客户端输出数据。

out对象用于各种数据的输出。

2.2.2JavaScript

JavaScript是Netscape公司开发的一种脚本语言。

JavaScript的出现使得网页和用户之间实现了一种实时的、动态的和交互的关系，使网页包含更多的活跃的元素和更加精彩的内容。

JavaScript自身存在3个弊端，即复杂的文档对象模型（DOM），不一致的浏览器实现和缺乏便捷的开发、调试工具。

正当JavaScript从开发者的视线中渐渐隐去时，一种新型的基于JavaScript的Web技术——Ajax（AsynchronousJavaScriptAndXML，异步的JavaScript和XML）诞生了。

而使人们真正认识到Ajax技术的强大的导火索是Google公司推出的一系列新型Web应用，例如Gmail、GoogleSuggest和GoogleMap等。

互联网中基于JavaScript的应用越来越多，使JavaScript不再是一种仅仅用于制作Web页面的简单脚本[3]。

2.2.3Ajax技术

Ajax即“AsynchronousJavaScriptandXML”（异步JavaScript和XML），Ajax不是一种新的编程语言，而是一种用于创建更好更快以及交互性更强的Web应用程序的技术。

通过Ajax，JavaScript可使用JavaScript的XMLHttpRequest对象来直接与服务器进行通信[4]。

通过这个对象JavaScript可在不重载页面的情况与Web服务器交换数据。

Ajax在浏览器与Web服务器之间使用异步数据传输（HTTP请求），这样就可使网页从服务器请求少量的信息，而不是整个页面。

Ajax可使因特网应用程序更小、更快，更友好。

Ajax是一种独立于Web服务器软件的浏览器技术[2]。

2.2.4jQuery技术

jQuery是继prototype之后又一个优秀的JavaScript框架。

它是轻量级的js库（压缩后只有21k），它兼容CSS3，还兼容各种浏览器（IE6.0+，FF1.5+，Safari2.0+，Opera9.0+）。

jQuery使用户能更方便地处理HTMLdocuments、events、实现动画效果，并且方便地为网站提供Ajax交互。

jQuery还有一个比较大的优势是，它的文档说明很全，而且各种应用也说得很详细，同时还有许多成熟的插件可供选择。

jQuery能够使用户的HTML页保持代码和HTML内容分离，也就是说，不用再在HTML里面插入一堆js来调用命令了，只需定义id即可。

jQuery凭借简洁的语法和跨平台的兼容性，极大地简化了JavaScript开发人员遍历HTML文档、操作DOM、处理事件、执行动画和开发Ajax的操作，其独特而又优雅的代码风格改变了JavaScript程序员的设计思路和编写程序的方式。

总之，无论是网页设计师、后台开发者、业余爱好者还是项目管理者，都很有必要去学习jQuery。

jQuery强调的理念是写得少，做得多。

jQuery独特的选择器、链式操作、事件处理机制和封装完善的Ajax都是其他JavaScript库望尘莫及的[1]。

2.2.5Struts技术

Struts是开源软件。

使用Struts的目的是为了帮助我们减少在运用MVC设计模型来开发Web应用的时间。

如果我们想混合使用Servlets和JSP的优点来建立可扩展的应用，struts是一个不错的选择。

Struts1框架以ActionServlet作为核心控制器，整个应用由客户端请求驱动。

当客户端向Web应用发送请求时，请求将被Struts1的核心控制器ActionServlet拦截，ActionServlet根据请求决定是否需要调用业务逻辑控制器处理用户请求（实际上，业务逻辑控制器还是控制器，它只是负责调用模型来处理用户请求），当用户请求处理完成后，其处理结果通过JSP呈现给用户。

对于整个Struts1框架而言，控制器就是它的核心，Struts1的控制器由两个部分组成：

核心控制器和业务逻辑控制器。

其中核心控制器就是ActionServlet，由Struts1框架提供；业务逻辑控制就是用户自定义的Action，由应用开发者提供。

对于大部分用户请求而言，都需要得到服务器的处理。

当用户发送一个需要得到服务器处理的请求时，该请求被ActionServlet拦截到，ActionServlet将该请求转发给对应的业务逻辑控制器，业务逻辑控制器调用模型来处理用户请求；如果用户请求只是希望得到某个URL资源，则由ActionServlet将被请求的资源转发给用户。

Struts2与Struts1相比，确实有很多革命性的改进，但它并不是新发布的新框架，而是在另一个赫赫有名的框架：

WebWork基础上发展起来的。

从某种程度上来讲，Strut2没有继承Struts1的血统，而是继承了WebWork的血统。

或者说，WebWork衍生出了Struts2，而不是Struts1衍生了Struts2。

因为Struts2是WebWork的升级，而不是一个全新的框架，因此稳定性、性能等各方面都有很好的保证；而且吸收了Struts1和WebWork两者的优势，因此，是一个非常值得期待的框架[15]。

2.3系统环境

2.3.1开发环境

开发模式系统基于Browser/Server模式进行设计

开发工具：

myeclipse8.6、JDK6.0

开发语言：

JAVA：

、JSP、HTML、JavaScript

后台数据库：

MySQLServer5.1

服务器：

采用Tomcat6.0服务器

2.3.2运行环境

硬件环境：

1.服务器端

服务器端的最低配置是由建立站点所需的软件来决定的，在最低配置的情况下，服务器的往往不尽如人意，现在的硬件性能已经相当出色，而且价格也很便宜，因此通常应给服务器端配置高性能的硬件。

本网络系统服务器端的配置如下：

处理器：

InterPentium41.6GHz或更高

内存：

512MB

硬盘空间：

80GB

光驱：

CD-ROM48X

显卡：

SVAG显示适配器

2.用户端

因为客户端主要用于浏览和操作数据，所以对客户端的硬件要求不高，不过现在的电脑很高的性价比，因此需要的配置应该高于下面的配置：

处理器：

InterPentium1.0GHz或更高

内存：

256MB

硬盘空间：

40GB

光驱：

CD-ROM48X

显卡：

SVAG显示适配器。

软件环境：

1.服务器端

操作系统：

Windows2000Server

网络协议：

TCP/IP

web服务器：

Tomcat6.0