登录页面自动刷新验证码，并校验输入验证码和后台生成的验证码是否一致

登录jsp页面

<%@ page language="java" contentType="text/html; charset=UTF-8"pageEncoding="UTF-8"%>
<%-- 验证码登录页面，并自动刷新图片 --%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
</head>
<body><script type="text/javascript">function _change(){var imgEle = document.getElementById("img");//如果不加参数，IE浏览器中无法进行刷新验证码图片，因为浏览器缓存了请求的地址；所以要增肌参数，去实时进行请求参数，服务器不会获取参数imgEle.src = "/JavaWEB11/LoginCodeServlet?a=" + new Date().getTime();}
</script><% String message = "";String msg = (String)request.getAttribute("msg");if(msg != null)message = msg;
%>
<font color="red"><b><%=message %></b></font>
<form action="/JavaWEB11/LoginCodeVerifyServlet" method="post">
<table>
<tr>
<td>用户名:</td>
<td><input type="text" name="username" value="lisi" /></td>
</tr>
<tr>
<td>密码:</td>
<td><input type="password" name="password" /></td>
</tr>
<tr>
<td>验证码</td>
</tr>
<tr>
<td>请输入验证码</td>
<td><input type="text" name="code"></td>
</tr>
<tr>
<!-- 请求到 http://127.0.0.1:8081/JavaWEB11/LoginCodeServlet，返回验证码图片  -->
<td><img id="img" src="/JavaWEB11/LoginCodeServlet"/></td>
<td><a href="javascript:_change()">换一张</a></td>
</tr>
<tr>
<td><input type="submit" value="登录"></td>
</tr>
</table>
</form>
</body>
</html>

后台Servlet验证输入的验证码和生成验证码是否一致

package cn.test.javaweb12;
/** 验证验登录验证后台代码页面*/
import java.io.IOException;
import javax.servlet.ServletException;
import javax.servlet.annotation.WebServlet;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;/*** Servlet implementation class LoginCodeServlet*/
@WebServlet(name = "LoginCodeVerfiyServlet", urlPatterns = { "/LoginCodeVerfiyServlet" })
public class LoginCodeServlet extends HttpServlet {private static final long serialVersionUID = 1L;public LoginCodeServlet() {super();// TODO Auto-generated constructor stub}protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {// TODO Auto-generated method stub/** 校验验证码* 1.从session中获取正确的验证码* 2.从表单中获取用户填写的验证码* 3.进行比较* 4.如果相同，向下运行；否则保存错误信息到request域中，转发到登录页面*/request.setCharacterEncoding("utf-8");String code = request.getParameter("code");String sessionCode = (String) request.getSession().getAttribute("session_code");if(!code.equals(sessionCode)){request.setAttribute("msg", "验证码错误，请重新登录");//进行转发,转发的地址不需要包含项目名request.getRequestDispatcher("/session/loginFail2.jsp").forward(request, response);return;}String name = request.getParameter("username");String passwd = request.getParameter("password");request.getSession().setAttribute("name", name);//请求重定向的地址需要包含项目名response.sendRedirect("/JavaWEB11/session/loginSuccess.jsp");}}

输入验证码和后台验证码不一致，servlet转发登录失败的jsp页面

<%@ page language="java" contentType="text/html; charset=UTF-8"pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
<script type="text/javascript">
alert("你还没有登录呢");
</script>
</head>
<body>
<div><%=request.getAttribute("msg")%></div>
<%--
response.sendRedirect("/JavaWEB11/Login.jsp");
--%>
</body>
</html>

输入验证码和后台验证码一致，servlet转发登录成功的jsp页面

<%@ page language="java" contentType="text/html; charset=UTF-8"pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
</head>
<body>
<h2>登录成功</h2>
<%String name = (String)session.getAttribute("name");if(name == null){request.setAttribute("msg", "您还没有登录");request.getRequestDispatcher("/session/loginFail2.jsp").forward(request, response);return;}
%><div>欢迎<%=session.getAttribute("name") %>登录成功</div></body>
</html>

登录页面自动刷新验证码，并校验输入验证码和后台生成的验证码是否一致相关推荐

ajax局部刷新_web前端入门到实战：实现html页面自动刷新
使用场景: 页面需要定时刷新,实时加载数据,需要实时查看监控数据(H5中的WebSocket和SSE可以实现局部刷新) 一定时间之后跳转到指定页面(登录注册之类) 前端开发使用伪数据调试html页面( ...
angular ngoninit 刷新html页面_web前端入门到实战：实现html页面自动刷新
使用场景: 页面需要定时刷新,实时加载数据,需要实时查看监控数据(H5中的WebSocket和SSE可以实现局部刷新) 一定时间之后跳转到指定页面(登录注册之类) 前端开发使用伪数据调试html页面( ...
如何用ajax实现页面自动刷新,Ajax实现页面自动刷新实例解析
Ajax实现页面自动刷新实例解析内容精选换一换用户已创建桶并上传了网站文件.域名后缀目前支持的范围为2~6个英文大小写字母.开启CDN加速后,可配置网站加速.文件下载加速和点播加速.详细应用场景 ...
PBI Report Server 报表页面自动刷新 2步走
参考 PBI Report Server 报表页面自动刷新 - 知乎 (zhihu.com) 1.按F12调出调试工具,修改刷新按钮的id,改为c 2.打开控制台,输入以下代码运行,完工 setInt ...
html 设置页面刷新,HTML 页面自动刷新
学习就是一个不断积累的过程,每一天能够学到一点新东西说明自己就在进步!! HTML head 里面设置页面自动刷新功能兼容Ie 页面2s自动刷新一次代码: Document Hello world ...
Chrome页面自动刷新js脚本
Chrome的snippets是小脚本,还可以创作并在Chrome DevTools的来源面板中执行.您可以访问和从任何页面运行它们.当你运行一个片段,它从当前打开的页面的上下文中执行.本文主要讲如何 ...
页面自动刷新html实现
页面自动刷新当你做网页时,是不是有的时候想让你的网页自动不停刷新,或者过一段时间自动跳转到另外一个你自己设定的页面?其实实现这个效果非常地简单,而且这个效果甚至不能称之为特效.你只要把如下代码加入你 ...
自动刷新_AutoRefresh插件：开启页面自动刷新！
Auto Refresh 出于某种原因,在使用浏览器时我们可能需要每隔一段时间刷新一下网页. 例如在监视阅读量/下载量/评论,抢购新上市的手机和演唱会门票,查看网站更改进度这些场景中,如果都采用手动刷 ...
HTML 页面自动刷新
学习就是一个不断积累的过程,每一天能够学到一点新东西说明自己就在进步!! HTML head 里面设置页面自动刷新功能 <meta http-equiv="Refresh" ...

登录页面自动刷新验证码，并校验输入验证码和后台生成的验证码是否一致

登录页面自动刷新验证码，并校验输入验证码和后台生成的验证码是否一致相关推荐

最新文章

热门文章