概述

一共两个页面
当直接访问产品列表的时候,会判断用户是否登录,如果用户没有登录,则直接3秒跳转.
如果用户登录,则不进行跳转
登录页面:对于登录页面来说,直接输入用户名,密码.和数据库进行对比,进行登录.
并进行密码的本地保存

ps 一般是需要对密码加密进行本地保存的

代码如下

配置文件

<!DOCTYPE web-app PUBLIC
 "-//Sun Microsystems, Inc.//DTD Web Application 2.3//EN"
 "http://java.sun.com/dtd/web-app_2_3.dtd" >

<web-app>
  <display-name>Archetype Created Web Application</display-name>
  <servlet>
    <servlet-name>login</servlet-name>
    <jsp-file>/Login.jsp</jsp-file>
    <init-param>
      <param-name>driver</param-name>
      <param-value>com.mysql.cj.jdbc.Driver</param-value>
    </init-param>
    <init-param>
      <param-name>url</param-name>
      <param-value>jdbc:mysql://47.94.95.84:32786/test</param-value>
    </init-param>
    <init-param>
      <param-name>user</param-name>
      <param-value>test</param-value>
    </init-param>
    <init-param>
      <param-name>password</param-name>
      <param-value>**</param-value>
    </init-param>
  </servlet>
  <servlet-mapping>
    <servlet-name>login</servlet-name>
    <url-pattern>/login.html</url-pattern>
  </servlet-mapping>
</web-app>

登录界面

<%@ page import="java.sql.Connection" %>
<%@ page import="java.sql.PreparedStatement" %>
<%@ page import="java.sql.ResultSet" %>
<%@ page import="java.sql.DriverManager" %><%--
  Created by IntelliJ IDEA.
  User: ming
  Date: 19-3-13
  Time: 下午10:02
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <title>登录页面</title>
</head>
<form action="./login.html" method="post">
    <input type="text" name="username" id="username"/>
    <input type="password" name="password" id="password"/>
    <input type="submit" value="submit"/>
</form>
<script>
    // js脚本,读取客户端的cookie
    let cookie = {};
    let all = document.cookie;
    let list = all.split(";");
    for(let i = 0; i < list.length; i++){
        let p = list[i].indexOf("=");
        let space = list[i].indexOf(" ");
        let name = list[i].substring(space + 1, p);
        let value = list[i].substring(p+1);
        value = decodeURIComponent(value);
        cookie[name]=value;
    }
    // 填充到value
    if(cookie["flage"] == "true") {
        document.getElementById("username").setAttribute("value", cookie["user"]);
        document.getElementById("password").setAttribute("value", cookie["password"]);
    }
</script>
<body>
<%
    String dbdriver = config.getInitParameter("driver");
    String dburl = config.getInitParameter("url");
    String dbuser = config.getInitParameter("user");
    String dbpassword = config.getInitParameter("password");
    // 连接对象
    Connection connection = null;
    // 操作
    PreparedStatement preparedStatement = null;
    // 结果
    ResultSet resultSet = null;
    // 用户id
    String mid = null;
    // 标志位
    boolean falge = false;
    try{
        Class.forName(dbdriver);
        // 获得连接
        connection = DriverManager.getConnection(dburl, dbuser, dbpassword);
        // 编写sql验证ID 密码
        String sql = "SELECT mid FROM member WHERE name = ? AND password = ?";
        // 实例化操作对象
        preparedStatement = connection.prepareStatement(sql);
        // 设置查询内容
        preparedStatement.setString(1, request.getParameter("username"));
        preparedStatement.setString(2, request.getParameter("password"));
        // 执行查询
        resultSet = preparedStatement.executeQuery();
        // 如果可以查询到,表示合法用户
        if(resultSet.next()){
            mid = resultSet.getString(1);
            // 修改标志位
            falge = true;
        }
    }catch (Exception e){
        e.printStackTrace();
    }finally {
        try{
            resultSet.close();
            preparedStatement.close();
            connection.close();
        }catch (Exception e){
            e.printStackTrace();
        }
    }
    // 判断是否登录成功
    if(falge){
        // 登录成功
        // 保存session 保存cookie
        session.setAttribute("mid", mid);
        // 保存cookie
        Cookie cookieMid = new Cookie("mid", mid);
        Cookie cookieUser = new Cookie("user", request.getParameter("username"));
        Cookie cookiePassword = new Cookie("password", request.getParameter("password"));
        // 增加登录态cookie
        Cookie cookieFlage = new Cookie("flage", "true");
        // 客户端增加Cookie
        response.addCookie(cookieMid);
        response.addCookie(cookieUser);
        response.addCookie(cookiePassword);
        response.addCookie(cookieFlage);
        // 设置定时跳转
        response.setHeader("refresh", "3;URL=product.jsp");
        %>
            登录成功即将跳转到首页产品界面
            未跳转点击<a hre="./product.jsp">点击此处</a>
        <%
    }else{
        // 查询用户是否已经登录
        if(session.getAttribute("mid") == null) {
            Cookie cookieFlage = new Cookie("flage", "false");
            response.addCookie(cookieFlage);
        }
    }
%>
</body>
</html>

产品界面

<%--
  Created by IntelliJ IDEA.
  User: ming
  Date: 19-3-14
  Time: 下午2:51
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <title>Title</title>
</head>
<body>
此为商品列表
<script>
    // 判断当前登录态
    // js脚本,读取客户端的cookie
    let cookie = {};
    let all = document.cookie;
    let list = all.split(";");
    for(let i = 0; i < list.length; i++){
        let p = list[i].indexOf("=");
        let space = list[i].indexOf(" ");
        let name = list[i].substring(space + 1, p);
        let value = list[i].substring(p+1);
        value = decodeURIComponent(value);
        cookie[name]=value;
    }
    // 获取登录状态
    if(cookie["flage"] != "true"){
        // 登录状态
        alert("请您登录 3秒将会跳转");
    }
</script>
<%
    // 服务器端验证
    if(session.getAttribute("mid") == null) {
        // 执行页面跳转
        response.setHeader("refresh", "2;URL=/login.html");
    }
%>
</body>
</html>

注意

产品界面通过本地cookie和服务器的session进行双向验证.