001
视频学
Java Web
编程
A 聊天室模块
A.1 聊天室模块概述
A.1.1
功能描述
聊天室的基本功能就是聊天，其他功能都是对基本功能的一个强化。本章中的聊天室主
要包括以下功能。
用户登录，包括验证用户是否在线。
实时显示在线人员列表及在线人数。
用户发言，包括选择表情和字体颜色功能。
安全退出聊天室。
A.1.2
系统流程
聊天室的系统流程如图
A.1
所示。
图 A.1 系统流程图
A.1.3
主界面预览
为了使读者对本模块有一个基本的了解，下面将给出聊天室的主界面预览效果图。聊天
1
002
视频学
Java Web
编程
室的主界面运行结果如图A.2所示。
图 A.2 主界面运行结果图
A.2 关键技术
在模块中，应用的关键技术为
Ajax
重构和
Application
对象的相关方法，下面进行详细介
绍。
A.2.1 Ajax
重构
随着
Ajax
应用程序的不断扩展，将会有越来越多的
JavaScript
代码应用到
Ajax
中，这可
能导致许多意想不到的问题。因此有必要对
Ajax
代码进行重构。下面将介绍实现
Ajax
重构的
基本步骤。
创建一个单独的
JS
文件，名称为
AjaxRequest.js
，并且在该文件中编写重构
Ajax
所需的代
码，具体代码如下：
var net=new Object();
//编写构造函数
net.AjaxRequest=function(url,onload,onerror,method,params){
this.req=null;
this.onload=onload;
this.onerror=(onerror) ? onerror : this.defaultError;
this.loadDate(url,method,params);
}
//编写用于初始化 XMLHttpRequest 对象并指定处理函数，最后发送 HTTP 请求的方法
net.AjaxRequest.prototype.loadDate=function(url,method,params){
if (!method){
method="GET";
}
2
003
视频学
Java Web
编程
if (window.XMLHttpRequest){
this.req=new XMLHttpRequest();
} else if (window.ActiveXObject){
this.req=new ActiveXObject("Microsoft.XMLHTTP");
}
if (this.req){
try{
var loader=this;
this.req.onreadystatechange=function(){
net.AjaxRequest.onReadyState.call(loader);
}
this.req.open(method,url,true);
if(method=="POST"){
this.req.setRequestHeader("Content-Type","application/x-www-form-urlencoded");
}
this.req.send(params);
}catch (err){
this.onerror.call(this);
}
}
}
//重构回调函数
net.AjaxRequest.onReadyState=function(){
var req=this.req;
var ready=req.readyState;
if (ready==4){
if (req.status==200 ){
this.onload.call(this);
}else{
this.onerror.call(this);
}
}
}
//重构默认的错误处理函籹
net.AjaxRequest.prototype.defaultError=function(){
alert("错误数据\n\n 回调状态:"+this.req.readyState+"\n 状态: "+this.req.status);
}
在需要应用Ajax的页面中应用以下的语句包含JS文件“AjaxRequest.js
”
。
<script language="javascript" src="JS/AjaxRequest.js"></script>
在应用Ajax的页面中编写错误处理的方法、实例化Ajax对象的方法和回调函数，具体代
码如下：
<script language="javascript">
/******************错误处理的方法*******************************/
function onerror(){
alert("您的操作有误！");
}
/******************实例化 Ajax 对象的方法*******************************/
function getCheckCode1(showCheckCode,checkCode){
var loader1=new net.AjaxRequest("getPictureCheckCode.jsp?nocache="+
new Date().getTime(),deal_getCheckCode,onerror,"GET");
showCheckCode.style.display='';
checkCode.focus();
}
/************************回调函数**************************************/
function deal_getCheckCode(){
document.getElementById("showCheckCode").innerHTML=this.req.responseText;
}
</script>
3
004
视频学
Java Web
编程
A.2.2 Application
对象
Application对象是一个环境上下文（Context）对象，用于保存应用程序中的所有公有数
据，服务器启动并且自动创建Application对象以后，只要没有关闭服务器，Application对象
将一直存在，所有用户可以共享Application对象。
Application对象为JSP提供的内置对象，可以直接使用，但是在Servlet中，需要通过以
下代码来获取该对象的实例，才可以使用该对象。
ServletContext application = getServletContext();
A p p l i c a t i o n对 象 提 供 了 很 多 方 法 ， 本 实 例 中 ， 只 使 用 了 se t A t t r i b u t e( )方 法 和
getAttribute()方法。
首先来介绍setAttribute()方法，该方法用于将一个对象绑定到一个属性上，该属性在整
个Servlet上下文中都适用。setAttribute()方法的语法格式如下：
application.setAttribute(String name,Object object);
name：用于指定一个属性名，该属性在整个Servlet上下文中都适用。
object：用于指定属性值。
例如，在本实例中，设置保存聊天信息的Application对象的属性的具体代码如下：
application.setAttribute("message", sourceMessage);
下面再来介绍getAttribute()方法，该方法用于返回Application对象的指定属性的值。如
果不存在该属性，则返回null。getAttribute()方法的基本语法如下：
application. getAttribute(String name);
name：用于指定一个属性名。
例如，在本实例中，设置获取聊天信息的Application对象的属性的具体代码如下：
String sourceMessage = application.getAttribute("message").toString();
A.3 聊天室的实现过程
A.3.1
实现用户登录
当用户访问聊天室时，首先进入的是登录聊天室页面。在该页面中，用户输入自己喜欢
的用户名，如图A.3所示，单击“进入”按钮，系统将判断输入的用户是否被占用，如果被占
用将给出提示，否则进入到聊天室主界面。
4
