您的位置:首页 > Web前端 > JavaScript

jsp登陆验证码

2017-05-27 10:05 162 查看
1.JSP页面中设置输入选项和验证码

<form action=login.do" method="post" >

<div class="line_1" >

  <span class="line_1_span">会员登录</span>

  <input type="text" class="form-control line_2_input" id="exampleInputAmount" placeholder="手机号" name="username">

</div>

<div class="line_3" >

  <input type="password" class="form-control line_3_input" id="exampleInputPassword3" placeholder="密码" name="password">

</div>

<div class="line_4">

  <input type="text"  placeholder="验证码" name="code">
<img id="code" alt="点击刷新" src="code.do" onclick="refreshCode()"/>

</div>

</form>

2.login.jsp中设置JS的方法

<script type="text/javascript">

function refreshCode(){

  var codeImg = document.getElementById("code");

  var rand = Math.random();

  codeImg.src="code.do?random="+rand;

}

</script>

3.配置XML文件

 



<?xml version="1.0" encoding="UTF-8"?>
<web-app xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xmlns="http://xmlns.jcp.org/xml/ns/javaee" xsi:schemaLocation="http://xmlns.jcp.org/xml/ns/javaee http://xmlns.jcp.org/xml/ns/javaee/web-app_3_1.xsd" id="WebApp_ID" version="3.1">
<display-name>D5.10_yanzhengma</display-name>
<servlet>
<servlet-name>code.do</servlet-name>
<servlet-class>com.phone1000.lq.yanzheng.CodeServlet</servlet-class>
</servlet>
<servlet-mapping>
<servlet-name> code.do</servlet-name>
<url-pattern>/code.do</url-pattern>
</servlet-mapping>

</web-app>


 

4.servlet中代码如下

 



import java.awt.Color;
import java.awt.Font;
import java.awt.Graphics;
import java.awt.image.BufferedImage;
import java.io.IOException;
import java.util.Random;

import javax.imageio.ImageIO;
import javax.servlet.ServletException;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
/**
*
* @author lq
*
*/
public class CodeServlet extends HttpServlet{
public static final int NUMBER = 5;
//1,0,l,容易混淆故去掉这几个字符
String strs = "qwertyuipasdfghjkzxcvbnm23456789一二三四五六七八九";
@Override
protected void doGet(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
//创建模板大小
BufferedImage bufferImage = new BufferedImage(100, 40, BufferedImage.TYPE_INT_RGB);
//创建画笔
Graphics graphics = bufferImage.getGraphics();
//调整画笔颜色
graphics.setColor(Color.green);
//设置画笔初始位子和可画区域大小
graphics.fillRect(0, 0, 100, 40);
int size = strs.length();
char[] codes = new char[NUMBER];
Random random = new Random();
graphics.setFont(new Font("宋体", Font.PLAIN, 16));
for (int i=0; i<NUMBER; i++){
int index = random.nextInt(size);
Character c = strs.charAt(index);
codes[i]=c;
graphics.setColor(Color.BLUE);
//画出单个字符大小位置
graphics.drawString(c.toString(),i*20,30);
}
//将生成的验证码字符串保存在session中
req.getSession().setAttribute("code", new String(codes));
//回收资源
graphics.dispose();
//显示图像及格式
ImageIO.write(bufferImage, "png", resp.getOutputStream());

}

@Override
protected void doPost(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
doGet(req,resp);
}
}


内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: