如何用初级的JavaWeb知识写一个较简单的网站(二)

好了，废话不多说，我们接着上次的项目继续开发

我们现在先暂时开发用户登录注册界面，上次我们已经完成了项目的初期准备，完成了建表、User实体类和UserDao的书写，下面我们开始套页

这里的前台页面是由一名前端程序员写好的，上次就是因为我copy页面的时候没有处理好，所以导致项目出了问题。这里我对页面做了一点点处理，我先来给大家看一下前台写好的页面吧

这里写图片描述

这是用户可见页面，其实并没有几个，里面的具体内容我们过会套页的时候再慢慢看，然后里面有一个back文件夹，里面装着所有的后台管理页面

这里写图片描述

/back文件夹中的文件很乱,多是一些配置文件、插件之类的，再里面的production文件夹中才包含着所有的后台管理页面（这也是我上次弄崩的原因之一，想想就心痛，这次我机智地处理了一下，应该不会崩了吧）

然后，我把根文件夹中的所有文件copy到项目中的WebRoot文件夹下面，然后一个个处理

给大家看下copy之后的项目，有几个文件报错了，我也不是很清楚，特别是前台js文件更不清楚了，凑合凑合吧，只要不影响程序运行就忍了吧，强迫症也忍一忍

这里写图片描述

试一下看能不能跑，来试一试

这里写图片描述

好，既然项目已经开始跑起来了，那我们开始糟蹋糟蹋它

我们现在在写的是用户模块嘛，那我们就先来写一下用户的注册页面

我这里用户的注册是set.html，改成我们自己的命名习惯，在MyEclipes里面，点击一下这个文件，右键，Refactor，Rename，比如我的命名习惯，register.jsp

然后将我们当时新建项目时自动生成的那个index.jsp最上面的几行代码copy到我们的register.jsp里面，就可以安心在里面做改动啦
按照这个方法，把首页也改一下，毕竟首页是我们项目的基础

其实我们要改的地方也不是很多，首先把首页的注册按钮的超链接改一下

这里写图片描述
改成

然后，将register.jsp中表单提交的位置改一下

这里写图片描述

在这个后面加上一个action=“xxxx”，就是你要提交给哪个servlet类的路径

下面我们开始写提交的后台servlet

啊，刚才刷新了一下页面发现忘了一个问题，我们MyEclipes自动生成的页面编码都是ISO8859-1，这个编码格式是不支持中文的，为了让它支持中文，我们把所有页面的编码格式都改成utf-8

选中ISO8859-1，然后按ctrl+f，在replace with的文本框里填上utf-8，然后点下面的replace all，然后close，保存就好了

这里写图片描述

当然还有可能你把前台页面copy进来之后，发现文件里的中文都给乱码了，这个问题可以自己去百度一下，不是很麻烦

好了，处理完这些琐碎的问题，我们来开始写我们处理用户注册的servlet类

在src文件夹中new一个Class，还是注意包，同时，由于我们写的是一个servlet，所以要继承HttpServlet

这里写图片描述

进来之后，重写doGet()和doPost()方法
alt+shift+s，Override/Implment Methods里面就有这两个方法，点击OK重写
这里写图片描述

我们把参数名改一改，这个名和我们在jsp中的名字不太一样，改一下会更习惯
根据我的理解，如果表单是通过get方法提交上来的，那么将会交由doGet()方法处理，如果是post方式提交，会交由doPost()方法处理

我们在doPost()方法里写一下我们后台处理注册的代码

response.setCharacterEncoding("utf-8");response.setContentType("text/html;charset=utf-8");request.setCharacterEncoding("utf-8");String username = request.getParameter("username");String password = request.getParameter("password");String password2 = request.getParameter("password2");int sex = Integer.parseInt(request.getParameter("sex"));String phoneNum = request.getParameter("phoneNum");String email = request.getParameter("email");if(password != null && password.equals(password2)) {User user = new User();user.setUsername(username);user.setPassword(password);user.setSex(sex);user.setPhoneNum(phoneNum);user.setEmail(email);UserDao.insert(user);request.setAttribute("regist", "OK");request.getRequestDispatcher("login.jsp").forward(request, response);} else if(password != null && !password.equals(password2)){PrintWriter out = response.getWriter();out.print("您两次输入密码不一样<br>");out.print("<a href = 'register.jsp'>重新填写</a>");} else {PrintWriter out = response.getWriter();out.print("输入错误<br>");out.print("<a href = 'register.jsp'>重新填写</a>");}

这是写在doPost()方法里面的代码。然后在doGet方法里只要一行代码就可以了

doPost(request, response);

好，现在为止，用户注册功能就写完了，下面开始写用户登录

用户登录的页面是login.html，同样把它更改为login.jsp

我们判断登录，肯定是判断数据库里是否有一条数据，username和password均equals填在表单里的内容，所以在UserDao里还需要增添一个方法queryByUsernameAndPassword

/*** 根据用户名和密码查找用户，用于验证登录* @param username* @param password* @return*/public static User queryByUsernameAndPassword(String username, String password) {User user = null;String sql = "SELECT * FROM `t_user` WHERE `username` = " + username + " AND `password` = " + password;Connection conn = DB.getConnection();Statement stmt = DB.createStmt(conn);ResultSet rs = DB.executeQuery(stmt, sql);try {if(rs.next()) {int sex = rs.getInt("sex");String phoneNum = rs.getString("phone_num");String email = rs.getString ("email");user.setUsername(username);user.setPassword(password);user.setSex(sex);user.setPhoneNum(phoneNum);user.setEmail(email);}} catch (SQLException e) {e.printStackTrace();}return user;}

然后，我们正式开始写登录功能

将login表单中form的action属性改一下，然后开始写登录功能的servlet类

/*** */
package com.software.servlet;import java.io.IOException;import javax.servlet.ServletException;
import javax.servlet.annotation.WebServlet;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import javax.servlet.http.HttpSession;import com.software.Dao.UserDao;
import com.software.entities.User;/*** 处理登录的servlet* @author lw* @time 2017年6月7日下午8:33:38*/@WebServlet(name="login",value="/login")
public class Login extends HttpServlet {@Overrideprotected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {doPost(request, response);}@Overrideprotected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {request.setCharacterEncoding("utf-8");response.setCharacterEncoding("utf-8");response.setContentType("text/html;charset=utf-8");String username = request.getParameter("username");String password = request.getParameter("password");User user = new User();user = UserDao.queryByUsernameAndPassword(username, password);if(user == null) {request.setAttribute("login", "fail");request.getRequestDispatcher("login.jsp").forward(request, response);} else {HttpSession session = request.getSession();session.setAttribute("username", username);request.getRequestDispatcher("index.jsp").forward(request, response);}}}

然后在index.jsp中添加相应的代码即可

我们在这里使用的是JSTL标签，真正开发的时候，为了实现前后台的分离，前台的jsp页面也是机会没有java代码的

    <c:choose><c:when test="${sessionScope.username == null}"><a href="login.jsp">登陆</a><a href="register.jsp">注册</a><a>管理员登陆</a></c:when><c:otherwise>欢迎您， ${sessionScope.username}  <br><a href="">写文章</a></c:otherwise></c:choose>

在一个真正的网站中，一个非常重要的身份就是管理员，所以我们需要设置一个管理员的身份，我们在Login.java中添加代码：

if(username.equals("admin") && password.equals("admin")) {HttpSession session = request.getSession();session.setAttribute("username", "admin");response.sendRedirect("userList");return;}

这里我们写的比较简单，管理员的用户名和密码我们是在后台写死的，这显然是不合理的，大家可以尝试着自行改进

我们这里是重定向到名为userList的servlet类中，我们来看一下userList中的代码

package com.software.servlet;import java.io.IOException;
import java.util.ArrayList;
import java.util.List;import javax.servlet.ServletException;
import javax.servlet.annotation.WebServlet;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import javax.servlet.http.HttpSession;import com.software.Dao.UserDao;
import com.software.entities.User;/*** 用户列表Servlet类 * @author lw* @time 2017年6月8日下午12:23:33*/@WebServlet(name="userlist",value="/userList")
public class UserList extends HttpServlet {@Overrideprotected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {List<User> userList = new ArrayList<>();userList = UserDao.listAll();HttpSession session = request.getSession();session.setAttribute("userList", userList);//request.getRequestDispatcher("/back/production/user_manage.jsp").forward(request, response);response.sendRedirect("back/production/user_manage.jsp");}@Overrideprotected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {doGet(request, response);}}

在这个servlet中，我们先通过UserDao的listAll()方法查询数据库中的所有user数据，然后重定向到我们的后台用户管理页面

其实在这里我曾经尝试过用请求转发，然后将userList放到request内置对象中，可是这样转发过去之后页面的所有样式就全都不见了。百度了一下，应该是把引用的样式路径改为绝对路径就好了，但是由于前台知识太浅，所以改为使用重定向，大家有兴趣可以尝试一下

随后，在用户管理页面中，使用forEach循环来遍历整个userList

    <c:forEach items="${sessionScope.userList}" var="user"><tr><td>${user.id}</td><td>${user.username}</td><td>${user.password}</td><c:if test="${user.sex == 1}"><td>男</td></c:if><c:if test="${user.sex == 2}"><td>女</td></c:if><td>${user.phoneNum}</td><td>${user.email}</td><td class="aparent"><a href="../../userDel?id=${user.id}">删除</a></td></tr></c:forEach>

作为管理员，除了能够浏览所有用户，还能够删除用户，我们来写删除功能

上面可以看到删除按钮的超链接，链接到另一个servlet类中，同时传递了user的id，这里贴出来userDel.java的代码，大家可以参考一下

package com.software.servlet;import java.io.IOException;
import java.sql.Connection;
import java.sql.SQLException;
import java.sql.Statement;import javax.servlet.ServletException;
import javax.servlet.annotation.WebServlet;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;import com.software.util.DB;/*** 用户删除操作servelt* @author lw* @time 2017年6月9日下午12:01:52*/@WebServlet(name="userDelete",value="/userDel")
public class UserDel extends HttpServlet {@Overrideprotected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {doPost(request, response);}@Overrideprotected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {String strId = request.getParameter("id");int id = Integer.parseInt(strId);Connection conn = DB.getConnection();Statement stmt = DB.createStmt(conn);String sql = "DELETE FROM `t_user` WHERE `id` = " + id;try {stmt.executeUpdate(sql);} catch (SQLException e) {e.printStackTrace();}response.sendRedirect("userList");}}