javaweb课设报告

洛阳理工学院

课程设计报告

课程名称Java web程序开发入门

专业计算机应用技术_

班级_

学号_

姓名

完成日期_

目录

第一总体设计 (4)

1.1、设计目的： (4)

1.2设计题目： (4)

1.3.设计要求： (4)

第二设计内容： (5)

2.1 题目一 (5)

2.1.1Tomcat服务器启动 (5)

2.1.2下载安装JDK (6)

2.1.3下载Eclipse安装包 (7)

2.2题目二 (8)

2.2.1分析 (8)

2.2.2用户注册设计思想 (9)

2.2.3用户注册功能实现 (9)

2.3题目三 (15)

2.3.1聊天室设计思想 (15)

2.3.2聊天室模块划分 (15)

2.3.3系统功能结构图 (16)

2.3.4 chatroom的模块设计分析 (16)

2.3.5ChatRoom 的关键技术 (16)

2.3.6 代码设计 (17)

2.3.7 聊天室功能实现 (20)

2.4题目四 (21)

2.4.1开发环境： (21)

2.4.2 系统分析： (21)

2.4.3功能实现： (22)

第三实训心得 (24)

第一总体设计

1.1、设计目的：

１、培养学生运用所学课程《Web程序设计(Java)》的理论知识和技能解决实际问题的能力，使学生在系统开发中得到Java Web编程方法及技能的综合训练。

2、培养学生调查研究、查阅技术文献以及编写技术报告的能力。

1.2设计题目：

1．下载并安装JDK、Tomcat、MySQL和Eclipse，完成Java Web应用程序开发环境的搭建。

2．使用JSP Model2模型，开发一个用户注册模块，要求：使用Servlet、JSP和Java Bean技术；界面友好；具有用户输入校验功能，并且在用户输入错误时给出出错信息。

3．使用JSP和JavaScript技术实现一个网络聊天室，功能要求具备一个使用用户昵称登录的页面，在聊天主窗口左侧有当时在线成员列表（建议采用AJAX技术），通过鼠标可以选择说话的对象（不允许自己对自己说话），在聊天时可以设置说话时表情，输入说话的内容，单击发送按钮完成会话的发送，会话内容实时显示在聊天主窗口内，包括发言人姓名、聊天对象姓名、聊天内容和会话发起的时间，选作的功能是将会话内容保存在数据库中。

1.3.设计要求：

1.对于每个题目，应完成代码编制和调试，保证功能完全实现。

2.编写程序要求利用Eclipse开发工具调试通过。

3设计完成后，需要写成一份实训报告。

第二设计内容：

2.1 题目一

2.1.1Tomcat服务器启动

Tomcat服务器启动后，在浏览器的地址栏中输入

http://locathost:8080或者http://127.0.0.1:8080访问 Tomcat服务器，如果浏览器中的显示界面如图所示，则说明 Tomcat服务器安装成功。如图1图2

图1

图2

2.1.2下载安装JDK

双击图中的JDK图标，开始安装JDK

下一步，选择开发工具在下一步

安装成功

2.1.3下载Eclipse安装包

解压eclipse安装包，打开安装文件，直接下一步安装，点击安装完成

即可。双击图1中的eclipse.exe图标即可安装运行。

图1

图2

选择上图2中的OK后，即安装成功。

2.2题目二

2.2.1分析

开发一个用户注册模块，使用JSP Model2模型。JSP Model2架构模型采用JSP+Servlet+JavaBean的技术，此技术将原本的JSP页面中的流程控制代码提取出来，封装到Servlet中，从而实现真个程序页面显示、流程控制和业务逻辑分离。实际上JSP Model2模型就是MVC设计模型，其中控制器的角色是由Servlet实现的，视图的角色是由JSP页面实现，模型的角色是由JavaBean

实现。图9.3是描述Model2的工作原理。

JSP Model模型是一种MVC模式。由于MVC模式中的功能模式中的功能模块相互独立，并且使用该模式的软件具有极高的可维护性、可扩展性和可复用性。

按照JSP Model2的模型思想编写一个用户注册的程序，该程序中包含两个JSP 页面register. jsp和loginSuccess.jsp、一个Servlet类ControllerServlet.java、两个JavaBean 类RegisterFormBean.java和UserBean.java、一个访问数据库的辅助类DBUtil.java，这些组件的关系如图9-8

总体结构图：

2.2.2用户注册设计思想

2.2.3用户注册功能实现

①先实现用户注册界面register.jsp点击注册后进入ControllerServlet跳转页面，然后跳转到loginSuccess.jsp登录成功页面，

②开始实现注册的功能，定义用户类UserBean,用来封装用户的信息，UserBean.java类中定义三个String类型的属性name、password和email。代

码没如下：

③创建一个RegisterFormBean.java类，类定义4个String类型的属性name、password、password2和email属性以及一个Map类型的成员变量error,其中name, password,password2和email属性用于引用注册表单页面传入的用户名、密码、确认密码和email信息，error成员变量用于封装表

单验证时的错误信息，主要部分代码如下：

public boolean validate(){

boolean flag=true;

if (name==null||name.trim().equals("")){

errors.put("name","请输入姓名.");

flag=false;

}

if (passwod==null||passwod.trim().equals("")){

errors.put("password","请输入密码.");

flag=false;

}

else if(passwod.length()>12||passwod.length()<6){

errors.put("password", "请输入6-12个字符.");

flag=false;

}

if (passwod!=null&&!passwod.equals(password2)) {

errors.put("password2", "两次输入的密码不匹配.");

flag=false;

}

if (email==null||email.trim().equals("")) {

errors.put("email","请输入邮箱." );

flag=false;

}

else if

(!email.matches("[a-zA-Z0-9_-]+@[a-zA-Z0-9_-]+(\\.[a-zA-Z0-9_-]+)+")){ errors.put("email", "邮箱格式错误.");

flag=false;

}

return flag;

}

④创建一个模拟数据库类，DBUtil.java。主要实现两个功能，第一个功能是定义一个HashMap集合uesrs,用于模拟数据库，并向数据库中存入了两条信息，第二个功能是定义了getUser()方法和insertUser()方法来操作数据库，其中getUser()方法用于获取数据库中的用户信息，insertUser()方法用户数据库中插入的用户信息，需要注意的是，在insertUser()方法进行信息插入操作之前会判断数据库中是否存在同名的信息，如果存在则不执行插入操作，方法返回false，反之表示插入操作成功，方法返回true.主要功能代码如下：

p

⑤创建的RegisterFormBean.java对象用于封装表单提交的信息。当对RegisterFormBean对象进行校验时，如果校验失败，程序就会跳转的regsiter.jsp注册页面，让用户重新填写注册信息。如果校验通过，那么注册的信息就会封装到UserBean对象中，并通过DBUtil的intertUser()对象插入到数据库。intertUser()方法有一个boolean类型的返回值，如果返回为false，表示插入操作失败，程序跳转到register.jsp注册页面；分之，程序跳转到loginsuccess.jsp,表示用户登录成功。主要代码如下：

public class ControllerServlet extends HttpServlet{

protected void doGet(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {

this.doPost(req, resp);

}

@Override

protected void doPost(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {

resp.setHeader("Content-type", "text/html;charset=GBK");

resp.setCharacterEncoding("GBK");

String name=req.getParameter("name");

String passwod=req.getParameter("password");

String passwod2=req.getParameter("password2");

String email=req.getParameter("email");

RegisterFormBean formBean=new RegisterFormBean();

formBean.setName(name);

formBean.setPasswod(passwod);

formBean.setPassword2(passwod2);

formBean.setEmail(email);

if(!formBean.validate()){

req.setAttribute("formBean", formBean);

req.getRequestDispatcher("/register.jsp").forward(req, resp);

return;

}

UserBean userBean=new UserBean();

userBean.setName(name);

userBean.setPassword(passwod);

userBean.setEmail(email);

boolean b=DBUtil.getInstance().insertUser(userBean);

if(!b){

req.setAttribute("DBMes", "你注册的用户已存在");

req.setAttribute("formBean", formBean);

req.getRequestDispatcher("/register.jsp").forward(req, resp);

return;

}

resp.getWriter().print("恭喜你注册成功，3秒钟自动跳转");

req.getSession().setAttribute("userBean", userBean);

resp.setHeader("refresh", "3;url=loginSuccess.jsp");

}

}

⑥基本功能已经实现，下面开始验证是否成功，在eclipse中重启tomcat 服务器，在浏览器中输

http://localhost:8080/Userload/register.jsp。如果正确的话会出现如下页面，

下面开始实现注册的功能，分别在姓名，密码，确认密码和邮箱中输入你的信息，确认无误后，点击错误，会进入跳转页面如图1，最后跳转到登录成功页图2。

图1

、

图2

2.3题目三

2.3.1聊天室设计思想

在 ChatRoom 下新建包 dao,在包里新建 class DBOper 和 sqlccww；在luanma 包里新建 class StringUtils；在 model 包里新建 class sqlcc 和UserInfo;在 servlet 包里新建 Messages 和 UserListener。在 WebContent 里新建 index.jsp、login.jsp、 login_ok.jsp,online.jsp,logout.jsp 、send.jsp 、 safe.jsp 、 content.jsp,main.jsp, 文件，其中 dao 包里新建的 class DBOper 和 sqlccww 是有关数据库的定义； luanma 包里新建的class StringUtils 用来处理中文乱码问题；model 包里新建的 class sqlcc 和UserInfo 是定义数据库变量的模板和用户信息；servlet 包里新建的 Messages 和 UserListener 是用来处理发送的信息和实现用户在线登陆的程序；

index.jsp 为登陆索引提示信息；login.jsp 为登陆页面、login_ok.jsp 提示登陆成功信息；online.jsp 在线信息；logout.jsp 退出信息；send.jsp 发送消息、safe.jsp 安全登录提示信息、 main.jsp 设置聊天内容的主要处理程序。最后要设置 web.xml 文件。以上设置完成后在 SQLyog Ultimate 里新建数据库 zyh，在数据库 zyh 里新建表 sqlcc，在表里完成列名，主键等相关设置。

2.3.2聊天室模块划分

该聊天室系统主要分为如下几个功能模块，如下所示：

●用户无需注册即可登录聊天室。

●系统可以监视每个用户的进入和离开，并且显示相关信息。

●用户可以对所有人或者指定的某一个人发送聊天内容。

●用户可以实时查看聊天室内的聊天内容。

●聊天文字可以选择不同的颜色。

●管理员可以将不遵守聊天室规章的用户踢出聊天室。

2.3.3系统功能结构图

2.3.4 chatroom的模块设计分析

登陆进入页面用户在线列表表情选择

Login.jsp,index.jsp,login_ok.jsp 处理程序 Online.jsp 等处理程序

红着脸无表情的，微笑着，笑呵呵地，温柔的，幸福的嘟着嘴，热泪盈眶的，依依不舍的，得意的等

字体颜色选择

style="color:

#FF0000"

value="FF0000"> 红色热情 ；蓝色开朗，红色热情、桃色浪漫，烟雨蒙蒙等

聊天信息保存到数据库

退出聊天室

Sqlcc.java 和sqlccww.java 等处理程序Leave.jsp 和safe,jsp 等处理程序

2.3.5ChatRoom 的关键技术

Ajax 重构技术

在 Ajax 应用中，JavaScript 是主体，所以一个 Ajax 应用系统的性能问题也就是 JavaScript 代码的性能问题。JavaScript 并不是一个高性能的语言，它不能像 C 语言那样进行快速的计算；JavaScript 中的对象也不是轻量级的，特别是 DOM 元素，它们通常都会占用大量的内存；不同的 Web 浏览器都包含缺陷，很容易造成内存泄露；成熟的 Ajax 应用的 JavaScript 代码量将远

远超过传统 Web 应用的代码量。上述种种情况都会导致 JavaScript 出现性能问题。随着 Ajax 应用程序的不断扩展，将会有越来越多的 JavaScript 代码应用到 Ajax 中，这可能导致许多意想不到的问题。因此有必要对 Ajax 代码进行重构。下面将介绍实现 Ajax 重构的基本步骤。创建一个单独的 JS 文件，名称为 AjaxRequest.js，并且在该文件中编写重构 Ajax 所需的代码。那么，在需要应用 Ajax 的页面中应用以下的语句包含 JS 文件“AjaxRequest.js”。 在应用 Ajax 的页面中编写错误处理的方法，使用 function onerror(),function getCheckCodel()是实例化 Ajax 对象的方法，而 function deal_getCheckCode()则是回调函数。

2.3.6 代码设计

A．设计用户登录界面，使用户输入用户名能够进入聊天室

<%@page contentType="text/html" pageEncoding="UTF-8" %>

	用户名：

B．显示用户登录信息，判断用户是否登录，以及在聊天室中显示登录时间，设置用户登录页面过期时间。

<%@page contentType="text/html" pageEncoding="UTF-8" %> <%@ page import="java.util.*"%>

<%@ page import="https://www.360docs.net/doc/8813498277.html,erInfo"%>

<%@ page import="https://www.360docs.net/doc/8813498277.html,erListener"%>

<%

String username=request.getParameter("username"); //获得登录用户名

UserInfo user=UserInfo.getInstance(); //获得UserInfo类的对象

session.setMaxInactiveInterval(600); //设置Session的过期时间为10分钟

Vector vector=user.getList();

boolean flag=true; //标记是否登录的变量

//判断用户是否登录

if(vector!=null&&vector.size()>0){

for(int i=0;i

if(user.equals(vector.elementAt(i))){

out.println("

language='javascript'>alert('该用户已经登录

');window.location.href='index.jsp';");

flag=false;

break;

}

}

}

//保存用户信息

if(flag){

UserListener ul=new UserListener();

ul.setUser(username);

session.setAttribute("user",ul);

session.setAttribute("username",username);

user.addUser(ul.getUser());

//保存当前登录的用户名

session.setAttribute("loginTime",new

Date().toLocaleString()); //保存登录时间

response.sendRedirect("Messages?action=loginRoom");

}

%>

C.通过聊天室登录界面进入聊天室，设置聊天心情，聊天对象，聊天内容输入的实现，以及发送功能的实现可以设置如下相关功能：

2.3.7 聊天室功能实现

在编程环境中运行index.jsp，输入用户名guo,进入聊天室，在浏览器地址输入http://localhost:8080/WebContent /index.jsp进入登录界面，输入用户名上线，如图1所示

图1

在聊天室中选择聊天对象，聊天心情，填写聊天内容发送，在另一个页面中也可以接收到用户信息，如图2：

图2

2.4题目四

使用Servlet、JSP和JavaScript技术实现一个照片上传模块，功能要求能够上传照片（建议使用Servlet技术和Common File Upload库），可以选择照片的裁剪功能（建议使用JavaScript技术），当照片经过上传和裁剪后可以在线浏览。