一.案例需求
学生可以在网页上互相在线交流学习心得。由两个界面组成，首先显示登录界面。输入的账号或者密码错误，显示错误，单击返回登录页面链接，返回登录界面。登录成功，显示聊天界面。输入聊天信息，点击发送，可以将信息显示在所有已经登录用户的页面上。界面下方显示的是聊天信息和当前在线的用户。页面上还有一个退出登录的链接。单击它则退出登录。
二.系统分析
2.1页面结构
将页面显示和动作处理分开
| 页面 | 作用 |
|---|---|
| loginForm.jsp 和loginAction.jsp | loginForm.jsp显示登录界面，提交到loginAction.jsp；loginAction验证登录是否成功；成功则跳转到chatForm.jsp |
| chatForm.jsp和chatAction.jsp | chatForm.jsp显示聊天界面，提交到chatAction.jsp；chatForm.jsp获取消息内容；处理信息后跳转到chatForm.jsp |
| msgs.jsp | 显示所有用户的聊天信息，显示在线名单，该页面每个一段时间自动刷新，以iframe形式嵌入chatForm.jsp |
| logoutAction.jsp | 负责处理退出登录的操作 |
2.2状态保存
问题： 如何能够保证消息和在线人员名单能够显示在所有用户的界面上呢？
答： 可以将消息和在线人员的名单保存在application对象内。每次有用户上线，就想application内的在线名单内添加该用户的上线消息。用户下线，就从application内移除该用户的上线消息。用户提交信息，就向application内的消息集合添加该用户提交的消息。用户登录成功后，应该将用户信息保存在session内。msgs.jsp需要定时刷新，获取application对象中的内容，更新页面。
三.开发过程
3.1准备数据
用MySQL数据库创建的school数据库，里面创建一个名为t_customer的表。如下：
随便插入一些数据，如下：
3.2编写DAO和VO
在DAO中验证用户的合法身份，用户信息用VO封装。代码如下：
CustomerDao.java
package dao;
import java.sql.Connection;
import java.sql.DriverManager;
import java.sql.PreparedStatement;
import java.sql.ResultSet;
import vo.Customer;
public class CustomerDao {
private Connection conn = null;
public void initConnection() throws Exception{
Class.forName("com.mysql.cj.jdbc.Driver");//加载驱动
conn = DriverManager.getConnection("jdbc:mysql://localhost:3306/school?useSSL=false&serverTimezone=GMT", "root", "123456");
}
//根据账号查询Customer对象
public Customer getCustomerByAccount(String account) throws Exception{
Customer cus = null;
initConnection();
String sql = "select * from t_customer where account = ?";
PreparedStatement ps = conn.prepareStatement(sql);
ps.setString(1, account);
ResultSet rs = ps.executeQuery();
if(rs.next()){
cus = new Customer();
cus.setAccount(rs.getString("account"));
cus.setPassword(rs.getString("Password"));
cus.setCname(rs.getString("cname"));
}
ps.close();
conn.close();
return cus;
}
}
Customer.java
package vo;
public class Customer {
private String account;
private String password;
private String cname;
public String getAccount() {
return account;
}
public void setAccount(String account) {
this.account = account;
}
public String getPassword() {
return password;
}
public void setPassword(String password) {
this.password = password;
}
public String getCname() {
return cname;
}
public void setCname(String cname) {
this.cname = cname;
}
}
3.3编写loginForm.jsp和loginAction.jsp
loginForm.jsp
<%@ page language="java" import="java.util.*" pageEncoding="gb2312"%>
<html>
<head>
<title>loginForm</title>
</head>
<body>
<%
//初始化application
ArrayList customers = (ArrayList)application.getAttribute("customers");
if(customers == null){
customers = new ArrayList();
application.setAttribute("customers", customers);
}
ArrayList msgs = (ArrayList)application.getAttribute("msgs");
if(msgs == null){
msgs = new ArrayList();
application.setAttribute("msgs", msgs);
}
%>
欢迎登录在线交流系统
<form action = "loginAction.jsp" name = "form1" method = "post">
输入账号：<input type = "text" name = "account"><br>
输入密码：<input type = "password" name = "password" >
<input type = "submit" value = "登录">
</form>
</body>
</html>
loginAction.jsp
<%@ page language="java" import="java.util.*" pageEncoding="gb2312"%>
<%@ page import = "dao.CustomerDao" %>
<%@ page import = "vo.Customer" %>
<html>
<head>
<title>loginAction</title>
</head>
<body>
<%
request.setCharacterEncoding("gb2312");
String account = request.getParameter("account");
String password = request.getParameter("password");
CustomerDao cdao = new CustomerDao();
Customer customer = cdao.getCustomerByAccount(account);
if(customer == null || customer.getPassword().equals(password)){
%>
登录失败，<a href = "loginForm.jsp">返回登录页面</a>
<%
}
else{
session.setAttribute("customer", customer);
ArrayList customers = (ArrayList)application.getAttribute("customers");
ArrayList msgs = (ArrayList)application.getAttribute("msgs");
customers.add(customer);
msgs.add(customer.getCname() + "上线啦!");
response.sendRedirect("chatForm.jsp");
}
%>
</body>
</html>
3.4编写chatForm.jsp和chatAction.jsp
chatForm.jsp
<%@ page language="java" import="java.util.*" pageEncoding="gb2312"%>
<%@ page import = "vo.Customer" %>
<html>
<head>
<title>chatForm</title>
</head>
<body>
<%
Customer customer = (Customer)session.getAttribute("customer");
%>
欢迎<%= customer.getCname() %>聊天<br>
<form action = "chatAction.jsp" name = "form1" method = "post">
输入聊天信息：<input type = "text" name = "msg" size = "40">
<input type = "submit" value = "发送">
</form>
<a href = "loginAction.jsp">退出登录</a>
<hr>
<iframe src = "msgs.jsp" width = "100%" height = "80%" frameborder = "0"></iframe>
</body>
</html>
解释：
<iframe src = "msgs.jsp" width = "100%" height = "80%" frameborder = "0"></iframe>
表示使用iframe嵌入了msgs.jsp
chatAction.jsp
<%@ page language="java" import="java.util.*" pageEncoding="gb2312"%>
<%@ page import = "vo.Customer" %>
<html>
<head>
<title>chatAction</title>
</head>
<body>
<%
Customer customer = (Customer)session.getAttribute("customer");
%>
<%
request.setCharacterEncoding("gb2312");
String msg = request.getParameter("msg");
ArrayList msgs = (ArrayList)application.getAttribute("msgs");
if(msgs != null && !msg.equals("")){
msgs.add(customer.getCname() + "说：" + msg);
reponse.sendRedirect("chatForm.jsp");
%>
</body>
</html>
3.5编写msgs.jsp
msgs.jsp是定时显示聊天信息和在线名单。代码如下：
<%@ page language="java" import="java.util.*" pageEncoding="gb2312"%>
<%@ page import = "vo.Customer" %>
<html>
<head>
<title>msgs</title>
</head>
<body>
<%
response.setHeader("Refresh", "10");//刷新
%>
<table width = "80%" border = "0" align = "center">
<tr align = "center" bgcolor = "yellow">
<td width = "75%">消息</td>
<td width = "75%">当前在线</td>
</tr>
<tr bgcolor = "pink">
<td>
<%
ArrayList msgs = (ArrayList)application.getAttribute("msgs");
for(int i = msgs.size()-1; i >= 0; i--){
out.println(msgs.get(i) + "<br>");
}
%>
</td>
</tr>
</table>
</body>
</html>
3.6编写loginoutAction.jsp
<html>
<head>
<title>logoutAction</title>
</head>
<body>
<%
Customer customer = (Customer)session.getAttribute("customer");
ArrayList customers = (ArrayList)application.getAttribute("customers");
customers.remove(customer);
ArrayList msgs = (ArrayList)application.getAttribute("msgs");
msgs.add(customer.getCname() + "下线啦!");
session.invalidate();
response.sendRedirect("loginForm.jsp");
%>
</body>
</html>
登录地址，进入loginForm即可。
摘自《Java Web 开发与应用》，主编郭克华，副主编宋虹，清华大学出版社
欢迎评论啊~~
532
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
