1. 搭建服务器tomcat
2. 导包
3. 创建Servlet，定义一个类，实现 Servlet 接口#### 3.1 servlet文件配置
4. 项目总览
5. 完成 web 部分的功能
5.1 首页
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<h1>首页</h1>
<a href="login.html">登录</a>
<br>
<a href="register.html">注册</a>
</body>
</html>
5.2 注册界面
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
<script type="text/javascript">
function check(){
var tel = document.getElementsByName("tel")[0].value;
var regExp = /^1[2-9][0-9]{
9}$/;
var b = regExp.test(tel);
if(b){
return true;
}else{
var sp = document.getElementById("err");
sp.style.visibility = "visible";
return false;
}
}
</script>
</head>
<body>
<h1>登录页面</h1>
<form action="/LoginServlet" method="post" onsubmit="return check()">
<input type="text" name="tel" > <span id="err" style="color:red;visibility: hidden;">手机号格式有误</span>
<br>
<input type="password" name="pwd">
<br>
<input type="submit" value="登录">
</form>
</body>
</html>
5.3 注册功能
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<script type="text/javascript">
onload = function(){
checkTel = false;
checkPwd = false;
checkRepwd = false;
}
function checkTel1(){
var tel = document.getElementsByName("tel")[0].value;
var regExp = /^1[2-9][0-9]{
9}$/;
var b = regExp.test(tel);
var err1 = document.getElementById("err1");
if(b){
err1.style.visibility = "hidden";
checkTel = true;
}else{
err1.style.visibility = "visible";
checkTel = false;
}
}
function checkPwd1(){
var pwd = document.getElementsByName("pwd")[0].value;
var err2 = document.getElementById("err2");
if(pwd.length == 0){
err2.style.visibility = "visible";
checkPwd = false;
}else{
err2.style.visibility = "hidden";
checkPwd = true;
}
var repwd = document.getElementsByName("repwd")[0].value;
if(repwd != ""){
checkRepwd1();
}
}
function checkRepwd1(){
var pwd = document.getElementsByName("pwd")[0].value;
var repwd = document.getElementsByName("repwd")[0].value;
var err3 = document.getElementById("err3");
if(pwd != repwd){
err3.style.visibility = "visible";
checkRepwd = false;
}else{
err3.style.visibility = "hidden";
checkRepwd = true;
}
}
function check(){
checkTel1();
checkPwd1();
checkRepwd1();
if(checkTel && checkPwd && checkRepwd){
return true;
}else{
return false;
}
}
</script>
</head>
<body>
<h1>注册页面</h1>
<form action="/RegisterServlet" method="post" onsubmit="return check()">
<input type="text" name="tel" onblur="checkTel1()"> <span id="err1" style="color:red;visibility: hidden;">手机号格式有误</span>
<br>
<input type="password" name="pwd" onblur="checkPwd1()"> <span id="err2" style="color:red;visibility: hidden;">密码不能为空</span>
<br>
<input type="password" name="repwd" onblur="checkRepwd1()"> <span id="err3" style="color:red;visibility: hidden;">两次密码不相同</span>
<br>
<input type="submit" value="注册">
</form>
</body>
6. 连接池配置文件c3p0
<?xml version="1.0" encoding="UTF-8"?>
<c3p0-config>
<named-config name="myc3p0">
<!-- 驱动包 -->
<property name="driverClass">com.mysql.jdbc.Driver</property>
<!-- 数据库的地址 -->
<property name="jdbcUrl">jdbc:mysql:///day0904</property>
<!-- 数据库的用户名 -->
<property name="user">root</property>
<!-- 数据库的密码 -->
<property name="password">1234</property>
<!-- 连接池中默认的连接对象的数量 -->
<property name="initialPoolSize">3</property>
<!-- 连接对象的最大数量 -->
<property name="maxPoolSize">5</property>
<!-- 获取连接对象的超时时间 -->
<property name="checkoutTimeout">3000</property>
</named-config>
<default-config>
<!-- 驱动包 -->
<property name="driverClass">com.mysql.jdbc.Driver</property>
<!-- 数据库的地址 -->
<property name="jdbcUrl">jdbc:mysql:///day0904</property>
<!-- 数据库的用户名 -->
<property name="user">root</property>
<!-- 数据库的密码 -->
<property name="password">1234</property>
<!-- 连接池中默认的连接对象的数量 -->
<property name="initialPoolSize">5</property>
<!-- 连接对象的最大数量 -->
<property name="maxPoolSize">8</property>
<!-- 获取连接对象的超时时间 -->
<property name="checkoutTimeout">3000</property>
</default-config>
</c3p0-config>
7. 创建User类，将用户信息传输的数据进行整体封装
package com.fy.domain;
public class User {
private int id;
private String tel;
private String password;
public int getId() {
return id;
}
public void setId(int id) {
this.id = id;
}
public String getTel() {
return tel;
}
public void setTel(String tel) {
this.tel = tel;
}
public String getPassword() {
return password;
}
public void setPassword(String password) {
this.password = password;
}
}
8. 创建UserDao类，与数据库建立连接，进行与数据库中的数据传输
package com.fy.dao;
import com.fy.domain.User;
import com.fy.utils.JdbcUtils;
import org.apache.commons.dbutils.QueryRunner;
import org.apache.commons.dbutils.handlers.BeanHandler;
public class UserDao {
//执行登录功能
public User login(User u) throws Exception{
//与数据库建立连接，创建连接对象
QueryRunner qr = new QueryRunner(JdbcUtils.getDataSource());
//编写SQL语句
String sql = "select * from user where tel = ? and password = ?";
//通过User类字节码文件，获取User类中的成员变量，返回给servlet，进行数据的传输
return qr.query(sql, new BeanHandler<User>(User.class) ,u.getTel(),u.getPassword());
}
//执行注册功能
public int register(User u) throws Exception{
QueryRunner qr = new QueryRunner(JdbcUtils.getDataSource());
String sql = "insert into user values (null,?,?)";
return qr.update(sql,u.getTel(),u.getPassword());
}
}
9. 创建LoginServlet类和RegisterServlet类，实现数据的传输功能（可显示在控制台）
9.1 LoginServlet类
package com.fy.servlet;
import com.fy.dao.UserDao;
import com.fy.domain.User;
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 java.io.IOException;
@WebServlet("/LoginServlet")
public class LoginServlet extends HttpServlet {
protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
String tel = request.getParameter("tel");
String pwd = request.getParameter("pwd");
User u = new User();
u.setTel(tel);
u.setPassword(pwd);
UserDao dao = new UserDao();
try {
User user = dao.login(u);
if(user != null){
System.out.println("登录成功");
}
else{
System.out.println("登录失败");
}
} catch (Exception e) {
e.printStackTrace();
}
}
protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
doGet(request, response);
}
}
9.2 RegisterServlet类
package com.fy.servlet;
import com.fy.dao.UserDao;
import com.fy.domain.User;
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 java.io.IOException;
@WebServlet("/RegisterServlet")
public class RegisterServlet extends HttpServlet {
protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
String tel = request.getParameter("tel");
String pwd = request.getParameter("pwd");
User u = new User();
u.setTel(tel);
u.setPassword(pwd);
UserDao dao = new UserDao();
try {
int row = dao.register(u);
if(row == 1){
System.out.println("注册成功");
}
else{
System.out.println("注册失败");
}
} catch (Exception e) {
e.printStackTrace();
}
}
protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
doGet(request, response);
}
}
10. 创建JdbcUtils类，通过c3p0配置文件创建连接池对象
package com.fy.utils;
import com.mchange.v2.c3p0.ComboPooledDataSource;
import javax.sql.DataSource;
import java.util.Collections;
public class JdbcUtils {
//1. 通过c3p0配置文件创建连接池对象
private static ComboPooledDataSource ds = new ComboPooledDataSource("myc3p0");
//2. 返回连接池中的一个对象
public static DataSource getDataSource(){
return ds;
}
}
11. 运行结果，数据库数据以及界面展示
