【Bootstrap4前端框架+MySQL數據庫】前后端綜合實訓【10天課程 博客匯總表 詳細筆記】【附：實訓所有代碼】

目? ?錄

eclipse重置視圖

MySQL數據庫——建數據庫、建數據庫

sql代碼

Tomcat環境配置

下載tomcat壓縮包

百度搜索“Tomcat”

下載Tomcat壓縮包

解壓tomcat壓縮包

在eclipse中配置tomcat環境

機房電腦

版本：eclipse-jee-2019-12-R-win32-x86_64.zip

jdk版本太高，導致tomcat配置失敗的說明

tomcat啟動測試

tomcat按步驟配置仍然失敗的解決方法——Projects Facts -> Runtimes

tomcat啟動成功頁面

tomcat啟動失敗——需要配置JAVA_HOME

更改tomcat端口號

eclipse測試Java項目中的數據庫連接類（實體類）

com.mysql.jdbc.exceptions.jdbc4.MySQLNonTransientConnectionException異常解決方法

MySQL8.0 jar包下載

eclipse——MySQL8.0連接數據庫

新建web項目

將jar包放到lib文件夾下

Jnuit——測試

關閉項目

運行項目

用戶登錄界面的編寫與驗證

login.html（用戶登錄頁面）

UserInfoDao.java（驗證用戶信息：遍歷數據表）

LoginServlet.java（跳轉到servlet驗證用戶信息）

登錄失敗，重新登錄頁面（servlet重定向）

分頁查詢用戶數據

下載 bootstrap-table

在html頁面中引入bootstrap-table

返回json格式數據

fast JSON——jar包

---

eclipse重置視圖

MySQL數據庫——建數據庫、建數據庫

sql代碼

/* SQLyog Ultimate v11.22 (64 bit) MySQL - 5.5.56 : Database - news_manager ********************************************************************* *//*!40101 SET NAMES utf8 */;/*!40101 SET SQL_MODE=''*/;/*!40014 SET @OLD_UNIQUE_CHECKS=@@UNIQUE_CHECKS, UNIQUE_CHECKS=0 */; /*!40014 SET @OLD_FOREIGN_KEY_CHECKS=@@FOREIGN_KEY_CHECKS, FOREIGN_KEY_CHECKS=0 */; /*!40101 SET @OLD_SQL_MODE=@@SQL_MODE, SQL_MODE='NO_AUTO_VALUE_ON_ZERO' */; /*!40111 SET @OLD_SQL_NOTES=@@SQL_NOTES, SQL_NOTES=0 */; CREATE DATABASE /*!32312 IF NOT EXISTS*/`news_manager` /*!40100 DEFAULT CHARACTER SET utf8 */;USE `news_manager`;/*Table structure for table `item_user` */DROP TABLE IF EXISTS `item_user`;CREATE TABLE `item_user` (`item_user_id` int(11) NOT NULL AUTO_INCREMENT COMMENT '用戶欄目關系主鍵',`user_id` int(11) DEFAULT NULL COMMENT '用戶主鍵ID',`item_id` int(11) DEFAULT NULL COMMENT '欄目ID',`create_time` datetime DEFAULT NULL COMMENT '創建時間',`update_time` timestamp NOT NULL DEFAULT CURRENT_TIMESTAMP ON UPDATE CURRENT_TIMESTAMP COMMENT '修改時間',PRIMARY KEY (`item_user_id`),KEY `FK_Reference_1` (`user_id`),KEY `FK_Reference_2` (`item_id`),CONSTRAINT `FK_Reference_1` FOREIGN KEY (`user_id`) REFERENCES `user_info` (`user_id`),CONSTRAINT `FK_Reference_2` FOREIGN KEY (`item_id`) REFERENCES `news_item` (`item_id`) ) ENGINE=InnoDB AUTO_INCREMENT=4 DEFAULT CHARSET=utf8 COMMENT='欄目與用戶之間的關系表';/*Data for the table `item_user` */insert into `item_user`(`item_user_id`,`user_id`,`item_id`,`create_time`,`update_time`) values (1,1,1,'2020-11-19 16:09:41','2020-11-19 16:10:58'),(2,1,2,'2020-11-19 16:09:50','2020-11-19 16:11:21'),(3,2,4,'2020-11-19 16:11:31','2020-11-19 16:11:35');/*Table structure for table `logs_info` */DROP TABLE IF EXISTS `logs_info`;CREATE TABLE `logs_info` (`logs_id` int(11) NOT NULL AUTO_INCREMENT,`user_id` int(11) DEFAULT NULL COMMENT '用戶主鍵ID',`logs_content` char(10) DEFAULT NULL,`create_time` datetime DEFAULT NULL COMMENT '創建時間',`update_time` timestamp NOT NULL DEFAULT CURRENT_TIMESTAMP ON UPDATE CURRENT_TIMESTAMP COMMENT '修改時間',PRIMARY KEY (`logs_id`),KEY `FK_Reference_4` (`user_id`),CONSTRAINT `FK_Reference_4` FOREIGN KEY (`user_id`) REFERENCES `user_info` (`user_id`) ) ENGINE=InnoDB AUTO_INCREMENT=4 DEFAULT CHARSET=utf8 COMMENT='操作日志表';/*Data for the table `logs_info` */insert into `logs_info`(`logs_id`,`user_id`,`logs_content`,`create_time`,`update_time`) values (1,1,'login','2020-11-19 16:11:51','2020-11-19 16:11:56'),(2,2,'delete:new','2020-11-19 16:12:25','2020-11-19 16:12:45'),(3,4,'insert:new','2020-11-19 16:13:17','2020-11-19 16:13:21');/*Table structure for table `news_info` */DROP TABLE IF EXISTS `news_info`;CREATE TABLE `news_info` (`news_id` int(11) NOT NULL AUTO_INCREMENT COMMENT '新聞主鍵',`item_id` int(11) DEFAULT NULL COMMENT '欄目ID',`news_title` varchar(255) NOT NULL COMMENT '新聞標題',`news_image` varchar(255) DEFAULT NULL COMMENT '新聞圖片',`news_content` text COMMENT '新聞內容',`create_time` datetime DEFAULT NULL COMMENT '創建時間',`update_time` timestamp NOT NULL DEFAULT CURRENT_TIMESTAMP ON UPDATE CURRENT_TIMESTAMP COMMENT '修改時間',PRIMARY KEY (`news_id`),KEY `FK_Reference_3` (`item_id`),CONSTRAINT `FK_Reference_3` FOREIGN KEY (`item_id`) REFERENCES `news_item` (`item_id`) ) ENGINE=InnoDB AUTO_INCREMENT=4 DEFAULT CHARSET=utf8 COMMENT='新聞詳情表';/*Data for the table `news_info` */insert into `news_info`(`news_id`,`item_id`,`news_title`,`news_image`,`news_content`,`create_time`,`update_time`) values (2,3,'圖書館維修，暫停開放一天','','新學期學費......','2020-11-19 16:09:21','2020-11-23 09:17:09'),(3,1,'新能源召回大戶特斯拉的“美式”傲慢｜觀潮','http://pics1.baidu.com/feed/71cf3bc79f3df8dcecfa18268a75ee8c46102829.jpeg?token=32875797d2ded1ed2a9334df610bccf7','新浪科技 花子健\r\n從“硬件升級”到“召回”，理想汽車只用了5天。\r\n而不久前的威馬汽車召回事件，前后耗時23天，威馬汽車將之定義為“史上最快召回”。如果僅僅是簡單對比，理想汽車無疑刷新了歷史記錄。\r\n對于新造車勢力來說，受限于工藝和新技術，召回是大概率事件。目前除了小鵬未有實際的召回經歷之外，蔚來汽車、威馬汽車以及理想汽車，包括外來者特斯拉，都遇到過召回。只不過，中國新造車勢力和特斯拉表現出來的態度截然不同。\r\n“惶恐”的造車新勢力\r\n11月1日，理想汽車在媒體溝通會上宣布了針對前懸架下擺臂球銷和底盤的“免費升級”，其中前懸架下擺臂球銷受力太低與理想ONE多次出現斷軸事件有關系。\r\n但理想汽車的措辭遭到質疑。一方面是理想汽車CEO李想公開承認“升級肯定是因為產品有缺陷，我們是在行駛當中發生碰撞斷掉的幾率高于平均值。”而另外一方面，則是在一開始否認“召回”，以“免費升級”代替。\r\n理想汽車銷售服務副總裁劉杰強調，升級和那種由于車輛本身在行駛過程中出現故障和質量問題的召回，是不一樣的。11月6日，理想汽車最終宣布召回10469輛理想ONE，占已交付車輛的將近50%。\r\n官方披露的信息顯示，截至2020年10月31日，理想ONE累計發生了97起前懸架碰撞事故，其中前懸架下擺臂球頭從球銷脫出的情況超過10起，造成了理想汽車在碰撞之后斷軸的嚴重事故。','2020-11-23 09:01:17','2020-11-23 09:01:17');/*Table structure for table `news_item` */DROP TABLE IF EXISTS `news_item`;CREATE TABLE `news_item` (`item_id` int(11) NOT NULL AUTO_INCREMENT COMMENT '欄目ID',`item_name` varchar(255) NOT NULL COMMENT '欄目名稱',`create_time` datetime DEFAULT NULL COMMENT '創建時間',`update_time` timestamp NOT NULL DEFAULT CURRENT_TIMESTAMP ON UPDATE CURRENT_TIMESTAMP COMMENT '修改時間',PRIMARY KEY (`item_id`) ) ENGINE=InnoDB AUTO_INCREMENT=5 DEFAULT CHARSET=utf8 COMMENT='新聞欄目';/*Data for the table `news_item` */insert into `news_item`(`item_id`,`item_name`,`create_time`,`update_time`) values (1,'新聞處',NULL,'2020-11-19 16:04:37'),(2,'教務處',NULL,'2020-11-19 16:04:37'),(3,'財務處',NULL,'2020-11-19 16:04:38'),(4,'保衛處',NULL,'2020-11-19 16:04:38');/*Table structure for table `user_info` */DROP TABLE IF EXISTS `user_info`;CREATE TABLE `user_info` (`user_id` int(11) NOT NULL AUTO_INCREMENT COMMENT '用戶主鍵ID',`user_name` varchar(255) NOT NULL COMMENT '用戶名',`user_pwd` varchar(255) CHARACTER SET utf8 COLLATE utf8_bin NOT NULL COMMENT '用戶密碼',`create_time` datetime DEFAULT NULL COMMENT '創建時間',`update_time` timestamp NOT NULL DEFAULT CURRENT_TIMESTAMP ON UPDATE CURRENT_TIMESTAMP COMMENT '修改時間',PRIMARY KEY (`user_id`) ) ENGINE=InnoDB AUTO_INCREMENT=113 DEFAULT CHARSET=utf8 COMMENT='用戶信息表';/*Data for the table `user_info` */insert into `user_info`(`user_id`,`user_name`,`user_pwd`,`create_time`,`update_time`) values (1,'zhangsan','123','2020-11-19 14:30:51','2020-11-20 09:59:57'),(2,'李四','234','2020-11-19 14:34:49','2020-11-19 14:35:36'),(4,'王五','123','2020-11-19 16:03:02','2020-11-19 16:03:02'),(5,'趙柳','123456','2020-11-20 09:15:26','2020-11-20 09:15:26'),(8,'田七','123456','2020-11-20 09:43:30','2020-11-20 09:43:30'),(11,'123213','31231','2020-11-23 14:20:42','2020-11-23 14:20:44'),(12,'234234','43564564','2020-11-23 14:20:47','2020-11-23 14:20:51'),(13,'userName1','123456','2020-11-23 14:21:55','2020-11-23 14:21:55'),(14,'userName2','123456','2020-11-23 14:21:55','2020-11-23 14:21:55'),(15,'userName3','123456','2020-11-23 14:21:55','2020-11-23 14:21:55'),(16,'userName4','123456','2020-11-23 14:21:55','2020-11-23 14:21:55'),(17,'userName5','123456','2020-11-23 14:21:56','2020-11-23 14:21:56'),(18,'userName6','123456','2020-11-23 14:21:56','2020-11-23 14:21:56'),(19,'userName7','123456','2020-11-23 14:21:56','2020-11-23 14:21:56'),(20,'userName8','123456','2020-11-23 14:21:56','2020-11-23 14:21:56'),(21,'userName9','123456','2020-11-23 14:21:56','2020-11-23 14:21:56'),(22,'userName10','123456','2020-11-23 14:21:56','2020-11-23 14:21:56'),(23,'userName11','123456','2020-11-23 14:21:56','2020-11-23 14:21:56'),(24,'userName12','123456','2020-11-23 14:21:56','2020-11-23 14:21:56'),(25,'userName13','123456','2020-11-23 14:21:56','2020-11-23 14:21:56'),(26,'userName14','123456','2020-11-23 14:21:56','2020-11-23 14:21:56'),(27,'userName15','123456','2020-11-23 14:21:56','2020-11-23 14:21:56'),(28,'userName16','123456','2020-11-23 14:21:56','2020-11-23 14:21:56'),(29,'userName17','123456','2020-11-23 14:21:56','2020-11-23 14:21:56'),(30,'userName18','123456','2020-11-23 14:21:56','2020-11-23 14:21:56'),(31,'userName19','123456','2020-11-23 14:21:56','2020-11-23 14:21:56'),(32,'userName20','123456','2020-11-23 14:21:56','2020-11-23 14:21:56'),(33,'userName21','123456','2020-11-23 14:21:56','2020-11-23 14:21:56'),(34,'userName22','123456','2020-11-23 14:21:56','2020-11-23 14:21:56'),(35,'userName23','123456','2020-11-23 14:21:56','2020-11-23 14:21:56'),(36,'userName24','123456','2020-11-23 14:21:56','2020-11-23 14:21:56'),(37,'userName25','123456','2020-11-23 14:21:56','2020-11-23 14:21:56'),(38,'userName26','123456','2020-11-23 14:21:56','2020-11-23 14:21:56'),(39,'userName27','123456','2020-11-23 14:21:56','2020-11-23 14:21:56'),(40,'userName28','123456','2020-11-23 14:21:56','2020-11-23 14:21:56'),(41,'userName29','123456','2020-11-23 14:21:56','2020-11-23 14:21:56'),(42,'userName30','123456','2020-11-23 14:21:56','2020-11-23 14:21:56'),(43,'userName31','123456','2020-11-23 14:21:56','2020-11-23 14:21:56'),(44,'userName32','123456','2020-11-23 14:21:56','2020-11-23 14:21:56'),(45,'userName33','123456','2020-11-23 14:21:56','2020-11-23 14:21:56'),(46,'userName34','123456','2020-11-23 14:21:56','2020-11-23 14:21:56'),(47,'userName35','123456','2020-11-23 14:21:56','2020-11-23 14:21:56'),(48,'userName36','123456','2020-11-23 14:21:57','2020-11-23 14:21:57'),(49,'userName37','123456','2020-11-23 14:21:57','2020-11-23 14:21:57'),(50,'userName38','123456','2020-11-23 14:21:57','2020-11-23 14:21:57'),(51,'userName39','123456','2020-11-23 14:21:57','2020-11-23 14:21:57'),(52,'userName40','123456','2020-11-23 14:21:57','2020-11-23 14:21:57'),(53,'userName41','123456','2020-11-23 14:21:57','2020-11-23 14:21:57'),(54,'userName42','123456','2020-11-23 14:21:57','2020-11-23 14:21:57'),(55,'userName43','123456','2020-11-23 14:21:57','2020-11-23 14:21:57'),(56,'userName44','123456','2020-11-23 14:21:57','2020-11-23 14:21:57'),(57,'userName45','123456','2020-11-23 14:21:57','2020-11-23 14:21:57'),(58,'userName46','123456','2020-11-23 14:21:57','2020-11-23 14:21:57'),(59,'userName47','123456','2020-11-23 14:21:57','2020-11-23 14:21:57'),(60,'userName48','123456','2020-11-23 14:21:57','2020-11-23 14:21:57'),(61,'userName49','123456','2020-11-23 14:21:57','2020-11-23 14:21:57'),(62,'userName50','123456','2020-11-23 14:21:57','2020-11-23 14:21:57'),(63,'userName51','123456','2020-11-23 14:21:57','2020-11-23 14:21:57'),(64,'userName52','123456','2020-11-23 14:21:57','2020-11-23 14:21:57'),(65,'userName53','123456','2020-11-23 14:21:57','2020-11-23 14:21:57'),(66,'userName54','123456','2020-11-23 14:21:57','2020-11-23 14:21:57'),(67,'userName55','123456','2020-11-23 14:21:57','2020-11-23 14:21:57'),(68,'userName56','123456','2020-11-23 14:21:57','2020-11-23 14:21:57'),(69,'userName57','123456','2020-11-23 14:21:57','2020-11-23 14:21:57'),(70,'userName58','123456','2020-11-23 14:21:57','2020-11-23 14:21:57'),(71,'userName59','123456','2020-11-23 14:21:57','2020-11-23 14:21:57'),(72,'userName60','123456','2020-11-23 14:21:57','2020-11-23 14:21:57'),(73,'userName61','123456','2020-11-23 14:21:58','2020-11-23 14:21:58'),(74,'userName62','123456','2020-11-23 14:21:58','2020-11-23 14:21:58'),(75,'userName63','123456','2020-11-23 14:21:58','2020-11-23 14:21:58'),(76,'userName64','123456','2020-11-23 14:21:58','2020-11-23 14:21:58'),(77,'userName65','123456','2020-11-23 14:21:58','2020-11-23 14:21:58'),(78,'userName66','123456','2020-11-23 14:21:58','2020-11-23 14:21:58'),(79,'userName67','123456','2020-11-23 14:21:58','2020-11-23 14:21:58'),(80,'userName68','123456','2020-11-23 14:21:58','2020-11-23 14:21:58'),(81,'userName69','123456','2020-11-23 14:21:58','2020-11-23 14:21:58'),(82,'userName70','123456','2020-11-23 14:21:58','2020-11-23 14:21:58'),(83,'userName71','123456','2020-11-23 14:21:58','2020-11-23 14:21:58'),(84,'userName72','123456','2020-11-23 14:21:58','2020-11-23 14:21:58'),(85,'userName73','123456','2020-11-23 14:21:58','2020-11-23 14:21:58'),(86,'userName74','123456','2020-11-23 14:21:58','2020-11-23 14:21:58'),(87,'userName75','123456','2020-11-23 14:21:58','2020-11-23 14:21:58'),(88,'userName76','123456','2020-11-23 14:21:58','2020-11-23 14:21:58'),(89,'userName77','123456','2020-11-23 14:21:58','2020-11-23 14:21:58'),(90,'userName78','123456','2020-11-23 14:21:58','2020-11-23 14:21:58'),(91,'userName79','123456','2020-11-23 14:21:58','2020-11-23 14:21:58'),(92,'userName80','123456','2020-11-23 14:21:58','2020-11-23 14:21:58'),(93,'userName81','123456','2020-11-23 14:21:58','2020-11-23 14:21:58'),(94,'userName82','123456','2020-11-23 14:21:58','2020-11-23 14:21:58'),(95,'userName83','123456','2020-11-23 14:21:58','2020-11-23 14:21:58'),(96,'userName84','123456','2020-11-23 14:21:58','2020-11-23 14:21:58'),(97,'userName85','123456','2020-11-23 14:21:58','2020-11-23 14:21:58'),(98,'userName86','123456','2020-11-23 14:21:58','2020-11-23 14:21:58'),(99,'userName87','123456','2020-11-23 14:21:58','2020-11-23 14:21:58'),(100,'userName88','123456','2020-11-23 14:21:58','2020-11-23 14:21:58'),(101,'userName89','123456','2020-11-23 14:21:59','2020-11-23 14:21:59'),(102,'userName90','123456','2020-11-23 14:21:59','2020-11-23 14:21:59'),(103,'userName91','123456','2020-11-23 14:21:59','2020-11-23 14:21:59'),(104,'userName92','123456','2020-11-23 14:21:59','2020-11-23 14:21:59'),(105,'userName93','123456','2020-11-23 14:21:59','2020-11-23 14:21:59'),(106,'userName94','123456','2020-11-23 14:21:59','2020-11-23 14:21:59'),(107,'userName95','123456','2020-11-23 14:21:59','2020-11-23 14:21:59'),(108,'userName96','123456','2020-11-23 14:21:59','2020-11-23 14:21:59'),(109,'userName97','123456','2020-11-23 14:21:59','2020-11-23 14:21:59'),(110,'userName98','123456','2020-11-23 14:21:59','2020-11-23 14:21:59'),(111,'userName99','123456','2020-11-23 14:21:59','2020-11-23 14:21:59'),(112,'userName100','123456','2020-11-23 14:21:59','2020-11-23 14:21:59');/*!40101 SET SQL_MODE=@OLD_SQL_MODE */; /*!40014 SET FOREIGN_KEY_CHECKS=@OLD_FOREIGN_KEY_CHECKS */; /*!40014 SET UNIQUE_CHECKS=@OLD_UNIQUE_CHECKS */; /*!40111 SET SQL_NOTES=@OLD_SQL_NOTES */;

Tomcat環境配置

下載tomcat壓縮包

百度搜索“Tomcat”

下載Tomcat壓縮包

解壓tomcat壓縮包

在eclipse中配置tomcat環境

機房電腦

? ?

? ?

選擇tomcat壓縮包的解壓路徑（bin的上一級目錄）：

? ?

? ?

版本：eclipse-jee-2019-12-R-win32-x86_64.zip

? ?

選擇tomcat壓縮包的解壓路徑（bin的上一級目錄）：

選擇tomcat壓縮包的解壓路徑（bin的上一級目錄）：

? ?

jdk版本太高，導致tomcat配置失敗的說明

刪除eclipse... 重新搞一遍...

jdk11版本太高，把jdk卸載干凈，換成jdk8就行了。

tomcat啟動測試

tomcat按步驟配置仍然失敗的解決方法——Projects Facts -> Runtimes

關閉eclipse，重新打開eclipse，應該也可以。

? ?

tomcat啟動成功頁面

• http://127.0.0.1:8080/
• http://localhost:8080/

tomcat啟動失敗——需要配置JAVA_HOME

C:\Java\jdk1.8.0_152

更改tomcat端口號

eclipse測試Java項目中的數據庫連接類（實體類）

5個數據表：每個數據表都要有3個相應的Java類。

package com.newcapec.dao; // dao層包（模板Dao）模板代碼、固定寫法

• BaseDao.java：應用于5個數據表的Java接口 實現“增刪改查”的接口

package com.newcapec.entity; // 實體entity

• NewsInfoEntity.java：新聞實體類
• UserInfoEntity.java：管理員實體類

package com.newcapec.test; // 測試包

package com.newcapec.utils; // 工具包

• DBUtils.java：獲取數據庫連接的工具類

? ?

com.mysql.jdbc.exceptions.jdbc4.MySQLNonTransientConnectionException異常解決方法

原文鏈接

• 第1步：使用最新的MySQL驅動jar包。
• 第2步：把驅動的類名改為：static String driver="com.mysql.cj.jdbc.Driver";
• 第3步：在訪問mysql的url后加入時區設置：static String url="jdbc:mysql://localhost:3306/test?characterEncoding=utf-8&serverTimezone=UTC"; //?(UTC表示標準時區)

MySQL8.0 jar包下載

原文鏈接——mysql 8.0.15 jar包下載地址

package com.newcapec.utils;import java.sql.Connection; import java.sql.DriverManager; import java.sql.SQLException;import com.mysql.jdbc.Driver;/*** 獲取與數據庫的連接 此處后期需要使用阿里巴巴的druid數據庫連接池優化* * @author user**/ public class DBUtils {public static Connection openConn() throws ClassNotFoundException, SQLException {// 連接數據庫四要素// url username password driverString user = "root";String password = "root"; // String driver = "com.mysql.jdbc.Driver"; // String url = "jdbc:mysql://127.0.0.1:3306/news_manager?characterEncoding=UTF-8";String driver = "com.mysql.cj.jdbc.Driver";String url = "jdbc:mysql://localhost:3306/news_manager?characterEncoding=utf-8&serverTimezone=UTC";// (UTC表示標準時區)// 注冊數據庫驅動Class.forName(driver);return DriverManager.getConnection(url, user, password);}}

eclipse——MySQL8.0連接數據庫

原文鏈接：JavaWeb 中 MySQL8.0.19 解決java.lang.ClassNotFoundException: com.mysql.cj.jdbc.Driver的問題

問題所在：我電腦MySQL版本是8.0.19，但是mysql的jar包卻是5.1.39的，jar包與本地MySQL版本不對應導致。
解決步驟：
1.首先將websurver/WebContent/WEB-INF/lib/目錄下的mysql-connecctor-java-5.1.39-bin.jar刪除，然后將mysql-connector-java-8.0.19.jar引入。右擊mysql-connector-java-8.0.19.jar選擇圖中的選項，將其Add to Build Path。
? ?
然后在Java Build Path中顯示如圖，

2. 將Class.forName的內容換成”com.mysql.cj.jdbc.Driver”

3.在conn = DriverManager.getConnection中添加serverTimezone = GMT%2B8，如圖。完成之后就不會再報錯了。

數據庫連接成功！

新建web項目

? ?

? ?

? ?

將jar包放到lib文件夾下

Jnuit——測試

? ?

關閉項目

把不用的項目關閉！！！

運行項目

? ?

用戶登錄界面的編寫與驗證

在login.html頁面提交用戶信息（用戶名與密碼），后臺跳轉到LoginServlet.java頁面，在LoginServlet.java頁面調用UserInfoDao.java中的login()方法遍歷數據表，驗證用戶信息。

login.html（用戶登錄頁面）

<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title></title> <!-- 新 Bootstrap4 核心 CSS 文件 --> <link rel="stylesheet" href="bootstrap4/css/bootstrap.min.css"> <link rel="stylesheet" type="text/css" href="font-awesome-4.7.0/css/font-awesome.min.css" /> <!-- jQuery文件。務必在bootstrap.min.js 之前引入 --> <script src="jquery/jquery.min.js"></script> <!-- bootstrap.bundle.min.js 用于彈窗、提示、下拉菜單，包含了 popper.min.js --> <script src="js/popper.min.js"></script> <!-- 最新的 Bootstrap4 核心 JavaScript 文件 --> <script src="bootstrap4/js/bootstrap.min.js"></script> <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no"> <style type="text/css">header, footer {height: 100px;/* background-color: #005CBF; */}body {display: flex;flex-direction: column;min-height: 100vh;}#main {flex-grow: 1;background-image: url(img/banner.jpg);background-repeat: no-repeat;background-size: cover;display: flex;align-items: center;justify-content: flex-end;}#login {height: 400px;width: 400px;background-color: white;margin-right: 100px;border-radius: 10px;} </style> <title>login</title> </head> <body><header></header><div id="main"><div id="login"><form style="padding: 20px;" action="LoginServlet" method="post"><div class="input-group mb-3"><div class="input-group-prepend"><span class="input-group-text"><i class="fa fa-user"></i></span></div><input type="text" name="userName" class="form-control" placeholder="請輸入用戶名"></div><div class="input-group mb-3"><div class="input-group-prepend"><span class="input-group-text"><i class="fa fa-lock"></i></span></div><input type="text" name="userPwd" class="form-control" placeholder="Username"></div><button type="submit" class="btn btn-info form-control">登錄</button></form></div></div><footer></footer> </body> </html>

UserInfoDao.java（驗證用戶信息：遍歷數據表）

主要是login()方法對用戶信息進行驗證！

LoginServlet.java（跳轉到servlet驗證用戶信息）

package com.newcapec.servlet;import java.io.IOException; import java.sql.SQLException;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.newcapec.dao.UserInfoDao; import com.newcapec.entity.UserInfoEntity;/*** Servlet implementation class LoginServlet*/ @WebServlet(name = "/LoginServlet", urlPatterns = "/LoginServlet") public class LoginServlet extends HttpServlet {private UserInfoDao userInfoDao = new UserInfoDao();private static final long serialVersionUID = 1L;/*** @see HttpServlet#HttpServlet()*/public LoginServlet() {super();// TODO Auto-generated constructor stub}/*** @see HttpServlet#doGet(HttpServletRequest request, HttpServletResponse* response)*/protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {// TODO Auto-generated method stubresponse.getWriter().append("Served at: ").append(request.getContextPath());}/*** @see HttpServlet#doPost(HttpServletRequest request, HttpServletResponse* response)*/// 注意：在正規開發中 登錄密碼需要加密// 需要有驗證碼protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {request.setCharacterEncoding("UTF-8");String userName = request.getParameter("userName");String userPwd = request.getParameter("userPwd");try {UserInfoEntity userInfoEntity = userInfoDao.login(userName, userPwd);if (userInfoEntity != null) {// 登錄成功request.getSession().setAttribute("userInfo", userInfoEntity);response.sendRedirect("index.html");} else {// 登錄失敗 重定向response.sendRedirect("loginFailure.html");}} catch (ClassNotFoundException | SQLException e) {// TODO 自動生成的 catch 塊e.printStackTrace();}}}

登錄失敗，重新登錄頁面（servlet重定向）

?

分頁查詢用戶數據

下載 bootstrap-table

? ?

在html頁面中引入bootstrap-table

返回json格式數據

fast JSON——jar包

分頁查詢代碼詳見：Bootstrap4+MySQL前后端綜合實訓-Day06-PM【分頁查詢用戶數據】

總結

以上是生活随笔為你收集整理的Bootstrap4+MySQL前后端综合实训-Day06-AM【eclipse详细配置Tomcat、开发web项目、servlet、连接MySQL8.0数据库、用户登录界面的编写与验证、分页查询】的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。