前言
环境
jdk1.8+tomcat8.5+idea2022
实现简单的登录界面,登录成功跳转,登陆失败在控制台显示。登录成功界面显示用户名,每十秒刷新时间,还可以点击链接返回。
创建好web项目后进行如下。
一、创建LoginServlet
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 java.io.IOException;
@WebServlet(name = "LoginServlet",urlPatterns = {"/login"})
public class LoginServlet extends HttpServlet {
protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
String name=request.getParameter("name");
String password=request.getParameter("password");
request.getSession().setAttribute("name",name);
if(name.equals("china") && "123".equals(password)){
response.sendRedirect("success.jsp?uname="+name);
}else{
System.out.println("登入失败");
response.sendRedirect("index.html");
}
}
}
登录名:china
登陆密码:123
二、创建index.html和success.jsp
index.html主要完成登录界面
<!DOCTYPE html>
<html lang="en">
<h1>用户登录</h1>
<meta charset="UTF-8">
<title>登入页面</title>
</head>
<body>
<form action="login" method="post">
账号:<input type="text" name="name"><br>
密码:<input type="password" name="password"><br>
<input type="submit" value="登录">
</form>
</body>
</html>
succes.jsp
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
<meta http-equiv="refresh" content="10">//刷新时间
<title>登录成功</title>
</head>
<body>
<h1>主界面</h1>
<%String name = request.getSession().getAttribute("name").toString();%>
welcome name=<%=name %>
<div class="box"></div>
<script>
function getTime() {
var date = new Date();
var year = date.getFullYear(); //获取年份
var month = date.getMonth() + 1; //获取月份
var day = date.getDate(); //获取日期
var hour = date.getHours(); //获取小时
hour = hour < 10 ? '0' + hour : hour;
var minute = date.getMinutes(); // 获取分
minute = minute < 10 ? '0' + minute : minute;
var seconds = date.getSeconds(); //获取秒
seconds = seconds < 10 ? '0' + seconds : seconds;
return year + '年' + month + '月' + day + '日 ' + hour + ':' + minute + ':' + seconds;
}
setInterval(function() {
document.querySelector('.box').innerHTML = getTime();
}, 1000)
</script>//获取时间
<a href="index.html">返回重新登陆</a>
</body>
</html>