基于Ajax的Web聊天系统设计与实现.doc

《基于Ajax的Web聊天系统设计与实现.doc》由会员分享，可在线阅读，更多相关《基于Ajax的Web聊天系统设计与实现.doc（13页珍藏版）》请在淘文阁 - 分享文档赚钱的网站上搜索。

1、Comment 微微微微1: 用 3 号黑体字 填写题目Comment 微微微微2: 用 4 号宋体字 填写姓名、学号、系别、专业、 年级、指导老师和日期华侨大学厦门工学院本科生毕业设计（论文）本科生毕业设计（论文）题 目： 姓 名： 学 号： 系 别： 专 业： 年 级： 指导教师： 年 月 日华侨大学厦门工学院 毕业设计（论文）独创性声明独创性声明本毕业设计（论文）是我个人在导师指导下完成的。文中引用他人研究成果的部分已在标注中说明；其他同志对本设计（论文）的启发和贡献均已在谢辞中体现；其它内容及成果为本人独立完成。特此声明。论文作者签名： 日期： 关于论文使用授权的说明关于论文使用授权的

2、说明本人完全了解华侨大学厦门工学院有关保留、使用学位论文的规定，即：学院有权保留送交论文的印刷本、复印件和电子版本，允许论文被查阅和借阅；学院可以公布论文的全部或部分内容，可以采用影印、缩印、数字化或其他复制手段保存论文。保密的论文在解密后应遵守此规定。论文作者签名： 指导教师签名： 日期： Comment 微微微微3: 居中，3 号黑 体，加粗；设置段前、段后距为 1 行；行距：固定值 36 磅Comment 微微微微4: 居中，4 号黑 体；设置段前、段后距为 1 行； 行距：固定值 24 磅Comment 微微微微5: 摘要内容 5 号 宋体；设置段前、段后距为 0 行； 行距：固定值

3、20 磅Comment 微微微微6: “关键词”三个 字使用，5 号，黑体，加粗Comment 微微微微7: 在“摘要内容” 后空一行书写，5 号宋体；关键 词之间“， ”分隔。I基于基于 AjaxAjax 的的 WebWeb 聊天系统设计与实现聊天系统设计与实现摘要摘要随着 Internet 的迅速发展，许多 C/S 结构的应用程序纷纷转向 B/S 结构的 web 应用程序。web 版的应用程序，让用户可以利用基于浏览器的客户端轻松地使用程序，不用考虑平台之间的差异、程序可移植性好、容易部署并且维护简单。但由于 B/S 结构采用同步的请求/响应机制，浏览器中的页面在请求后要进行全部刷新，且在

4、页面刷新的过程中，用户只能看着浏览器空白的界面不能做其他的事情。这严重影响了用户体验，使 B/S 结构的应用丧失了原有基于 C/S 结构的良好用户体验，一定程度上制约着 web 应用程序的发展。但近来，Google 公司的 Google Maps、Gmail 和 Google Suggest 等 web 应用却打破了这个制约，给用户带来了良好的用户体验。Google 在这方面的取得巨大的成功，这催生了 Ajax 概念的诞生，并吸引着越来越多的人构建具有丰富客户体验的 web 应用。目前常规的即时聊天工具如 QQ 要求要安装客户端(基于 C/S 模式)，这种要求在一定程度上会带来某种不便，但其丰

5、富的用户交互功能吸引着众多的用户。本课题的目的是使用 Ajax 开发模式设计和实现一个 web 版的即时聊天系统，使 B/S 的 web 应用具有像 C/S 模式一样的用户交互。本文将通过介绍传统 web 应用的不足，引入 Ajax 技术，介绍什么是 Ajax 以及基于 Ajax 的 web 应用模型，总结 Ajax 在聊天系统中的应用，最后本文将通过设计和实现 web 版的即时聊天系统具体展示如何在 web 中的应用 Ajax 技术。关键词关键词：Ajax，web 应用，聊天系统Comment 微微微微8: 居中、3 号 Times New Roman 字体；段前、 段后距为 1 行；行距：

6、固定值 36 磅Comment 微微微微9: 居中，4 号 Times New Roman 字体，加粗； 段前、段后距为 1 行；行距：固 定值 24 磅Comment 微微微微10: 英文摘要内 容 5 号 Times New Roman 字体； 段前、段后距为 0 行；行距：固 定值 20 磅Comment 微微微微11: 在“摘要内 容”后空一行书写，5 号 Times New Roman 字体；关键词之间 “， ”分隔华侨大学厦门工学院 毕业设计（论文）IIDesign and Implement of Web Chat System Base on Ajax AbstractAbst

7、ractAlong with the rapid development of Internet, many C/S based applications translate to B/S based web applications. （其它内容略）Key Words: Ajax, Web Application, Chat System Comment 微微微微12: 居中，小 2 号黑体，两字之间空四格；段前、 段后距为 1 行；行距：固定值 36 磅Comment 微微微微13: 目录内容小 4 号宋体,行距：固定值 20 磅,标 题列至一或二级节标题III目目 录录第 1 章 绪论

8、.III1.1 研究背景.11.2 研究意义.11.3 研究内容.11.4 论文组织.1第 2 章 Web 版聊天系统的设计.22.1 功能设计.22.2 概要设计.22.3 详细设计 .22.3.1 用户界面逻辑设计.22.3.2 数据库的设计 .32.3.3 基于 Ajax 的 web 应用的交互逻辑 .3结论 .4参考文献 .5谢辞 .6附录一 部分关键源码及解释 .7Comment 微微微微14: 章标题居中， 黑体小 2 号；段前、段后距为 1 行；行距为固定值 36 磅Comment 微微微微15: 一级节标题 序数顶格书写，后空 1 格书写标 题，黑体小 3 号；段前、段后距 为

9、 1 行；行距为固定值 24 磅Comment 微微微微16: 正文宋体小 4 号 ，段前、段后距为 0 行；行 距为固定值 20 磅Comment 微微微微17: 在引用到参 考文献的内容末尾右上角（上标） ，放置文献编号，宋体小 4 号基于 Ajax 的 Web 聊天系统设计与实现1第 1 章 绪论1.1 研究背景随着 Internet 的迅速发展，基于 B/S 的应用程序越来越受欢迎。在 B/S 结构程序中，用户可以利用基于浏览器的客户端轻松地使用程序；程序可以运行在不同的平台上，不用考虑平台之间的差异；只需部署服务器，客户端可以直接运行在浏览器上，部署简单且便于维护。B/S 的诸多优点

10、使众多软件商将 Web 作为首选平台，促使许多 C/S 结构的程序纷纷转向 B/S 结构。但由于互联网是一个同步的请求/响应系统，浏览器需要在请求后刷新整个页面。在页面刷新的过程中，用户只能看着浏览器空白的界面不能做其他的事情，这严重影响了用户体验，也制约着 B/S 结构程序的发展。同步请求和全部刷新，本质上是 B/S 请求响应机制所采用的 HTTP 协议决定的。这似乎是 web 理所当然的缺陷，但 Google 公司的 Google Maps、Gmail 和 Google Suggest 等web 应用却打破了同步请求和全部刷新的制约，给用户带来了良好的用户体验1。Google在这方面的取得

11、巨大的成功催生了 Ajax 概念的诞生，并吸引着越来越多的人构建具有丰富客户体验的 web 应用。传统的即时聊天系统是基于 C/S 结构的桌面应用程序，它的即时通讯功能和提供给用户的良好体验吸引着众多的用户。但基于 C/S 结构的聊天系统，要求用户一定要安装特定的客户端。这个要求在一定的程度上会带来种种不便，不能适应于不同操作系统平台；既要部署服务器，也要安装特定的客户端，部署不方便；系统升级时既要升级服务器也要升级客户端，升级和维护都及其不便2。1.2 研究意义（内容略）1.3 研究内容（内容略）1.4 论文组织（内容略）Comment 微微微微18: 每章均应另 起一页Comment 微微

12、微微19: 图与前文间 隔 1 行；图内文字宋体 5 号Comment 微微微微20: 图序按章编 号；图序图名置于表的下方，居 中，宋体 5 号Comment 微微微微21: 图与后文间 隔 1 行Comment 微微微微22: 二级节标题 序数缩进 2 格书写，后空 1 格书 写标题，黑体小 3 号；段前、段 后距为 1 行；行距为固定值 20 磅华侨大学厦门工学院 毕业设计(论文)2第 2 章 Web 版聊天系统的设计2.1 功能设计（内容略）2.2 概要设计基于 Ajax 的 web 即时聊天系统的概要设计如图 2-1 所示。图 2-1 系统概要设计图（其它内容略）2.3 详细设计2.

13、3.1 用户界面逻辑设计（内容略）Comment 微微微微23: 总项包括的 分项采用、单独序号Comment 微微微微24: 表与前文间 隔 1 行；表序按章编号；表序表 名置于表的上方，居中，宋体 5 号Comment 微微微微25: 表格无左右 边框；表内文字宋体 5 号Comment 微微微微26: 表与后文间 隔 1 行Comment 微微微微27: 分项中的小 项采用、的序号或数 字加半括号基于 Ajax 的 Web 聊天系统设计与实现32.3.2 数据库的设计(1) item 表、user_appended 表和 group_appended 表这三个表主要用来存储用户和群组信息

14、。其中类型为用户的 item 表项和user_appended 共同表示用户信息，类型为群组的 item 表项和 group_appended 共同表示群组信息。各表的字段设计如表 2-1、表 2-2、表 2-3 所示。表 2-1 item 表字段名数据类型主键/允许空字段含义register_nameVARCHAR(31)PRIMARY KEY注册名display_nameVARCHAR(31)NOT NULL显示名Icon_srcVARCHAR(31)NOT NULL图标Item_typeVARCHAR(15)NOT NULL类型表 2-2 group_appended 表字段名数据类型主

15、键/允许空字段含义register_nameVARCHAR(31)PRIMARY KEY注册名managerVARCHAR(31)FOREIGN KEY管理员表 2-3 user_appended 表字段名数据类型主键/允许空字段含义register_nameVARCHAR(31)PRIMARY KEY注册名passwordVARCHAR(31)NOT NULL密码genderVARCHAR(1)NOT NULL性别from_whereVARCHAR(63)NULL来自哪里email_addressVARCHAR(63)NULL电子邮箱phone_numberVARCHAR(31)NULL电话

16、号码active_statusVARCHAR(7)NOT NULL状态从用户和群组中提取出共同的信息组成 item 表，是考虑了如下的原因：在主窗口中，需要显示好友列表和群组列表，都需要获取好友列表或群组列表的 1注册名、显示名及图标，而不需要其它的具体信息。这样在显示好友或群组列表时，服务只需查询 item 表，并返回相应的内容。方便统一表达朋友关系和组员-组关系，进一步方便了消息(message)表的设计，具 2体好处将在设计 message 表时说明。Comment 微微微微28: 不加章号； 另起一页；居中，黑体小 2 号； 段前、段后距为 1 行；行距为固 定值 36 磅华侨大学厦门

17、工学院 毕业设计(论文)4结论本文通过 web 版的即时聊天系统的设计和实现具体论述了什么是 Ajax，为什么要在web 中使用 Ajax 及如何在 web 中应用 Ajax 技术。做的具体工作如下：(1) 通过实践详细探究什么是 Ajax，为什么要在 web 中使用 Ajax，对这项新的技术或者说是新的开发模式做出比较直观的分析和展现；(2) 通过设计和实现基于 Ajax 的 web 即时聊天系统，比较直观地展现 Ajax 在 web 中的应用及如何实现这些应用，为其它的基于 Ajax 的 web 应用的设计和实现提供参考；(3) 设计和实现即时数据验证、二级联动下拉框、动态提示和自动更新等

18、模块，尽可能地保留原有的基于 C/S 的良好用户体验，将原属于桌面应用的即时聊天系统移植到 web中，为今后将桌面应用程序迁移成 web 版应用提供些许借鉴。通过这次的设计和实现基于 Ajax 的即时聊天系统，我深深地体会到了 Ajax 所带来的是 web 开发模式的变革，它使基于 B/S 结构的 web 应用的开发更像 C/S 结构的应用程序的开发浏览器端引入了 Ajax 引擎，有了一定的处理能力，浏览器中的内容可以看成是一个应用，这地位类似于 C/S 中的客户端。由于时间仓促及能力有限，在研究基于 Ajax 的 web 应用时没有对安全问题进行研究。因此，本课题研究的下一步工作展望是，考虑

19、 Ajax 的安全问题，研究更具健壮性的基于Ajax 的实现框架。针对实现的 web 版即时聊天系统，增加聊天信息加密之类的功能。Comment 微微微微29: 另起一页； 居中，黑体小 2 号；段前、段后 距为 1 行；行距为固定值 36 磅Comment 微微微微30: 按文中引用 的先后顺序用1、2、3 编号，后空 1 格书写内容（格式 详见“撰写规范” ） ；宋体小 4 号， 段前 3 磅，段后 0 行；行距为固 定值 20 磅Comment 微微微微31: 不同种类的毕 业设计(论文)对参考文献的篇数有具 体要求，详见“撰写规范”基于 Ajax 的 Web 聊天系统设计与实现5参考文

20、献1 李智毅新一代 Web 应用开发技术 AJAXC/孙立峰第二届和谐人机环境联合学术会议论文集. 北京：清华大学出版社，200731-342 王培，冯曼菲Web 2.0 开发技术详解M北京：人民邮电出版社，2006389-403，495-520.3 Garrett J J. Ajax:A New Approach to Web ApplicationsEB/OL. http:/ 美Ryan Asleson , Nathaniel T.SchuttaAjax 基础教程，金灵等译北京：人民邮电出版社，20065 徐驰. Ajax 模式在异步交互 Web 环境中的应用J. 计算机技术与发展,200

21、6,16(11)：229-233.6 姚国新基于 Ajax 的 WEB 应用技术的研究与实现D：硕士学位论文 陕西：西北大学信息科学与技术学院，20067 （内容略）8 （内容略）9 （内容略）10 （内容略）11 （内容略）12 （内容略）13 （内容略）14 （内容略）15 （内容略）Comment zc32: 另起一页；居中， 黑体小 2 号；段前、段后距为 1 行；行距：固定值 36 磅Comment zc33: 谢辞内容宋体小 4 号，段前、段后距为 0 行；行 距：固定值 20 磅华侨大学厦门工学院 毕业设计(论文)6谢辞在本文即将结束之际，我要由衷地感谢（其它内容略）Comment zc34: 居中，黑体小 2 号；段前、段后距为 1 行；行距： 固定值 36 磅Comment zc35: 附录内容宋体小 4 号；行距：固定值 20 磅基于 Ajax 的 Web 聊天系统设计与实现7附录 1 部分关键源码及解释在这部分，将结合具体的源代码具体说明系统的执行流程和逻辑。（内容略）