文章目录
这学期刚刚学了Javaweb和mysql,就用这两个技术做了一个登录小页面,可能有点bug,逻辑也不是特别清楚,有什么更好的方案欢迎评论!
一、创建数据库
我的数据比较简单,数据库里面就只存了用户名和密码,所以数据库创建也比较简单。
CREATE TABLE
IF
NOT EXISTS work_user (
id INT PRIMARY KEY auto_increment,
username CHAR ( 20 ) UNIQUE,
PASSWORD CHAR ( 20 ));
建好的效果:
二、创建User类
package com.work.pojo;
import java.util.Objects;
public class User {
private String username;
private String password;
public User() {
}
public User( String username, String password) {
this.username = username;
this.password = password;
}
public String getUsername() {
return username;
}
public void setUsername(String username) {
this.username = username;
}
public String getPassword() {
return password;
}
public void setPassword(String password) {
this.password = password;
}
@Override
public String toString() {
return "User{" +
", username='" + username + '\'' +
", password='" + password + '\'' +
'}';
}
@Override
public boolean equals(Object o) {
if (this == o) return true;
if (!(o instanceof User)) return false;
User user = (User) o;
return Objects.equals(getUsername(), user.getUsername()) && Objects.equals(getPassword(), user.getPassword());
}
@Override
public int hashCode() {
return Objects.hash(getUsername(), getPassword());
}
}
三、编写查询和增加用户的类
这里我有用到jdbc和MyBatis,两个版本都会介绍。但是如果你能够配置好MyBatis的sql映射文件,那推荐用MyBatis,这个简单很多
下面写了两个简单的方法:
一个是contrastUser(User user),这个方法主要是用来在数据库里面对比用户输入的用户名和密码。如果用户名密码都存在,那就能够匹配到,就可以登录。如果用户名密码不存在,或者用户名存在,密码错误,那就没有匹配上就无法登录。这里的用户名密码是通过servlet程序从提交的表单获取的,并且在servlet程序里面封装成一个User实例,传给contrastUser。
另一个是appendUser(User user),这个方法用于用户注册,如果在数据库里面没有该用户的信息,或者有用户信息但是密码不同,都无法注册成功。注册用户的用户名和密码都是通过在servlet程序里面封装过来的。
1、jdbc版本代码
package com.work.jdbc;
import com.work.pojo.User;
import java.sql.*;
public class Login002 {
public boolean contrastUser(User user) throws Exception {
String username = user.getUsername();
String password = user.getPassword();
Class.forName("com.mysql.jdbc.Driver");
String url = "jdbc:mysql://127.0.0.1:3306/dbcsdn";
String name = "root";
String psd = "1234";
Connection connection = DriverManager.getConnection(url, name, psd);
String sql = "select * from work_user where username = ? and password = ?";
PreparedStatement preparedStatement = connection.prepareStatement(sql);
preparedStatement.setString(1,username);
preparedStatement.setString(2,password);
ResultSet resultSet = preparedStatement.executeQuery();
if (resultSet.next()){
resultSet.close();
preparedStatement.close();
connection.close();
return true;
}else {
resultSet.close();
preparedStatement.close();
connection.close();
return false;
}
}
public boolean appendUser(User user) throws Exception {
Class.forName("com.mysql.jdbc.Driver");
String username = user.getUsername();
String password = user.getPassword();
String url = "jdbc:mysql://127.0.0.1:3306/dbcsdn";
String name = "root";
String psd = "1234";
Connection connection = DriverManager.getConnection(url, name, psd);
String sql = "insert into work_user (username,password) values ('"+username+"','"+password+"')";
Statement statement = connection.createStatement();
int i = statement.executeUpdate(sql);
System.out.println(i);
if (i!=0){
statement.close();
connection.close();
return true;
}else {
statement.close();
connection.close();
return false;
}
}
}
2、MyBatis版本代码
1.编写mapper接口和方法
package com.work.mapper;
import com.work.pojo.User;
import java.util.List;
public interface UserMapper1 {
User select(User user);
int add(User user);
}
2.编写sql映射文件
<mapper namespace="com.work.mapper.UserMapper1">
<select id="selectAll" resultType="com.work.pojo.User">
select from work_user;
</select>
<select id="select" resultType="com.work.pojo.User">
select username,password from work_user where username = #{username} and password = #{password};
</select>
<insert id="add">
insert into work_user(username,password)
values (#{username},#{password});
</insert>
</mapper>
3.编写MyBatis代码
package com.work.jdbc;
import com.work.mapper.UserMapper1;
import com.work.pojo.User;
import org.apache.ibatis.io.Resources;
import org.apache.ibatis.session.SqlSession;
import org.apache.ibatis.session.SqlSessionFactory;
import org.apache.ibatis.session.SqlSessionFactoryBuilder;
import java.io.IOException;
import java.io.InputStream;
public class MyBatisLogin002 {
public boolean contrastUser(User user) throws IOException {
String resource = "mybatis-config.xml";
InputStream inputStream = Resources.getResourceAsStream(resource);
SqlSessionFactory sqlSessionFactory = new SqlSessionFactoryBuilder().build(inputStream);
SqlSession sqlSession = sqlSessionFactory.openSession();
UserMapper1 userMapper = sqlSession.getMapper(UserMapper1.class);
User select = userMapper.select(user);
System.out.println(select);
if(select!=null){
sqlSession.close();
return true;
}
sqlSession.close();
return false;
}
public boolean appendUser(User user) throws IOException {
String resource = "mybatis-config.xml";
InputStream inputStream = Resources.getResourceAsStream(resource);
SqlSessionFactory sqlSessionFactory = new SqlSessionFactoryBuilder().build(inputStream);
SqlSession sqlSession = sqlSessionFactory.openSession(true);
UserMapper1 userMapper1 = sqlSession.getMapper(UserMapper1.class);
User select = userMapper1.select(user);
if(select!=null){
sqlSession.close();
return false;
}
int add = userMapper1.add(user);
if(add!=0){
sqlSession.close();
return true;
}
sqlSession.close();
return false;
}
}
四、用于注册的servlet代码
package com.work.servlet;
import com.work.jdbc.MyBatisLogin002;
import com.work.pojo.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("/workServlet002")
public class WorkServlet002 extends HttpServlet {
@Override
protected void doGet(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
String username = req.getParameter("username");
String password = req.getParameter("password");
User user = new User(username,password);
MyBatisLogin002 login = new MyBatisLogin002();
try {
if(login.appendUser(user)){
resp.sendRedirect("http://localhost:8080/javaweb/work/work002.jsp");
}else{
resp.sendRedirect("http://localhost:8080/javaweb/work/registerfailed002.jsp");
}
} catch (Exception e) {
resp.sendRedirect("http://localhost:8080/javaweb/work/registerfailed002.jsp");
}
}
}
五、用于登录的filter代码
package com.work.filter;
import com.work.jdbc.MyBatisLogin002;
import com.work.pojo.User;
import javax.servlet.*;
import javax.servlet.annotation.WebFilter;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import java.io.IOException;
@WebFilter("/work/loginsuccessful002.jsp")
public class WorkFilter002 implements Filter {
@Override
public void init(FilterConfig filterConfig) throws ServletException {
Filter.super.init(filterConfig);
}
@Override
public void doFilter(ServletRequest servletRequest, ServletResponse servletResponse, FilterChain filterChain) throws IOException, ServletException {
HttpServletRequest req= (HttpServletRequest) servletRequest;
HttpServletResponse resp = (HttpServletResponse) servletResponse;
resp.setContentType("text/html;charset=utf-8");
String userName = req.getParameter("username");
String passWord = req.getParameter("password");
User user = new User(userName,passWord);
MyBatisLogin002 login = new MyBatisLogin002();
try {
if(login.contrastUser(user)){
filterChain.doFilter(req,resp);
}else{
resp.sendRedirect("http://localhost:8080/javaweb/work/loginfailed002.jsp");
}
} catch (Exception e) {
resp.sendRedirect("http://localhost:8080/javaweb/work/loginfailed002.jsp");
e.printStackTrace();
}
}
@Override
public void destroy() {
Filter.super.destroy();
}
}
六、登录、注册的jsp代码
1、登录初始页面
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title></title>
<link rel="stylesheet" type="text/css" href="layui/layui-v2.7.0-rc5/layui/css/layui.css"/>
<script type="text/javascript" src="layui/layui-v2.7.0-rc5/layui/layui.js">
function onclickFun() {
var psd = document.getElementById("password");
var password = psd.value;
var reg = /^[0-9a-zA-Z_]{8,12}$/;
if(!reg.test(password)){
alert("密码格式错误,请重新输入!!!");
}
}
</script>
<style type="text/css">
p{
font-max-size: larger;
color: red;
}
.div001{
width: 1920px;
height: 896px;
}
.div002{
width: 300px;
height: 60px;
float: right;
}
.div003{
width: 450px;
height: 762px;
background-image: url(img/dl.jpg);
background-color:rgb(0,152,50);
opacity:0.7;
filter:alpha(opacity=50);
position: absolute;
top: 0;
bottom: 0;
left: 0;
right: 0;
margin: auto;
}
tr{
margin-top: 20px;
padding: 20px;
}
td{
margin-left: 4px;
}
</style>
</head>
<body style="background-image: url(img/background003.jpg);">
<div class="div002" align="left">
</div>
<br />
<br />
<br />
<br />
<div class="div003" align="right">
<form action="loginsuccessful002.jsp" method="get">
<table border="0" cellspacing="" cellpadding="" align="center">
<tr height="300px" align="center">
<td>
<h1 align="center"> 登录系统</h1>
</td>
</tr>
<tr height="80px">
<td>
<h3>姓名:</h3>
</td>
<td>
<input type="text" name="username"/>
</td>
<br />
</tr><br />
<tr height="80px">
<td>
<h3>密码:</h3>
</td>
<td>
<input type="password" name="password"/>
</td>
</tr>
<tr height="80px">
<td>
<h3>邮箱:</h3>
</td>
<td>
<input type="email" name="email"/>
</td>
</tr>
<tr>
<td> <input type="submit" id="submit01" class="layui-btn layui-btn-radius" value="登录" onclick="return onclickFun();"/></td>
<td>
<input type="reset" class="layui-btn layui-btn-radius" value="重置"/></td>
</tr>
<tr>
<td>没有账号?<a href="register002.jsp">点击注册</a></td>
</tr>
</table>
</form>
</div>
</body>
</html>
效果图:
2、登录失败代码
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title></title>
<link rel="stylesheet" type="text/css" href="layui/layui-v2.7.0-rc5/layui/css/layui.css"/>
<script type="text/javascript" src="layui/layui-v2.7.0-rc5/layui/layui.js"></script>
<style type="text/css">
p{
font-max-size: larger;
color: red;
}
.div001{
width: 1920px;
height: 896px;
}
.div002{
width: 300px;
height: 60px;
float: right;
}
.div003{
width: 450px;
height: 762px;
background-image: url(img/dl.jpg);
background-color:rgb(0,152,50);
opacity:0.7;
filter:alpha(opacity=50);
position: absolute;
top: 0;
bottom: 0;
left: 0;
right: 0;
margin: auto;
}
tr{
margin-top: 20px;
padding: 20px;
}
td{
margin-left: 4px;
}
</style>
</head>
<body style="background-image: url(img/background003.jpg);">
<div class="div002" align="left">
</div>
<br />
<br />
<br />
<br />
<div class="div003" align="right">
<form action="loginsuccessful002.jsp" method="get">
<table border="0" cellspacing="" cellpadding="" align="center">
<tr height="300px" align="center">
<td>
<h1 align="center">登录系统</h1>
</td>
</tr>
<tr>
<td>
<p>
登录失败,请重新输入!!!
</p>
</td>
</tr>
<tr height="80px">
<td>
<h3>姓名:</h3>
</td>
<td>
<input type="text" name="username"/>
</td>
<br />
</tr><br />
<tr height="80px">
<td>
<h3>密码:</h3>
</td>
<td>
<input type="password" name="password" />
</td>
</tr>
<tr height="80px">
<td>
<h3>邮箱:</h3>
</td>
<td>
<input type="email" name="email"/>
</td>
</tr>
<tr>
<td> <input type="submit" class="layui-btn layui-btn-radius" value="登录"/></td>
<td>
<input type="reset" class="layui-btn layui-btn-radius" value="重置"/></td>
</tr>
<tr>
<td>没有账号?<a href="registerfailed002.jsp">点击注册</a></td>
</tr>
</table>
</form>
</div>
</body>
</html>
登陆失败效果图:
3、登录成功
登录成功这里我比较懒,没有写任何内容,你可以根据自己需要写一个jsp
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
<title>Title</title>
</head>
<body>
<h1>
登录成功
</h1>
</body>
</html>
4、注册界面
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title></title>
<link rel="stylesheet" type="text/css" href="layui/layui-v2.7.0-rc5/layui/css/layui.css"/>
<script type="text/javascript" src="layui/layui-v2.7.0-rc5/layui/layui.js"></script>
<style type="text/css">
p{
font-max-size: larger;
color: red;
}
.div001{
width: 1920px;
height: 896px;
}
.div002{
width: 300px;
height: 60px;
float: right;
}
.div003{
width: 450px;
height: 762px;
background-image: url(img/dl.jpg);
background-color:rgb(0,152,50);
opacity:0.7;
filter:alpha(opacity=50);
position: absolute;
top: 0;
bottom: 0;
left: 0;
right: 0;
margin: auto;
}
tr{
margin-top: 20px;
padding: 20px;
}
td{
margin-left: 4px;
}
</style>
</head>
<body style="background-image: url(img/background003.jpg);">
<div class="div002" align="left">
</div>
<br />
<br />
<br />
<br />
<div class="div003" align="right">
<form action="http://localhost:8080/javaweb/workServlet002" method="get">
<table border="0" cellspacing="" cellpadding="" align="center">
<tr height="300px" align="center">
<td>
<h1 align="center">用户注册</h1>
</td>
</tr>
<tr height="80px">
<td>
<h3>姓名:</h3>
</td>
<td>
<input type="text" name="username"/>
</td>
<br />
</tr><br />
<tr height="80px">
<td>
<h3>密码:</h3>
</td>
<td>
<input type="password" name="password" />
</td>
</tr>
<tr height="80px">
<td>
<h3>邮箱:</h3>
</td>
<td>
<input type="email" name="email"/>
</td>
</tr>
<tr>
<td> <input type="submit" class="layui-btn layui-btn-radius" value="注册"/></td>
<td>
<input type="reset" class="layui-btn layui-btn-radius" value="重置"/></td>
</tr>
</table>
</form>
</div>
</body>
</html>
5、注册失败
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title></title>
<link rel="stylesheet" type="text/css" href="layui/layui-v2.7.0-rc5/layui/css/layui.css"/>
<script type="text/javascript" src="layui/layui-v2.7.0-rc5/layui/layui.js"></script>
<style type="text/css">
p{
font-max-size: larger;
color: red;
}
.div001{
width: 1920px;
height: 896px;
}
.div002{
width: 300px;
height: 60px;
float: right;
}
.div003{
width: 450px;
height: 762px;
background-image: url(img/dl.jpg);
background-color:rgb(0,152,50);
opacity:0.7;
filter:alpha(opacity=50);
position: absolute;
top: 0;
bottom: 0;
left: 0;
right: 0;
margin: auto;
}
tr{
margin-top: 20px;
padding: 20px;
}
td{
margin-left: 4px;
}
</style>
</head>
<body style="background-image: url(img/background003.jpg);">
<div class="div002" align="left">
</div>
<br />
<br />
<br />
<br />
<div class="div003" align="right">
<form action="http://localhost:8080/javaweb/workServlet002" method="get">
<table border="0" cellspacing="" cellpadding="" align="center">
<tr height="300px" align="center">
<td>
<h1 align="center"> 用户注册</h1>
</td>
</tr>
<tr>
<td>
<p>
注册失败,请重新输入!!!
</p>
</td>
</tr>
<tr height="80px">
<td>
<h3>姓名:</h3>
</td>
<td>
<input type="text" name="username"/>
</td>
<br />
</tr><br />
<tr height="80px">
<td>
<h3>密码:</h3>
</td>
<td>
<input type="password" name="password" />
</td>
</tr>
<tr height="80px">
<td>
<h3>邮箱:</h3>
</td>
<td>
<input type="email" name="email"/>
</td>
</tr>
<tr>
<td> <input type="submit" class="layui-btn layui-btn-radius" value="注册"/></td>
<td>
<input type="reset" class="layui-btn layui-btn-radius" value="重置"/></td>
</tr>
</table>
</form>
</div>
</body>
</html>