4月29日更新:
因爲要實現管理員和用戶的界面,所以今天先來實現登陸的界面:
-
其中login.jsp就是我們要用到的登陸界面了。
設計思路:
1.可以在登錄界面添加一個圖片,優化界面;
2.登陸失敗時候跳轉回登陸界面,並給用戶反饋;
3.登陸成功自動判斷是管理員或者不是管理員;
4.管理員與非管理員跳轉不同的界面;
5.待添加功能:驗證碼、註冊 -
具體實現如下:
因爲要實現登錄功能,所以需要連接一下數據庫(新建張User表)這裏我們用到Navicate數據庫可視化工具來連接MySQL數據庫。
(1)表包含三條屬性:用戶名、密碼、是否爲管理員;
(2)戶名可以是英文大小寫,或者數字,不可以爲中文,在後面註冊時候會判斷;
(3)注意密碼的長度,不超過16位長度;
(4)用戶名爲主鍵,不可重複,數據都不能爲空;
(5)註冊時候默認不是管理員(0),需要申請管理員;
--創建User表
create table User
(
user_name varchar(255) not null,
pass_word varchar(20) not null,
--管理員默認爲0;
is_admin smallint default 0 not null,
primary key(user_name)
)
- 表創建好,接着來連接數據庫(DBConnect.java):
代碼很簡單,就不做介紹(註釋裏面有)代碼如下:
package db_connect;
import java.sql.Connection;
import java.sql.DriverManager;
import java.sql.ResultSet;
import java.sql.SQLException;
import java.sql.Statement;
public class DBConnect {
//連接數據庫
private static String DRIVER = "com.mysql.jdbc.Driver";//驅動
private static String URL = "jdbc:mysql://localhost:3306/數據庫名稱?useUnicode=true&characterEncoding=utf8";//防止中文亂碼
private static String USERNAME = "用戶名";
private static String PASSWORD = "密碼";
private static Connection connection = null;
Statement statement = null;
ResultSet result= null;
static {
try {
//導入驅動,加載具體的驅動類
Class.forName(DRIVER);
System.out.println("連接數據庫中...");
}catch(ClassNotFoundException e) {
e.printStackTrace();
}
}
public static Connection getConnection() {
try {
connection = (Connection) DriverManager.getConnection(URL , USERNAME , PASSWORD);
System.out.println("數據庫連接成功!");
}catch(SQLException e) {
System.out.println("數據庫連接失敗!");
e.printStackTrace();
}
return (Connection) connection;
}
}
添加main方法,進行測試:
public static void main(String [] args) {
getConnection();
}
- 數據庫已經連接完成,接下來我們就需要將數據取出到結果集,然後與用戶輸入的信息進行對比就可,所以,來設計用戶登錄和註冊界面
效果如下:
- 如果登陸失敗效果如下:
- 如果某項不輸入的話,提示用戶:
- 代碼如下(login.jsp):
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<%@ page import="util.CookieUtil" %>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
</head>
<body background="pic\login.jpg" style="
background-repeat:no-repeat ;
background-size:100% 100%;
background-attachment: fixed;">
<br><br><br><br><br>
<div class = "div0">
<%
String username = CookieUtil.getCookie("username",request);
String user = (String)request.getAttribute("msg");
if(user != null){
out.println(user);
}
%>
<br><br>
<center><span style="color:red">歡迎使用數據庫管理系統</span></center><br>
<center><span style="color:red">請先登錄</span></center><br>
</div>
<div class="div1">
<form action="LoginServlet" method="post">
<input type="text" required="required" placeholder="用戶名" name="username"></input> <br>
<input type="password" required="required" placeholder="密碼" name="password"></input> <br>
<button class="but" type="submit">登錄</button>
</form>
</div>
<style>
.div0{
color:red;
text-align:center;
margin:0 auto;
font-size: 20px;
text-shadow:1px 1px 1px;
}
.div1{
text-align:center;
margin:0 auto;
width: 300px;
height: 300px;
}
.but{
width: 300px;
min-height: 20px;
display: block;
background-color: #4a77d4;
border: 1px solid #3762bc;
color: #fff;
padding: 9px 14px;
font-size: 15px;
line-height: normal;
border-radius: 5px;
margin: 0;
}
input{
width: 278px;
height: 18px;
margin-bottom: 10px;
outline: none;
padding: 10px;
font-size: 16px;
color: blue;
text-shadow:1px 1px 1px;
border-top: 1px solid #312E3D;
border-left: 1px solid #312E3D;
border-right: 1px solid #312E3D;
border-bottom: 1px solid #56536A;
border-radius: 4px;
}
</style>
</body>
</html>
- 那麼接下來我們肯定要將用戶輸入和數據庫中下信息進行對比,我們將數據庫中的所有信息取出來(我們先添加幾條數據):
--添加幾條測試數據到User表
insert into User
values('zhang','123456',1);
insert into User
values('wang','123456',0);
insert into User
values('zheng','123456',0);
- 接下來我們就要將數據取出來(放到結果集中)然後遍歷所有數據,判斷是否存在用戶輸入的數據,代碼如下(LoginServlet.java):
package Servlet;
import java.io.IOException;
import java.sql.ResultSet;
import java.sql.SQLException;
import java.sql.Statement;
import javax.servlet.RequestDispatcher;
import javax.servlet.ServletException;
import javax.servlet.http.Cookie;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import javax.servlet.http.HttpSession;
import com.mysql.jdbc.Connection;
import db_connect.DBConnect;
public class LoginServlet extends HttpServlet {
private static final long serialVersionUID = 1L;
protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
response.setCharacterEncoding("UTF-8");
request.setCharacterEncoding("UTF-8");
int success = 0;//判斷是否登錄成功
DBConnect dbConnect = new DBConnect();
Connection connection = (Connection) DBConnect.getConnection();
Statement statement = null;
ResultSet resultSet = null;
String username = (String)request.getParameter("username");
String password = (String)request.getParameter("password");
String path = "";
String msg = "";
System.out.println("username" + username + "/n" + "password" + password);
try {
statement = (Statement) connection.createStatement();
}catch(SQLException e) {
e.printStackTrace();
}
//查詢語句
String sql = "select * from User";
try {
//將所有信息存入結果集
resultSet = statement.executeQuery(sql);
}catch(SQLException e) {
e.printStackTrace();
}
try {
while(resultSet.next()) {
String user_name = resultSet.getString("user_name");
String pass_word = resultSet.getString("pass_word");
int is_admin = resultSet.getInt("is_admin");
//判斷用戶信息正誤
if(user_name.equals(username) && pass_word.equals(password)) {
Cookie cookie = new Cookie("username" , username);
//設置生存週期:
cookie.setMaxAge(60*60*24*7);
HttpSession session = request.getSession();
session.setAttribute("user", username);
response.addCookie(cookie);
//判斷是否爲管理員
if(is_admin == 1) path = "admin.jsp";
else path = "user.jsp";
//找到了就應該退出循環:
success = 1;
break;
}else {
//登陸失敗,返回登陸頁面,併發出提示
success = 0;
}
}
} catch (SQLException e) {
e.printStackTrace();
}
if(success == 0) {
path = "login.jsp";
msg = "Username or Password Error!";
}
request.setAttribute("username", username);
request.setAttribute("msg", msg);
RequestDispatcher dispatcher = request.getRequestDispatcher(path);
dispatcher.forward(request, response);
}
protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
doGet(request, response);
}
}
- 測試效果如下:
- 管理員登陸:
- 正常用戶登錄: