涉及到相關內容如下:
🍇一個資料庫
🍇JSP網頁連接資料庫
🍇注冊和登錄的JSP頁面
目錄
涉及到相關內容如下:
🍇一個資料庫
🍇JSP網頁連接資料庫
🍇注冊和登錄的JSP頁面
🥗一個資料庫 (我的博客有安裝教程哦 MySql保姆級安裝教程 🍬)
🥗JSP網頁連接資料庫
🍓配置mysql檔案
🍓創建jsp檔案,連接資料庫,并讀取出資料顯示在jsp網頁中
???
🥗注冊和登錄的JSP頁面
🍓新建login.jsp檔案
🍓新建check.jsp
🍓創建register.jsp檔案
🍓新建Cregister.jsp檔案 :
🍓創建DBBean.java檔案
🥗一個資料庫 (我的博客有安裝教程哦 MySql保姆級安裝教程 🍬)
??
??
🍓軟體安裝
(可視化資料庫界面軟體安裝)拿走不謝
鏈接:https://pan.baidu.com/s/160OyyMg1RqRTEkrX74b_jw
提取碼:qwer
🥗JSP網頁連接資料庫
🍓配置mysql檔案
??
首先要將mysql-connector-java-5.0.8-bin.jar 拷到apache-tomcat-10.0.12-windows-x64\apache-tomcat-10.0.12\lib檔案目錄下
🍓創建jsp檔案,連接資料庫,并讀取出資料顯示在jsp網頁中
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<%@ page import="java.sql.*"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
</head>
<body>
<%
try {
Class.forName("com.mysql.jdbc.Driver"); 驅動程式名
//com.mysql.jdbc.cj.Driver也是OK的
String url = ""; //資料庫名 ?后面的是為了指定字符的編碼、解碼格式,
String username = "root"; //資料庫用戶名
String password = "123456"; //資料庫用戶密碼
Connection conn = DriverManager.getConnection(url, username, password); //連接狀態
if(conn != null){
out.println("資料庫連接成功!");
out.print("<br />");
Statement stmt = null;
ResultSet rs = null;
String sql = "SELECT *FROM 用戶名;"; //查詢陳述句
stmt = conn.createStatement();
rs = stmt.executeQuery(sql);
out.print("查詢結果:");
out.print("<br />");
out.println("名字"+" "+"年齡 "+" "+"身份"+"性別"+"用戶賬號"+"用戶密碼"+"練習電話"+"用戶注冊時間");
out.print("<br />");
while (true) {
try {
if (!rs.next()) break;
out.println(rs.getString("名字")+"   "+rs.getString("年齡")+"   "+rs.getString("身份")+rs.getString("性別")+"   "+rs.getString("用戶賬號")+"   "+rs.getString("用戶密碼")+"   "
+rs.getString("聯系電話")+"   "+rs.getString("用戶注冊時間")+"   "); //將查詢結果輸出
out.print("<br/>");
} catch (SQLException throwables) {
throwables.printStackTrace();
}
// out.println(rs.getString("名字")+"   "+rs.getString("年齡")+"   "+rs.getString("身份")+rs.getString("性別")+"   "+rs.getString("用戶賬號")+"   "+rs.getString("用戶密碼")+"   "
// +rs.getString("聯系電話")+"   "+rs.getString("用戶注冊時間")+"   "); //將查詢結果輸出
// out.print("<br/>");
}
}
else{
out.print("連接失敗!");
}
}
catch (ClassNotFoundException e) {
e.printStackTrace();
}
// catch (SQLException e)
// {
// e.printStackTrace();
// }
%>
</body>
</html>
連接成功,頁面顯示如下
??
🥗注冊和登錄的JSP頁面
🍓新建login.jsp檔案
<!DOCTYPE>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
<meta charset="utf-8"/>
<title> LOGIN</title>
<link rel="stylesheet" type="text/css" href="../Project/NewLogin.css" />
<link rel="stylesheet" type="text/css" href="../Project/font-awesome.css" />
</head>
<body>
<form id="indexform" name="indexForm" action="check.jsp" method="post">
<div id="login_box">
<h2 style="color: #a0ebad;"> 登錄</h2>
<div id="form">
<div >
<i >賬號</i>
<input type="text" placeholder="賬號" name="username">
</div>
<div >
<i>密碼</i>
<input type="password" placeholder="密碼" name="password">
</div>
</div>
<button type="submit" value="登錄">登錄</button>
<div id="sign-in">
<a href="register.jsp" style="color:white;">注冊</a>
</div>
</div>
</form>
</body>
</html>
🍓新建check.jsp
<%@ page import="java.sql.*" language="java" contentType="text/html; charset=utf-8" pageEncoding="utf-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Insert title here</title>
</head>
<body>
<jsp:useBean id="db" class="MySql.DBUtil" scope="page"/>
<%
request.setCharacterEncoding("UTF-8");
String username=(String)request.getParameter("username");//獲取login頁面輸入的用戶名和密碼
String password=(String)request.getParameter("password");
String sql="select * from 用戶名 where 用戶賬號="+"'"+username+"'";//定義一個查詢陳述句
ResultSet rs=db.executeQuery(sql);//執行查詢陳述句
try {
if(rs.next())
{
//將輸入的密碼與資料庫密碼相比對,執行相應操作
if(password.equals(rs.getObject("用戶密碼"))){
//上節課的習題中的第二種跳轉方式
response.sendRedirect("../Project/index.html");
}
else{
//js中的alert可以彈出視窗
out.print("<script language='javaScript'> alert('密碼錯誤');</script>");
response.setHeader("refresh", "0;url=login.jsp");
}
}
else
{
out.print("<script language='javaScript'> alert('用戶名錯誤,請重新輸入');</script>");
/**
* 一秒重繪頁面一次 response.setHeader("refresh","1");這個是沒有引數的情況下自動重繪
* 二秒跳到其他頁面 response.setHeader("refresh","2;URL=o");
*/
response.setHeader("refresh", "0;url=login.jsp");
}
} catch (SQLException throwables) {
throwables.printStackTrace();
}
%>
</body>
</html>
🍓創建register.jsp檔案
<!DOCTYPE html>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>注冊界面</title>
<script src="../Project/register.js" async></script>
<link rel="stylesheet" type="text/css" href="../Project/register.css">
</head>
<body>
<div class="container right-panel-active">
<!-- Sign Up -->
<div class="container__form container--signup">
<form action="Cregister.jsp" class="form" id="form1" method="post">
<h2 class="form__title">注冊</h2>
<input type="text" placeholder="名字" class="input" name="name"/>
<input type="text" placeholder="用戶名" class="input" name="username"/>
<input type="password" placeholder="密碼" class="input" name="password"/>
<input type="text" placeholder="聯系電話" class="input" name="phone"/>
<%-- <input type="text" placeholder="" class="input" />--%>
<button class="btn">
點擊注冊
</button>
</form>
</div>
<!-- Sign In -->
<!-- <div class="container__form container--signin">
<form action="#" class="form" id="form2">
<h2 class="form__title">登錄</h2>
<input type="email" placeholder="郵箱" class="input" />
<input type="password" placeholder="密碼" class="input" />
<a href="#" class="link">忘記密碼</a>
<button class="btn">登錄</button>
</form>
</div> -->
<!-- Overlay -->
<div class="container__overlay">
<div class="overlay">
<!-- <div class="overlay__panel overlay--left">
<button class="btn" id="signIn">登錄</button>
</div> -->
<!-- <div class="overlay__panel overlay--right">
<a href="index.html"><button class="btn" id="signUp">注冊</button></a> -->
<!-- </div> -->
</div>
</div>
</div>
</body>
</html>
🍓新建Cregister.jsp檔案 :
<%@ page import="java.sql.*" language="java" contentType="text/html; charset=utf-8" pageEncoding="utf-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<meta http-equiv="refresh" content="0;url=login.jsp"/><%-- 實作0秒跳轉到登錄界面 --%>
<title>Insert title here</title>
</head>
<body>
<%--
一、
jsp:useBean的基本用法
jsp:useBean是一個JSP動作指令,表示裝載一個將在JSP頁面中使用的JavaBean
jsp:useBean的最基本語法如下:
其中id表示定義的JavaBean的唯一標識,class表示定義的JavaBean的類,
--%>
<jsp:useBean id="db" class="MySql.DBUtil" scope="page"/>
<%
request.setCharacterEncoding("UTF-8");
String name=(String)request.getParameter("name");
String username=(String)request.getParameter("username");//獲取register頁面輸入的用戶名和密碼
String password=(String)request.getParameter("password");
String phone=(String)request.getParameter("phone");
String sql="INSERT INTO 用戶名(名字,用戶賬號,用戶密碼,聯系電話) VALUES"+"('"+name+"',"+"'"+username+"',"+"'"+password+"'"+",'"+phone+"')";//定義一個插入陳述句
db.execQuery(sql);//執行插入陳述句
// try {
// if(rs.next())
// {
// //將輸入的密碼與資料庫密碼相比對,執行相應操作
// if(password.equals(rs.getObject("用戶密碼"))){
// response.sendRedirect("../Project/index.html");
// }
// else{
// out.print("<script language='javaScript'> alert('密碼錯誤');</script>");
// response.setHeader("refresh", "0;url=login.jsp");
// }
// }
// else
// {
// out.print("<script language='javaScript'> alert('用戶名錯誤,請重新輸入');</script>");
// response.setHeader("refresh", "0;url=login.jsp");
// }
// } catch (SQLException throwables) {
// throwables.printStackTrace();
// }
%>
<body>
<%--<img id="aa" src="<s:url value="/dangdang/productImages/1.jpg"/>"/>--%>
<%--還有<span id="ss"></span>跳轉--%>
<%--<script type="text/javascript">--%>
<%-- //先宣告一個時間變數--%>
<%-- var count = 3;--%>
<%-- //宣告時間遞減的方法--%>
<%-- var time = function(){--%>
<%-- count = count - 1;--%>
<%-- if(count == 0){--%>
<%-- window.location.href="<s:url value='login.jsp'/>";--%>
<%-- }else{--%>
<%-- //將時間顯示到頁面上--%>
<%-- $("#ss").text(count);--%>
<%-- //設定一個定時器,每隔一秒自動遞回呼叫自己一次--%>
<%-- setTimeout(time, 1000);--%>
<%-- }--%>
<%-- };--%>
<%-- time();--%>
<%--</script>--%>
</body>
</html>
🍓創建DBBean.java檔案
package MySql;
import java.sql.*;
public class DBUtil {
/**
* 一、
* mysql5及之前的版本使用的是舊版驅動"com.mysql.jdbc.Driver"
* mysql6以及之后的版本需要更新到新版驅動,對應的Driver是"com.mysql.cj.jdbc.Driver"
* 二、
* com.mysql.cj.jdbc.Driver
* 這個類是資料庫廠商實作的JDBC一套介面里的一個類,稱之為“驅動類”,它的繼承樹如下所示:
* ————com.mysql.jdbc.Driver extends com.mysql.cj.jdbc.Driver
* ————com.mysql.cj.jdbc.Driver extends NonRegisteringDriver
* ————public class NonRegisteringDriver implements java.sql.Driver
* 三、
* java.sql是sun官方提供的包,java.sql.Driver是sun提供的一組用于連接資料庫的介面之一,由資料庫廠商自行實作
* 由上可知,com.mysql.cj.jdbc.Driver這個驅動類,是對java.sql.Driver介面的實作
*/
private String driverStr = "com.mysql.cj.jdbc.Driver";//上面第一點解釋了為什么要加cj
private String connStr = "jdbc:mysql://localhost:3306/用戶表";//這個相當于是本地資料庫的url(地址)
private String dbusername = "root";//資料庫的賬號
private String dbpassword = "123456";//資料庫的密碼,需要大家自行修改,在控制臺上用Sql陳述句可以修改
private Connection conn = null;
/*
- Statement:
由createStatement創建,用于發送簡單的SQL陳述句(不帶引數)
Statement createStatement() throws SQLException;
*/
private Statement stmt = null;
public DBUtil()
{
try
{
/*
載入這個類com.mysql.cj.jdbc.Driver進JVM之后,在后續的程式中,就可以使用它,
*/
Class.forName(driverStr);//載入這個類
/*
兩種不同的資料庫軟體的連接方式:
-Mysql
Connection con = DriverManager.getConnection("jdbc:mysql://host:port/database", "user", "password");
-Oracle
Connection con = DriverManager.getConnection("jdbc:oracle:thin@host:port/database", "user", "password");
*/
conn = DriverManager.getConnection(connStr, dbusername, dbpassword);
/*
常用的Statement方法
- execute():運行陳述句,回傳是否有結果集,
- executeQuery():運行select陳述句,回傳ResultSet結果節
- executeUpdate():運行insert/update/delete操作,回傳更新的行數,
解釋了下面的方法的作用
*/
stmt = conn.createStatement();
}
catch (Exception ex) {
//捕獲例外,上個學期學過
System.out.println(ex.getMessage());
System.out.println("資料連接失敗!");
}
}
public int executeUpdate(String s) {
// executeUpdate():運行insert/update/delete操作,回傳更新的行數,
int result = 0;
System.out.println("--更新陳述句:"+s+"\n");
try {
result = stmt.executeUpdate(s);
} catch (Exception ex) {
System.out.println("執行更新錯誤!");
}
return result;
}
public ResultSet executeQuery(String s) {
//運行select陳述句,回傳ResultSet結果節
ResultSet rs = null;
System.out.print("--查詢陳述句:"+s+"\n");
try {
rs = stmt.executeQuery(s);
} catch (Exception ex) {
System.out.println("執行查詢錯誤!");
}
return rs;
}
public void execQuery(String s){
try {
stmt.executeUpdate(s);
} catch (SQLException e) {
System.out.println("執行插入錯誤!");
}
}
public void close() {
try {
stmt.close();
conn.close();
} catch (Exception e) {
}
}
}
上面僅展示部分代碼哦,jsp檔案中的CSS樣式檔案封裝在本地!
?????????????最終結果展示如下????????????
??
??
🎉🎉🎉🐱?🏍🐱?🏍🐱?🏍🐱?🏍🎇🎇🎇🎇🎆🎆🎆🎆🧨🧨🧨🧨🎃🎃🎃🎃🎑🎑🎑🎑🧵🧵
因為本學期剛好在做一個專案,動態登錄和注冊功能是該專案的一個小模塊,寒假的時候我會實時更新專案的一些其它模塊
希望大家多多支持!!!🤞🤞🤞🤞
轉載請註明出處,本文鏈接:https://www.uj5u.com/houduan/384249.html
標籤:java
下一篇:Python matplotlib可視化:在Matplotlib中為坐標軸刻度添加自定義符號(例如,貨幣符號¥$等)、水平條形圖(horizontal bar)
