华侨大学厦门工学院
本科生毕业设计（论文）
题 目：
姓 名：
学 号：
系 别：
专 业：
年 级：
指导教师：
年 月 日
华侨大学厦门工学院 毕业设计（论文）
独创性声明
本毕业设计（论文）是我个人在导师指导下完成的。文中引用他人研究成果的部分已在标注中说明；其他同志对本设计（论文）的启发和贡献均已在谢辞中体现；其它内容及成果为本人独立完成。特此声明。
论文作者签名： 日期：
关于论文使用授权的说明
本人完全了解华侨大学厦门工学院有关保留、使用学位论文的规定，即：学院有权保留送交论文的印刷本、复印件和电子版本，允许论文被查阅和借阅；学院可以公布论文的全部或部分内容，可以采用影印、缩印、数字化或其他复制手段保存论文。保密的论文在解密后应遵守此规定。
论文作者签名： 指导教师签名： 日期：
基于Ajax 的Web 聊天系统设计与实现
摘要
随着Internet 的迅速发展，许多C/S结构的应用程序纷纷转向B/S结构的web 应用程序。web 版的应用程序，让用户可以利用基于浏览器的客户端轻松地使用程序，不用考虑平台之间的差异、程序可移植性好、容易部署并且维护简单。但由于B/S结构采用同步的请求/响应机制，浏览器中的页面在请求后要进行全部刷新，且在页面刷新的过程中，用户只能看着浏览器空白的界面不能做其他的事情。这严重影响了用户体验，使B/S结构的应用丧失了原有基于C/S结构的良好用户体验，一定程度上制约着web 应用程序的发展。
但近来，Google 公司的Google Maps、Gmail 和Google Suggest等web 应用却打破了这个制约，给用户带来了良好的用户体验。Google 在这方面的取得巨大的成功，这催生了Ajax 概念的诞生，并吸引着越来越多的人构建具有丰富客户体验的web 应用。
目前常规的即时聊天工具如QQ 要求要安装客户端(基于C/S模式) ，这种要求在一定程度上会带来某种不便，但其丰富的用户交互功能吸引着众多的用户。本课题的目的是使用Ajax 开发模式设计和实现一个web 版的即时聊天系统，使B/S的web 应用具有像C/S模式一样的用户交互。
本文将通过介绍传统web 应用的不足，引入Ajax 技术，介绍什么是Ajax 以及基于Ajax 的web 应用模型，总结Ajax 在聊天系统中的应用，最后本文将通过设计和实现web 版的即时聊天系统具体展示如何在web 中的应用Ajax 技术。
关键词：Ajax ，web 应用，聊天系统
华侨大学厦门工学院 毕业设计（论文）
Design and Implement of Web Chat System Base on Ajax
Abstract
Along 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
目 录
第1章 绪论 . .............................................................. III
1.1 研究背景 ............................................................ 1
1.2 研究意义 ............................................................ 1
1.3 研究内容 ............................................................ 1
1.4 论文组织 ............................................................ 1
第2章 Web版聊天系统的设计 ................................................. 2
2.1 功能设计 ............................................................ 2
2.2 概要设计 ............................................................ 2
2.3详细设计 . ............................................................ 2
2.3.1用户界面逻辑设计 ............................................... 2
2.3.2 数据库的设计 . .................................................. 3
2.3.3 基于Ajax 的web 应用的交互逻辑 . ................................. 3
结论 . ....................................................................... 4
参考文献 . ................................................................... 5
谢辞 . ....................................................................... 6
附录一 部分关键源码及解释 . .................................................. 7
第1章 绪论
1.1 研究背景
随着Internet 的迅速发展，基于B/S的应用程序越来越受欢迎。在B/S结构程序中，用户可以利用基于浏览器的客户端轻松地使用程序；程序可以运行在不同的平台上，不用考虑平台之间的差异；只需部署服务器，客户端可以直接运行在浏览器上，部署简单且便于维护。B/S的诸多优点使众多软件商将Web 作为首选平台，促使许多C/S结构的程序纷纷转向B/S结构。但由于互联网是一个同步的请求/响应系统，浏览器需要在请求后刷新整个页面。在页面刷新的过程中，用户只能看着浏览器空白的界面不能做其他的事情，这严重影响了用户体验，也制约着B/S结构程序的发展。
同步请求和全部刷新，本质上是B/S请求响应机制所采用的HTTP 协议决定的。这似乎是web 理所当然的缺陷，但Google 公司的Google Maps、Gmail 和Google Suggest等web 应用却打破了同步请求和全部刷新的制约，给用户带来了良好的用户体验[1]。Google 在这方面的取得巨大的成功催生了Ajax 概念的诞生，并吸引着越来越多的人构建具有丰富客户体验的web 应用。
传统的即时聊天系统是基于C/S结构的桌面应用程序，它的即时通讯功能和提供给用户的良好体验吸引着众多的用户。但基于C/S结构的聊天系统，要求用户一定要安装特定的客户端。这个要求在一定的程度上会带来种种不便，不能适应于不同操作系统平台；既要部署服务器，也要安装特定的客户端，部署不方便；系统升级时既要升级服务器也要升级客户端，升级和维护都及其不便[2]。
1.2 研究意义
（内容略）
1.3 研究内容
（内容略）
1.4 论文组织
（内容略）
第2章 Web版聊天系统的设计
2.1 功能设计
（内容略）
2.2 概要设计
基于Ajax 的web 即时聊天系统的概要设计如图2-1所示。
图2-1 系统概要设计图
（其它内容略）
2.3详细设计
2.3.1用户界面逻辑设计
（内容略）
2.3.2 数据库的设计
(1) item表、user_appended表和group_appended表
这三个表主要用来存储用户和群组信息。其中类型为用户的item 表项和user_appended共同表示用户信息，类型为群组的item 表项和group_appended共同表示群组信息。各表的字段设计如表2-1、表2-2、表2-3所示。
表2-1 item表
表2-2 group_appended表
从用户和群组中提取出共同的信息组成item 表，是考虑了如下的原因：
○1 在主窗口中，需要显示好友列表和群组列表，都需要获取好友列表或群组列表的注册名、显示名及图标，而不需要其它的具体信息。这样在显示好友或群组列表时，服务只需查询item 表，并返回相应的内容。
○2 方便统一表达朋友关系和组员-组关系，进一步方便了消息(message)表的设计，具体好处将在设计message 表时说明。
结论
本文通过web 版的即时聊天系统的设计和实现具体论述了什么是Ajax ，为什么要在web 中使用Ajax 及如何在web 中应用Ajax 技术。做的具体工作如下：
(1) 通过实践详细探究什么是Ajax ，为什么要在web 中使用Ajax ，对这项新的技术或者说是新的开发模式做出比较直观的分析和展现；
(2) 通过设计和实现基于Ajax 的web 即时聊天系统，比较直观地展现Ajax 在web 中的应用及如何实现这些应用，为其它的基于Ajax 的web 应用的设计和实现提供参考；
(3) 设计和实现即时数据验证、二级联动下拉框、动态提示和自动更新等模块，尽可能地保留原有的基于C/S的良好用户体验，将原属于桌面应用的即时聊天系统移植到web 中，为今后将桌面应用程序迁移成web 版应用提供些许借鉴。
通过这次的设计和实现基于Ajax 的即时聊天系统，我深深地体会到了Ajax 所带来的是web 开发模式的变革，它使基于B/S结构的web 应用的开发更像C/S结构的应用程序的开发——浏览器端引入了Ajax 引擎，有了一定的处理能力，浏览器中的内容可以看成是一个应用，这地位类似于C/S中的客户端。
由于时间仓促及能力有限，在研究基于Ajax 的web 应用时没有对安全问题进行研究。因此，本课题研究的下一步工作展望是，考虑Ajax 的安全问题，研究更具健壮性的基于Ajax 的实现框架。针对实现的web 版即时聊天系统，增加聊天信息加密之类的功能。
参考文献
[1] 李智毅．新一代Web 应用开发技术AJAX[C]//孙立峰．第二届和谐人机环境联合学术会议论文集. 北京：清华大学出版社，2007．31-34
[2] 王培，冯曼菲．Web 2.0开发技术详解[M]．北京：人民邮电出版社，2006．389-403，495-520.
[3] Garrett J J. Ajax:A New Approach to Web Applications[EB/OL]. http://www.adaptivepath.com/publications/essays/archives/000385.php，
2005-2-18
[4] [美]Ryan Asleson , Nathaniel T.Schutta．Ajax 基础教程，金灵等译．北京：人民邮电出版社，2006．
[5] 徐驰. Ajax 模式在异步交互Web 环境中的应用[J]. 计算机技术与发展,2006,16(11)：229-233.
[6] 姚国新．基于Ajax 的WEB 应用技术的研究与实现[D]：［硕士学位论文］．陕西：西北大学信息科学与技术学院，2006．
[7] （内容略）
[8] （内容略）
[9] （内容略）
[10] （内容略）
[11] （内容略）
[12] （内容略）
[13] （内容略）
[14] （内容略）
[15] （内容略）
谢辞
在本文即将结束之际，我要由衷地感谢……（其它内容略）
附录1 部分关键源码及解释
在这部分，将结合具体的源代码具体说明系统的执行流程和逻辑。 （内容略）
华侨大学厦门工学院
本科生毕业设计（论文）
题 目：
姓 名：
学 号：
系 别：
专 业：
年 级：
指导教师：
年 月 日
华侨大学厦门工学院 毕业设计（论文）
独创性声明
本毕业设计（论文）是我个人在导师指导下完成的。文中引用他人研究成果的部分已在标注中说明；其他同志对本设计（论文）的启发和贡献均已在谢辞中体现；其它内容及成果为本人独立完成。特此声明。
论文作者签名： 日期：
关于论文使用授权的说明
本人完全了解华侨大学厦门工学院有关保留、使用学位论文的规定，即：学院有权保留送交论文的印刷本、复印件和电子版本，允许论文被查阅和借阅；学院可以公布论文的全部或部分内容，可以采用影印、缩印、数字化或其他复制手段保存论文。保密的论文在解密后应遵守此规定。
论文作者签名： 指导教师签名： 日期：
基于Ajax 的Web 聊天系统设计与实现
摘要
随着Internet 的迅速发展，许多C/S结构的应用程序纷纷转向B/S结构的web 应用程序。web 版的应用程序，让用户可以利用基于浏览器的客户端轻松地使用程序，不用考虑平台之间的差异、程序可移植性好、容易部署并且维护简单。但由于B/S结构采用同步的请求/响应机制，浏览器中的页面在请求后要进行全部刷新，且在页面刷新的过程中，用户只能看着浏览器空白的界面不能做其他的事情。这严重影响了用户体验，使B/S结构的应用丧失了原有基于C/S结构的良好用户体验，一定程度上制约着web 应用程序的发展。
但近来，Google 公司的Google Maps、Gmail 和Google Suggest等web 应用却打破了这个制约，给用户带来了良好的用户体验。Google 在这方面的取得巨大的成功，这催生了Ajax 概念的诞生，并吸引着越来越多的人构建具有丰富客户体验的web 应用。
目前常规的即时聊天工具如QQ 要求要安装客户端(基于C/S模式) ，这种要求在一定程度上会带来某种不便，但其丰富的用户交互功能吸引着众多的用户。本课题的目的是使用Ajax 开发模式设计和实现一个web 版的即时聊天系统，使B/S的web 应用具有像C/S模式一样的用户交互。
本文将通过介绍传统web 应用的不足，引入Ajax 技术，介绍什么是Ajax 以及基于Ajax 的web 应用模型，总结Ajax 在聊天系统中的应用，最后本文将通过设计和实现web 版的即时聊天系统具体展示如何在web 中的应用Ajax 技术。
关键词：Ajax ，web 应用，聊天系统
华侨大学厦门工学院 毕业设计（论文）
Design and Implement of Web Chat System Base on Ajax
Abstract
Along 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
目 录
第1章 绪论 . .............................................................. III
1.1 研究背景 ............................................................ 1
1.2 研究意义 ............................................................ 1
1.3 研究内容 ............................................................ 1
1.4 论文组织 ............................................................ 1
第2章 Web版聊天系统的设计 ................................................. 2
2.1 功能设计 ............................................................ 2
2.2 概要设计 ............................................................ 2
2.3详细设计 . ............................................................ 2
2.3.1用户界面逻辑设计 ............................................... 2
2.3.2 数据库的设计 . .................................................. 3
2.3.3 基于Ajax 的web 应用的交互逻辑 . ................................. 3
结论 . ....................................................................... 4
参考文献 . ................................................................... 5
谢辞 . ....................................................................... 6
附录一 部分关键源码及解释 . .................................................. 7
第1章 绪论
1.1 研究背景
随着Internet 的迅速发展，基于B/S的应用程序越来越受欢迎。在B/S结构程序中，用户可以利用基于浏览器的客户端轻松地使用程序；程序可以运行在不同的平台上，不用考虑平台之间的差异；只需部署服务器，客户端可以直接运行在浏览器上，部署简单且便于维护。B/S的诸多优点使众多软件商将Web 作为首选平台，促使许多C/S结构的程序纷纷转向B/S结构。但由于互联网是一个同步的请求/响应系统，浏览器需要在请求后刷新整个页面。在页面刷新的过程中，用户只能看着浏览器空白的界面不能做其他的事情，这严重影响了用户体验，也制约着B/S结构程序的发展。
同步请求和全部刷新，本质上是B/S请求响应机制所采用的HTTP 协议决定的。这似乎是web 理所当然的缺陷，但Google 公司的Google Maps、Gmail 和Google Suggest等web 应用却打破了同步请求和全部刷新的制约，给用户带来了良好的用户体验[1]。Google 在这方面的取得巨大的成功催生了Ajax 概念的诞生，并吸引着越来越多的人构建具有丰富客户体验的web 应用。
传统的即时聊天系统是基于C/S结构的桌面应用程序，它的即时通讯功能和提供给用户的良好体验吸引着众多的用户。但基于C/S结构的聊天系统，要求用户一定要安装特定的客户端。这个要求在一定的程度上会带来种种不便，不能适应于不同操作系统平台；既要部署服务器，也要安装特定的客户端，部署不方便；系统升级时既要升级服务器也要升级客户端，升级和维护都及其不便[2]。
1.2 研究意义
（内容略）
1.3 研究内容
（内容略）
1.4 论文组织
（内容略）
第2章 Web版聊天系统的设计
2.1 功能设计
（内容略）
2.2 概要设计
基于Ajax 的web 即时聊天系统的概要设计如图2-1所示。
图2-1 系统概要设计图
（其它内容略）
2.3详细设计
2.3.1用户界面逻辑设计
（内容略）
2.3.2 数据库的设计
(1) item表、user_appended表和group_appended表
这三个表主要用来存储用户和群组信息。其中类型为用户的item 表项和user_appended共同表示用户信息，类型为群组的item 表项和group_appended共同表示群组信息。各表的字段设计如表2-1、表2-2、表2-3所示。
表2-1 item表
表2-2 group_appended表
从用户和群组中提取出共同的信息组成item 表，是考虑了如下的原因：
○1 在主窗口中，需要显示好友列表和群组列表，都需要获取好友列表或群组列表的注册名、显示名及图标，而不需要其它的具体信息。这样在显示好友或群组列表时，服务只需查询item 表，并返回相应的内容。
○2 方便统一表达朋友关系和组员-组关系，进一步方便了消息(message)表的设计，具体好处将在设计message 表时说明。
结论
本文通过web 版的即时聊天系统的设计和实现具体论述了什么是Ajax ，为什么要在web 中使用Ajax 及如何在web 中应用Ajax 技术。做的具体工作如下：
(1) 通过实践详细探究什么是Ajax ，为什么要在web 中使用Ajax ，对这项新的技术或者说是新的开发模式做出比较直观的分析和展现；
(2) 通过设计和实现基于Ajax 的web 即时聊天系统，比较直观地展现Ajax 在web 中的应用及如何实现这些应用，为其它的基于Ajax 的web 应用的设计和实现提供参考；
(3) 设计和实现即时数据验证、二级联动下拉框、动态提示和自动更新等模块，尽可能地保留原有的基于C/S的良好用户体验，将原属于桌面应用的即时聊天系统移植到web 中，为今后将桌面应用程序迁移成web 版应用提供些许借鉴。
通过这次的设计和实现基于Ajax 的即时聊天系统，我深深地体会到了Ajax 所带来的是web 开发模式的变革，它使基于B/S结构的web 应用的开发更像C/S结构的应用程序的开发——浏览器端引入了Ajax 引擎，有了一定的处理能力，浏览器中的内容可以看成是一个应用，这地位类似于C/S中的客户端。
由于时间仓促及能力有限，在研究基于Ajax 的web 应用时没有对安全问题进行研究。因此，本课题研究的下一步工作展望是，考虑Ajax 的安全问题，研究更具健壮性的基于Ajax 的实现框架。针对实现的web 版即时聊天系统，增加聊天信息加密之类的功能。
参考文献
[1] 李智毅．新一代Web 应用开发技术AJAX[C]//孙立峰．第二届和谐人机环境联合学术会议论文集. 北京：清华大学出版社，2007．31-34
[2] 王培，冯曼菲．Web 2.0开发技术详解[M]．北京：人民邮电出版社，2006．389-403，495-520.
[3] Garrett J J. Ajax:A New Approach to Web Applications[EB/OL]. http://www.adaptivepath.com/publications/essays/archives/000385.php，
2005-2-18
[4] [美]Ryan Asleson , Nathaniel T.Schutta．Ajax 基础教程，金灵等译．北京：人民邮电出版社，2006．
[5] 徐驰. Ajax 模式在异步交互Web 环境中的应用[J]. 计算机技术与发展,2006,16(11)：229-233.
[6] 姚国新．基于Ajax 的WEB 应用技术的研究与实现[D]：［硕士学位论文］．陕西：西北大学信息科学与技术学院，2006．
[7] （内容略）
[8] （内容略）
[9] （内容略）
[10] （内容略）
[11] （内容略）
[12] （内容略）
[13] （内容略）
[14] （内容略）
[15] （内容略）
谢辞
在本文即将结束之际，我要由衷地感谢……（其它内容略）
附录1 部分关键源码及解释
在这部分，将结合具体的源代码具体说明系统的执行流程和逻辑。 （内容略）