关于JavaWeb验证码（数字）登入界面设计

最新推荐文章于 2024-05-10 21:41:13 发布

酷酷滴Q

最新推荐文章于 2024-05-10 21:41:13 发布

阅读量2.4k

点赞数 6

分类专栏： JavaWeb设计文章标签： servlet java javascript

本文链接：https://blog.csdn.net/m0_65420451/article/details/127471062

版权

JavaWeb 验证码登录验证 Servlet JSP

关键词由CSDN通过智能技术生成

JavaWeb设计专栏收录该内容

4 篇文章 3 订阅

订阅专栏

提示：文章写完后，目录可以自动生成，如何生成可参考右边的帮助文档

题目：

代码：

1.loginForm.jsp（登入界面）

2.validate.jsp(验证码生成）

3.ValidateServlet.java(Servlet文件，处理验证码是否正确)

4.web.xml（配置Servlet文件才能运行）

题目：

关于Javaweb的登入界面设置验证码，数字类型的验证，有登入界面loginForm.jsp，具有刷新验证码效果，生成验证码界面validate.jsp，Servlet文件ValidateServlet.java，处理验证码是否正确并返回结果，其次web.xml文件为Servlet的配置，让Servlet正常运行，最后测试验证。

代码：

1.loginForm.jsp（登入界面）

<%@ page language="java" contentType="text/html; charset=utf-8" pageEncoding="utf-8"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>title</title>
<style>
</style>
</head>
<body>
    <script type="text/javascript">
    function refresh()
    {
    	
    	loginForm.imgValidate.src="validate.jsp?id="+Math.random();
    
    }
    </script>
	欢迎登入本系统<br>
	<form action="servlet/ValidateServlet" method="post" name="loginForm">
	请输入账号：<input type="text" name="account"><br>
	请输入密码：<input type="password" name="password"><br>
	验证码：<input type="text" name="code" size="10">
	<img name="imgValidate" src="validate.jsp" onclick="refresh()"alt="看不清楚">
	<a href="javascript: refresh()">看不清,换一张</a>
	<br>
	<input type="submit" value="登入">
	</form>
</body>
</html>

2.validate.jsp(验证码生成）

<%@ page language="java"
    import="java.awt.*"
    import="java.awt.image.BufferedImage"
    import="java.util.*"
    import="javax.imageio.ImageIO"
    pageEncoding="GB2312"
 %>
<!DOCTYPE html>
<body>
	<%
	response.setContentType("image/jpeg;charsert=utf-8");//关键，防止图片变成乱码
	 response.setHeader("Cache-Control","no-cache");
	//在内存中创建图像
	int width=60,height=20;
	BufferedImage image=new BufferedImage(width,height,BufferedImage.TYPE_INT_RGB);
	//获取笔画
	Graphics g=image.getGraphics();
	//设置背景
	g.setColor(new Color(200,200,200));
	g.fillRect(0, 0, width, height);
	//随机产生的验证码（4位数）
	Random rnd=new Random();
	int randNum=rnd.nextInt(8999)+1000;
	String randStr=String.valueOf(randNum);
	//将验证码存入session
	session.setAttribute("randStr",randStr);
	//将验证码显示到图像中
	g.setColor(Color.black);
	g.setFont(new Font(" ",Font.PLAIN,20));
	g.drawString(randStr, 10, 17);
	//随机产生100个干扰点，是图像中的验证码不易被其他程序探测到
	for(int i=0;i<100;i++)
	{
		int x=rnd.nextInt(width);
		int y=rnd.nextInt(height);
		g.drawOval(x, y, 1, 1);
	}
	//输出到图像页面
	ImageIO.write(image,"JPEG",response.getOutputStream());
	out.clear();
	out=pageContext.pushBody();
	%>
	</body>
	</html>

3.ValidateServlet.java(Servlet文件，处理验证码是否正确)

提示:这里个文件，还可以处理密码和账号是否正确，然后再决定成功登入系统页面。

package beans;

import java.io.IOException;
import java.io.PrintWriter;
import javax.servlet.http.HttpSession;
import javax.servlet.ServletException;
import javax.servlet.annotation.WebServlet;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;

@WebServlet("/ValidateServlet")
public class ValidateServlet extends HttpServlet {
	private static final long serialVersionUID = 1L;
	protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
		// TODO Auto-generated method stub
	String code=request.getParameter("code");
		HttpSession session=request.getSession();
		String randStr=(String)session.getAttribute("randStr");
		response.setCharacterEncoding("gb2312");
		PrintWriter out=response.getWriter();
		if(!code.equals(randStr))
		{
			out.println("验证码错误！");
			
		}
		else
		{
			out.println("验证码正确！跳转到longinserlet...");
		}
		
		
	}

}

4.web.xml（配置Servlet文件才能运行）

提示：只看ValidateServlet.java文件，其它的是多余出来的。

以下文件中， <servlet-class>beans.ValidateServlet</servlet-class>，beans是包名，ValidateServlet是java的类名，其它的不变。

<?xml version="1.0" encoding="UTF-8"?>
<web-app xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xmlns="http://java.sun.com/xml/ns/javaee" xsi:schemaLocation="http://java.sun.com/xml/ns/javaee http://java.sun.com/xml/ns/javaee/web-app_3_0.xsd" version="3.0">
  <display-name>T2</display-name>
  <welcome-file-list>
    <welcome-file>index.html</welcome-file>
    <welcome-file>index.htm</welcome-file>
    <welcome-file>index.jsp</welcome-file>
    <welcome-file>default.html</welcome-file>
    <welcome-file>default.htm</welcome-file>
    <welcome-file>default.jsp</welcome-file>
  </welcome-file-list>
  </servlet>
  <servlet>
    <servlet-name>ValidateServlet</servlet-name>
    <servlet-class>beans.ValidateServlet</servlet-class>
  </servlet>
  <servlet-mapping>
    <servlet-name>ValidateServlet</servlet-name>
    <url-pattern>/servlet/ValidateServlet</url-pattern>
  </servlet-mapping>
</web-app>

效果截图：

登入界面：

登入成功：

登入失败：

总结

提示：这里对文章进行总结：
例如：以上就是今天要讲的内容，本文仅仅简单介绍了关于JavaWeb验证码（数字）登入界面设计。

酷酷滴Q

关注

6
点赞
踩
49

收藏

觉得还不错? 一键收藏
打赏
0
评论
关于JavaWeb验证码（数字）登入界面设计

关于Javaweb的登入界面设置验证码，数字类型的验证，有登入界面loginForm.jsp，具有刷新验证码效果，生成验证码界面validate.jsp，Servlet文件ValidateServlet.java，处理验证码是否正确并返回结果，其次web.xml文件为Servlet的配置，让Servlet正常运行，最后测试验证。本文仅仅简单介绍了关于JavaWeb验证码（数字）登入界面设计。
复制链接

扫一扫