JSP_5.16_课堂笔记

  • JSP_5.16_课堂笔记已关闭评论
  • 128 次浏览
  • A+
所属分类:Web前端
摘要

完整的可以与数据库连接的登录界面的代码Class.forName(“驱动程序名”);
MySQL: com.mysql.jdbc.Driver com.mysql.cj.jdbc.Driver
Oracle: oracle.jdbc.driver.OracleDriver
SQL Server: com.microsoft.jdbc.sqlserver.SQLServerDriver

完整的可以与数据库连接的登录界面的代码

login.jsp

<%@ page language="java" contentType="text/html; UTF-8"     pageEncoding="UTF-8"%>      <!DOCTYPE html>     <html>         <head>             <meta charset="UTF-8">             <title>登录页面</title>             <script src="js/jquery-3.3.1.min.js"></script>             <style type="text/css">                 #diceng{                     width:430px;                     height:380px;                     background-color:#FFFFFF33;                     position:absolute;                     left:50%;                     top:50%;                     margin-left:-215px;                     margin-top:-190px;                     border-radius:5px;                 }                 #zhongceng{                     width:400px;                     height:350px;                     background-color:#FFFFFFFF;                     position:absolute;                     left:50%;                     top:50%;                     margin-left:-200px;                     margin-top:-175px;                     border-radius:5px;                 }                 #d1{                     width:400px;                     height:60px;                     font-size:30px;                     font-family:Avenir,Helvetica,Arial,sans-serif;                     color:black;                     display:block;                     margin-left:40px;                     margin-top:20px;                                      }                 #d2{                     width:400px;                     height:35px;                     font-size:20px;                     font-family:Avenir,Helvetica,Arial,sans-serif;                     color:black;                     display:block;                     margin-left:40px;                                      }                 #d3{                     width:400px;                     height:35px;                     font-size:20px;                     font-family:Avenir,Helvetica,Arial,sans-serif;                     color:black;                     display:block;                     margin-left:40px;                                      }                 #username{                     width:280px;                     height:40px;                     font-size:30px;                     font-family:Avenir,Helvetica,Arial,sans-serif;                     color:black;                     display:block;                     margin-left:40px;                     border-radius:5px;                                      }                 #password{                     width:280px;                     height:40px;                     font-size:30px;                     font-family:Avenir,Helvetica,Arial,sans-serif;                     color:black;                     display:block;                     margin-left:40px;                     border-radius:5px;                                                           }                 #submit{                     width:237px;                     height:40px;                     margin-top: 5px;                     background-color: #47a0fc;                     border: 1px solid #47a0fc;                     color: #fff;                     font-size: 14px;                     cursor: pointer;                     outline: none;                     border-radius: 2px;                     display:block;                     margin-left:65px;                     margin-top:15px;                     border-radius:5px;                                      }                 .bjimg {                     position: fixed;                     top: 0;                     left: 0;                     width: 100%;                     height: 100%;                     min-width: 1000px;                     z-index: -10;                     zoom: 1;                     background-color: #fff;                     background-repeat: no-repeat;                     background-size: cover;                     -webkit-background-size: cover;                     -o-background-size: cover;                     background-position: center 0;                     background-image:url("https://w.wallhaven.cc/full/ex/wallhaven-ex9ork.jpg" alt="JSP_5.16_课堂笔记")                     }             </style>         </head>     <body>         <div class="bjimg"></div>         <div id=diceng>             <div id=zhongceng>                                  <div id=d1>欢迎登录优逸客实训平台</div>                     <div id=d2>用户名</div>                     <input id=username type='text' placeholder="请输入用户名"></input>                     <div id=d3>密码</div>                     <input id=password type="password" placeholder="请输入密码"></input>                     <button id=submit>登录</button>             </div>         </div>         <script>     $(document).ready(function(){         $("#submit").click(function(){             var username = $("#username").val(); // 获取用户名             var password = $("#password").val(); // 获取密码             if(username == "" || password == ""){                 alert("请输入用户名和密码!"); // 输入为空,提示用户                 return;             }             $.ajax({                 url: "jdbclogin.jsp?username="+username+"&password="+password, // 后端处理jsp文件                 type: "GET",                 dataType:'json',                 success: function(res){                     if(res.msg== "success"){                         window.location.href = "main.jsp"; // 登录成功,跳转到主页                     }else{                         alert("用户名或密码错误!"); // 登录失败,提示用户                     }                 }             });         });     }); </script>     </body> </html> 

jdbclogin.jsp

<%@ page language="java" contentType="text/html; charset=UTF-8"     pageEncoding="UTF-8"%> <%@ page import="java.sql.*" %> <%@page import="java.io.PrintWriter"%> <%     String username = request.getParameter("username"); // 获取用户名     String password = request.getParameter("password"); // 获取密码     PrintWriter writer = response.getWriter();     response.setCharacterEncoding("UTF-8"); 	Class.forName("com.mysql.cj.jdbc.Driver"); 	Connection conn = DriverManager.getConnection("jdbc:mysql://localhost:3306/study?serverTimezone=UTC&useSSL=false&useUnicode=true&characterEncoding=utf8", "root", "000000"); // 建立数据库连接 	Statement stat = conn.createStatement(); 	String sql = "SELECT * FROM user WHERE username='"+username+"' AND password='"+password+"'"; 	ResultSet rs = stat.executeQuery(sql); // 执行查询 	if(rs.next()){ 		   writer.write("{"msg":"success"}"); 		   writer.flush(); 		 }else{ 		   writer.write("{"msg":"fail"}"); 		   writer.flush(); 		 }    	rs.close();    	stat.close();    	conn.close();  %> 

register.jsp

<%@ page language="java" contentType="text/html; UTF-8"     pageEncoding="UTF-8"%> <!DOCTYPE html> 	<html> 		<head> 			<meta charset="UTF-8"> 			<title>注册页面</title> 			<script src="js/jquery-3.3.1.min.js"></script> 			<style type="text/css"> 				#diceng{ 					width:430px; 					height:380px; 					background-color:#FFFFFF33; 					position:absolute; 					left:50%; 					top:50%; 					margin-left:-215px; 					margin-top:-190px; 					border-radius:5px; 				} 				#zhongceng{ 					width:400px; 					height:350px; 					background-color:#FFFFFFFF; 					position:absolute; 					left:50%; 					top:50%; 					margin-left:-200px; 					margin-top:-175px; 					border-radius:5px; 				} 				#d1{ 					width:400px; 					height:40px; 					font-size:30px; 					font-family:Avenir,Helvetica,Arial,sans-serif; 					color:black; 					display:block; 					margin-left:40px; 					margin-top:20px; 					 				} 				#d2{ 					width:400px; 					height:35px; 					font-size:20px; 					font-family:Avenir,Helvetica,Arial,sans-serif; 					color:black; 					display:block; 					margin-left:40px; 					 				} 				#d3{ 					width:400px; 					height:35px; 					font-size:20px; 					font-family:Avenir,Helvetica,Arial,sans-serif; 					color:black; 					display:block; 					margin-left:40px; 					 				} 				#d7{ 					width:400px; 					height:35px; 					font-size:20px; 					font-family:Avenir,Helvetica,Arial,sans-serif; 					color:black; 					display:block; 					margin-left:40px; 					 				} 				#username{ 					width:280px; 					height:30px; 					font-size:30px; 					font-family:Avenir,Helvetica,Arial,sans-serif; 					color:black; 					display:block; 					margin-left:40px; 					border-radius:5px; 					 				} 				#password1{ 					width:280px; 					height:30px; 					font-size:30px; 					font-family:Avenir,Helvetica,Arial,sans-serif; 					color:black; 					display:block; 					margin-left:40px; 					border-radius:5px; 					 					 				} 				#password2{ 					width:280px; 					height:30px; 					font-size:30px; 					font-family:Avenir,Helvetica,Arial,sans-serif; 					color:black; 					display:block; 					margin-left:40px; 					border-radius:5px; 					 					 				} 				#submit{ 					width:237px; 					height:40px; 				    margin-top: 5px; 				    background-color: #47a0fc; 				    border: 1px solid #47a0fc; 				    color: #fff; 				    font-size: 20px; 				    cursor: pointer; 				    outline: none; 				    border-radius: 2px; 					display:block; 					margin-left:65px; 					margin-top:15px; 					border-radius:5px; 					 				} 				.bjimg { 				    position: fixed; 				    top: 0; 				    left: 0; 				    width: 100%; 				    height: 100%; 				    min-width: 1000px; 				    z-index: -10; 				    zoom: 1; 				    background-color: #fff; 				    background-repeat: no-repeat; 				    background-size: cover; 				    -webkit-background-size: cover; 				    -o-background-size: cover; 				    background-position: center 0; 					background-image:url("https://w.wallhaven.cc/full/ex/wallhaven-ex9ork.jpg" alt="JSP_5.16_课堂笔记") 					} 			</style> 		</head> 	<body> 		<div class="bjimg"></div> 		<div id=diceng> 			<div id=zhongceng> 					<div id=d1>欢迎注册优逸客实训平台</div> 					<div id=d2>用户名</div> 					<input type='text' placeholder="请输入用户名" id="username"></input> 					<div id=d3>密码</div> 					<input type="password" placeholder="请输入密码" id="password1"></input> 					<div id=d7>再次输入密码</div> 					<input type="password" placeholder="请重新输入密码" id="password2"></input> 					<button id=submit onclick="register()">注册</button> 			</div> 		</div> 	<script type="text/javascript">     		function register(){     			var username = $("#username")[0].value;     			var password1 = $("#password1")[0].value;     			var password2 = $("#password2")[0].value;             $.ajax({                 url: "jdbcregister.jsp?username="+username+"&password1="+password1+"&password2="+password2,                 type: "GET",                 dataType:"json",                 success: function(res){                 	                     if(res.msg == "success"){                         window.location.href = "login.jsp";                     }else{                         alert("注册失败!");                     }                 }             })     } </script> 	</body> </html> 

jdbcregister.jsp

<%@ page language="java" contentType="text/html; charset=UTF-8"     pageEncoding="UTF-8"%> <%@page import="java.sql.ResultSet"%> <%@page import="java.sql.Statement"%> <%@page import="java.sql.DriverManager"%> <%@page import="java.sql.Connection"%> <%@page import="java.io.PrintWriter"%> <%     String username = request.getParameter("username");     String password1 = request.getParameter("password1");     String password2 = request.getParameter("password2");     response.setCharacterEncoding("UTF-8"); //设置交换数据时的数据格式     PrintWriter writer = response.getWriter();     if(password1.equals(password2)){ 	    Class.forName("com.mysql.jdbc.Driver"); 	     	    Connection conn = DriverManager.getConnection("jdbc:mysql://localhost:3306/study?serverTimezone=UTC&useSSL=false&useUnicode=true&characterEncoding=utf8", "root", "000000"); 	    String sql = "Select * from user where username='"+username+"'"; 	    Statement stat = conn.createStatement(); 	    ResultSet rs = stat.executeQuery(sql); 	        if(rs.next()){ 	        	 writer.write("{"msg":"fail"}"); 	             writer.flush(); 	        	}else{ 	    		String sql2 ="insert into user(username,password) values('"+username+"','"+password1+"')"; 	    		int num = stat.executeUpdate(sql2); 	            if(num > 0){ 	               		writer.write("{"msg":"success"}"); 	               		writer.flush(); 	             	}else{ 	               		writer.write("{"msg":"fail"}"); 	               		writer.flush(); 	             	} 	            } 	    	} 	        else{ 	        	   writer.write("{"msg":"fail"}"); 	        	   writer.flush(); 	            }               %> 

main.jsp

<%@ page language="java" contentType="text/html; charset=UTF-8"     pageEncoding="UTF-8"%> <!DOCTYPE html> <html> 	<head> 		<title>登陆成功</title> 		<style> 		body { 		background-image: url("https://w.wallhaven.cc/full/j3/wallhaven-j3m8y5.png"); 		background-size: cover; 		background-position: center center; 		font-family: 'Microsoft YaHei', sans-serif; 		color: white; 		} 		#header { 		background-color: rgba(0, 0, 0, 0.5); 		padding: 20px; 		display: flex; 		align-items: center; 		justify-content: space-between; 		} 		#header img { 		height: 80px; 		border-radius: 50%; 		margin-right: 20px; 		} 		h1 { 		font-size: 48px; 		margin: 0; 		font-weight: bold; 		font-style: italic; 		text-shadow: 2px 2px 4px #000000; 		} 		nav { 		background-color: rgba(0, 0, 0, 0.5); 		padding: 10px; 		display: flex; 		justify-content: center; 		} 		nav a { 		color: white; 		text-decoration: none; 		margin: 0 10px; 		font-size: 24px; 		font-weight: bold; 		text-transform: uppercase; 		letter-spacing: 2px; 		transition: all 0.3s ease; 		} 		nav a:hover { 		color: #00ff00; 		} 		</style> 	</head> 	<body> 		<header id="header"> 			<img src="http://mms2.baidu.com/it/u=983221791,942132541&fm=253&app=138&f=JPEG&fmt=auto&q=75?w=320&h=307" alt="Avatar"> 			<h1>登陆成功!</h1> 		</header> 			<nav> 			<a href="#">首页</a> 			<a href="#">关于</a> 			<a href="#">联系我</a> 			<a href="#">QQ</a> 			<a href="#">微信</a> 			</nav> 		<main> 			<p style="font-size: 60px; font-weight: bold;"></p> 		</main> 	</body> </html>  

JSP_5.16_课堂笔记

5.16笔记

一、JDBC回顾

JDBC技术Java用来连接操作数据库的工具,JDBC严格意义上属于Java的一种技术。JDBC连接操作数据库时,整体一共分为七步(需要引入编程依赖)。 

1、加载驱动(告诉JDBC程序,连接的是哪一个数据库)

Class.forName(“驱动程序名”);
MySQL: com.mysql.jdbc.Driver com.mysql.cj.jdbc.Driver
Oracle: oracle.jdbc.driver.OracleDriver
SQL Server: com.microsoft.jdbc.sqlserver.SQLServerDriver

2、获取和数据库之间的连接—java.sql.DriverManager

Connection conn = DriverManager.getConnection(三个参数);
三个参数也成为数据库连接三要素:
URL:数据库的地址、连接的数据库的名字、连接数据库使用的参数
MySQL: jdbc:mysql://ip:port/databaseName?key=value&key=value
Oracle: jdbc:oracle:thin:@IP地址:端口号:数据库名
SQL Server: jdbc:microsoft:sqlserver://IP地址:端口号;DatabaseName=数据库名
用户名: 数据库的用户名
密码:数据库的密码

3、准备SQL语句

String sql = “xxxxx”;
JDBC操作数据库时,一般执行的SQL语句都是DMLDQL类型的语言。
SQL语句中存在一些字符串,字符串最好使用单引号

4、创建小推车—java.sql.Statement

Statement stat = conn.createStatement();
小推车是JDBC的核心,SQL语句的执行以及执行结果的返回都是Statement实现的

5、小推车带着SQL语句去数据库执行SQL语句,并且返回执行结果

JDBC操作SQL,SQL一般分为两类:DMLDQL,两类SQL语句的执行方式以及返回结果都是不同的。
执行DML类型的SQL:--返回的是一个数字,这个数字代表数据库受影响的行数
int num = stat.executeUpdate(DMLSQL);
执行DQL类型SQL—返回的是一个ResultSet结果集,结果集就是查询回来的虚拟表格,
ResultSet rs = stat.executeQuery(DQLSQL);

6、Java程序处理逻辑

如果执行的是DML类型的SQL语句,Java程序只需要判断是否执行成功即可
如果执行的是DQL类型的SQL语句,Java程序需要获取ResultSet结果集当中封装的虚拟表格数据。

7、释放JDBC程序使用的资源

ResultSet Statement Connection
如果执行的是DML类型的SQL,只需要释放两个Statement Connection
如果执行的是DQL类型的SQL,需要释放这三个

释放顺序:先创建的后释放后创建的先释放
释放调用这三者的close()方法即可。