前后端结合——实现登陆注册
数据传输过程基本思路:
用户在前端页面选择登陆或注册,输入数据,提交到login.jsp/sign.jsp文件
===》 登陆后后端jsp文件login.jsp获取到数据,与数据库中的内容进行匹配
===》 成功找到则将数据返回到登陆成功页面,失败则将数据返回到登陆失败页面
===》 注册后后端jsp文件将前台数据插入到数据库中
===》 成功后返回到登陆页面
===》 失败后返回到失败页面
<body> <a href="index.jsp">登陆</a> <a href="signin.html">注册</a> </body>
这是一个简单的选择登陆或者注册的页面
根据选项进入相应的登陆和注册页面
以下是登陆时的后台逻辑代码:
<%@ page language="java" import="java.util.*" pageEncoding="UTF-8" contentType="text/html"%> <%@ page import="java.sql.*" %> //引入数据库操作相关的包 <% String path = request.getContextPath(); String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/"; %> <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <head> <base href="<%=basePath%>"> <title>登陆</title> <meta http-equiv="pragma" content="no-cache"> <meta http-equiv="cache-control" content="no-cache"> <meta http-equiv="expires" content="0"> <meta http-equiv="keywords" content="keyword1,keyword2,keyword3"> <meta http-equiv="description" content="This is my page"> <!-- <link rel="stylesheet" type="text/css" href="styles.css"> --> </head> <body> <%! public static final String DBDRIVER="com.mysql.jdbc.Driver"; //定义数据库驱动程序,数据库驱动程序就是定义的一套将java翻译成数据库语言的翻译程序 public static final String DBURL="jdbc:mysql://localhost:3306/user"; //定义数据库接口地址 public static final String DBUSER="root"; //定义数据库用户名 public static final String DBPASS=""; //定义数据库密码,我的数据库没有密码,所以为空 %> <%! Connection conn=null; //声明数据库连接对象 connection:A connection (session) with a specific database PreparedStatement pstmt=null; //声明数据库操作 PreparedStatement:An object that represents a precompiled SQL statement. ResultSet rs=null; //声明数据库结果集 ResultSet:A table of data representing a database result set, which is usually generated by executing a statement that queries the database boolean flag=false; //是否查找成功 String name; //匹配成功的用户名 %> <% try{ //JDBC操作会抛出异常,使用try....catch处理 Class.forName(DBDRIVER); //加载驱动程序 conn=DriverManager.getConnection(DBURL,DBUSER,DBPASS); //取得数据库连接 String sql="SELECT name FROM user WHERE userid=? AND password=?"; //查找使用的数据库语句 pstmt=conn.prepareStatement(sql); //实例化数据库操作对象 pstmt.setString(1,request.getParameter("id")); //设置查询所需要的内容 pstmt.setString(2,request.getParameter("password")); //设置查询所需要的内容 rs=pstmt.executeQuery(); //执行查询 if(rs.next()){ //如果可以查询到,则表示是数据库的合法用户 name=rs.getString(1); //取得该用户的用户名 flag=true; //修改标志位 } }catch(Exception e){ System.out.println(e); } finally{ try{ rs.close(); //关闭查询对象 pstmt.close(); //关闭操作对象 conn.close(); //关闭数据库连接 }catch(Exception e){} } %> <%=request.getParameter("id") %> <% if(flag){ //登陆成功,跳转页面 %> <jsp:forward page="login_success.jsp"> <jsp:param name="uname" value="<%=name%>"/> </jsp:forward> <% }else{ //失败跳转页面0 %> <jsp:forward page="failure.jsp"/> <% } %> </body> </html>
注册时的后台逻辑代码:
<%@ page language="java" import="java.util.*" pageEncoding="ISO-8859-1"%> <%@ page import="java.sql.*" %> <% String path = request.getContextPath(); String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/"; %> <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <head> <base href="<%=basePath%>"> <title>My JSP 'sign_check.jsp' starting page</title> <meta http-equiv="pragma" content="no-cache"> <meta http-equiv="cache-control" content="no-cache"> <meta http-equiv="expires" content="0"> <meta http-equiv="keywords" content="keyword1,keyword2,keyword3"> <meta http-equiv="description" content="This is my page"> <!-- <link rel="stylesheet" type="text/css" href="styles.css"> --> </head> <body> <%! public static final String DBDRIVER="com.mysql.jdbc.Driver"; public static final String DBURL="jdbc:mysql://localhost:3306/user"; public static final String DBUSER="root"; public static final String DBPASS=""; %> <%! Connection conn=null; PreparedStatement pstmt=null; boolean flag=false; String password; String id; String name; int count; %> <% try{ Class.forName(DBDRIVER); conn=DriverManager.getConnection(DBURL,DBUSER,DBPASS); String sql="INSERT INTO user values(?,?,?)"; pstmt=conn.prepareStatement(sql); pstmt.setString(1,request.getParameter("id")); pstmt.setString(2,request.getParameter("name")); pstmt.setString(3,request.getParameter("password")); count=pstmt.executeUpdate(); name=request.getParameter("name"); if(count>0){ flag=true; } }catch(Exception e){ System.out.println(e); } finally{ try{ pstmt.close(); conn.close(); }catch(Exception e){} } %> <% if(flag){ %> <jsp:forward page="sign_success.jsp"> <jsp:param name="uname" value="<%=name%>"/> </jsp:forward> <% }else{ %> <jsp:forward page="sign_failure.jsp"/> <% } %> </body> </html>
一、选择登陆,用户输入ID和密码,ID在数据库中是主键
在数据库查找到的话,会返回给rs变量,并将标志位置为true,否则查找失败,将标志位置为false
根据标志位的不同跳转到不同页面
登陆成功页面
jsp代码:
<%@ page language="java" import="java.util.*" pageEncoding="UTF-8" contentType="text/html"%> <% String path = request.getContextPath(); String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/"; %> <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <head> <base href="<%=basePath%>"> <title>My JSP 'login_success.jsp' starting page</title> <meta http-equiv="pragma" content="no-cache"> <meta http-equiv="cache-control" content="no-cache"> <meta http-equiv="expires" content="0"> <meta http-equiv="keywords" content="keyword1,keyword2,keyword3"> <meta http-equiv="description" content="This is my page"> <!-- <link rel="stylesheet" type="text/css" href="styles.css"> --> </head> <body> <center> <h1>登陆操作</h1><hr/> <h2>登陆成功</h2> <h2>欢迎<font color="red"><%=request.getParameter("uname") %>光临!</h2> </center> </body> </html>
但是会有错误,第二次登陆时即使发生错误,即用户名不存在或者密码输入错误也会返回登陆成功,但是信息是上一个登陆成功的用户的,这个问题待解决;
失败页面代码:
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>login_failure.html</title> <meta http-equiv="keywords" content="keyword1,keyword2,keyword3"> <meta http-equiv="description" content="this is my page"> <meta http-equiv="content-type" content="text/html; charset=UTF-8"> <!--<link rel="stylesheet" type="text/css" href="./styles.css">--> </head> <body> <center> <h1>登录操作</h1><hr/> <h2>点击重新<a href="index.jsp">ç登录</a>!</h2> </center> </body> </html>
下面是注册成功页面:
jsp代码:
<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%> <% String path = request.getContextPath(); String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/"; %> <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <head> <base href="<%=basePath%>"> <title>My JSP 'sign_success.jsp' starting page</title> <meta http-equiv="pragma" content="no-cache"> <meta http-equiv="cache-control" content="no-cache"> <meta http-equiv="expires" content="0"> <meta http-equiv="keywords" content="keyword1,keyword2,keyword3"> <meta http-equiv="description" content="This is my page"> <!-- <link rel="stylesheet" type="text/css" href="styles.css"> --> </head> <body> <h1>恭喜<font><%=request.getParameter("uname") %></font></h1> <p>点击<a href="index.jsp">登陆</a></p> </body> </html>
注册失败代码:
<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%> <% String path = request.getContextPath(); String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/"; %> <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <head> <base href="<%=basePath%>"> <title>My JSP 'sign_failure.jsp' starting page</title> <meta http-equiv="pragma" content="no-cache"> <meta http-equiv="cache-control" content="no-cache"> <meta http-equiv="expires" content="0"> <meta http-equiv="keywords" content="keyword1,keyword2,keyword3"> <meta http-equiv="description" content="This is my page"> <!-- <link rel="stylesheet" type="text/css" href="styles.css"> --> </head> <body> 注册失败 <br> </body> </html>