第19章Ajax聊天室.pptVIP

第19章 Ajax 聊天室 在讲解ASP.NET Ajax Timer控件时，已经向读者讲解了使用组建开发的Ajax聊天室。在本章中将向读者展示一个使用JavaScript脚本开发无刷新聊天室。 19.1 需求分析和概要设计 本节将讲述聊天室的需求和一些实现中需要注意的细节，在聊天室的实现中要结合在进度条开发中学习到的定时局部刷新的方式进行开发。 19.1.1 需求分析 聊天室是在OA或CRM等商业Web系统中广泛提供的功能，对于聊天室而言，需要提供以下功能： 用户登录：只有当用户登录之后，用户才可以使用自定义昵称参与聊天。 管理员登录：管理员登录，可以进行清屏、删除用户等系统操作。 用户列表的局部刷新：对于聊天室而言，用户会经常更换，需要动态加载用户列表，删除超时用户等。 聊天消息列表的局部刷新：聊天室内聊天记录是滚动变化的，需要随时更新聊天列表，使用户迅速获取聊天信息。 聊天列表信息及时删除，对于聊天列表这样的临时性存储器，需要随时删除过期信息，并添加新的信息。 19.1.2 概要设计 聊天室流程较为简单，本示例中未考虑用户注册等方式的聊天室，仅仅关注于实现聊天室主要功能的实现，流程如图所示： 19.2 实现代码 在本节中，展示了开发Ajax聊天室中的各种开发细节，以及如何使用定时刷新功能控制页面布局和div/div内滚动条格式的控制。 19.2.1 聊天室后台引擎类 聊天引擎类是提供组装系统消息，组装聊天信息列表、组装用户列表、动态刷新用户列表、动态刷新聊天信息列表的服务器端功能类，该类的实例被放置在Global文件中，被声明为Global类的公有静态变量。Global文件中声明聊天引擎类实例的代码如下所示： public static DataOperator.IChatEngine Engine=new ChatEngine(); ChatEngine类中的其他方法相对较为简单，就不一一进行讲解了，希望读者能够仔细阅读ChatEngine类的代码，学习如何创建高访问效率的服务器端支持。 在下一节中，将要讲解聊天程序中重要的组成部分-登录。 19.2.2 聊天登录页面 本示例中，并未考虑用户注册功能，仅仅提供了用户登录功能，聊天登录页面的代码如下所示： 在后台代码中，首先在Page_Load事件中为TextBox添加在JavaScript事件处理函数，判断用户按下的键盘按键，如果是回车键即提交表单、页面回送。 在登录按钮的单击事件处理函数中，判断了用户是否已经存在，并对用户名的数据合法性进行了验证。 19.2.3 聊天页面前台代码 聊天页面的多数元素都是JavaScript脚本生成的， updateAll()函数是整个聊天页面无刷新实现最重要的方法。特别需要注意的是updateAll()函数中首先暂停执行定时调用，然后执行getUserList()函数异步请求服务器获取用户列表，getUserList()函数在接收服务器响应后会调用getBufferText()方法异步请求服务器获取消息列表。 只有当getUserList()函数执行完毕，并获取了所有的用户列表及消息列表后，updateAll()函数才又一次调用setTimers()函数，实现定时页面局部刷新。通过在updateAll()函数中首先暂停定时局部刷新，然后请求服务器数据，再开启定时拒不刷新的方式，有效防止了定时局部刷新线程和请求服务器数据线程的并发冲突，防止了线程阻塞或死锁，可以极大的提高服务器与客户端的数据交互效率。 19.2.4 处理Ajax响应的服务器页面 实际上在本示例中，由于ChatEngine类封装了聊天室所有操作，所以Ajax响应服务器页面非常简单，仅仅根据请求参数决定返回的响应类型，代码如下所示： 处理Ajax请求的服务器页面仅仅封装了ChatEngine类中方法，并根据请求参数做出相应的处理，并将结果放入响应中返回至客户端。 19.3 小结 在本章中结合18章中介绍的定时局部刷新方式展现了Ajax聊天室的基本开发细节，并介绍了锁定机制在定时局部刷新方式中的重要性和优点，这些方式已经在大多数Ajax开发中得到了应用。读者需要仔细阅读本章示例，并模仿才能掌握这些方式。 在下一章中讲解WebQQ，WebQQ的实现将会融合在本书中讲解的多种Ajax开发方式进行实现，是一个综合性的Ajax项目，希望读者能够通过本书能够掌握这些Ajax开发方式，并迅速、熟练的使用与项目开发中。 * *