验证码是一个很常见的一个功能,验证码可以防止黑客通过某种手段无间隔的注册等等
验证码是通过服务器端生成的一张图片,传到客户端
具体实现步骤(流程):
1)由服务器端比如servlet,随机产生几个字符数字等等,把这几个字符拼接成一个字符串,存到session域中
2)以图片的方式传给客户端,验证码上的具体值是在服务器端验证的,如果具体值在客户端验证的话,恐怕不太方便比如第一次访问静态登录界面的话,去取session的值是为空的,除非你再次刷新整个页面
3)客户端对验证码,验证是否为空,输入的字符的长度是否达到标准,
4)把输入的验证码传到服务器端,服务端在session中取到值,做具体判断
5)根据输入对否,跳转到另一界面,如果输入错误,一般跳回当前界面,验证码改变又被刷新一次
具体实现的页面:
产生验证码的 Response_3类 参考-------->点击打开链接
- <%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
- <%
- String path = request.getContextPath();
- String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
- %>
- <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
- <html>
- <head>
- <base href="<%=basePath%>">
- <title>My JSP 'ValidateLogin.jsp' starting page</title>
- <meta http-equiv="pragma" content="no-cache">
- <meta http-equiv="cache-control" content="no-cache">
- <meta http-equiv="expires" content="0">
- <meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
- <meta http-equiv="description" content="This is my page">
- <!--
- <link rel="stylesheet" type="text/css" href="styles.css">
- -->
- </head>
- <BODY style="background-color:66CCFF" >
- <table cellspacing="10"
- border=1 background="" align="center">
- <tr>
- <td>
- <b style="font-size:20;color:green;" >会员--登录</b>
- <hr width=220 align=left>
- <form name=form1 Action="LoginServlet" method="get" >
- <br />
- 用户名:
- <input type="text" name="usename" value=543806053@qq.com size=19 maxlength=16 />
- <br />
- <br />
- 密 码:
- <input type="password" name="password" maxlength=16 />
- <br /><br />
- 认证码: <input type="text" name="validateValue" size=19 onblur="checkVlidte(this)"/><br>
- <img id="image" src="servlet/Response_3"/>
- <a href="javascript:changeimage()" >看不清?换一张</a>
- <br /><br />
- <br /><br />
- <input type="submit" value="登录"/>
- <input type="reset" value="重置" />
- <hr width=220 align=left>
- </form>
- </td>
- </tr>
- </table>
- </body>
- <script type="text/javascript">
- function validate_required(field,alerttxt)
- {
- with(field)
- {
- /*if(value==null||value=="")
- {
- alert(alerttxt);
- return false ;
- }
- else
- return true ;
- */
- i = value.indexOf("@"); //邮箱认证
- j = value.lastIndexOf(".");
- if(i < 1 || j-i <2)
- {
- alert(alerttxt) ;
- return false ;
- }
- else
- return true ;
- }
- }
- function password_validate (_pass,alerttxt)
- {
- with(_pass)
- {
- if(value!="")
- return true ;
- else
- {
- alert(alerttxt) ;
- return false ;
- }
- }
- }
- function validate_form(thisform)
- {
- with(thisform)
- {
- if(validate_required(name1,"请输入有效的邮箱账号!") == false)
- {
- name1.focus();
- return false ;
- }
- if(password_validate(pass,"请输入正确的密码!") == false)
- {
- pass.focus();
- return false ;
- }
- }
- }
- </script>
- <script type="text/javascript">
- function proving()
- {
- if(form1.pass.value!="")
- window.open("http://www.baidu.com/","_self");
- else
- window.open("http://www.google.com/","_self");
- }
- </script>
- <!--认证码按钮脚本-->
- <script type="text/javascript">
- function changeimage()
- {
- var img = document.getElementById("image") ;
- if(img)
- img.src=img.src+ "?" + new Date().getTime();
- }
- function checkVlidte(object)
- {
- if(object.value.length != 4 )
- {
- alert("验证码错误!");
- //object.focus() ;//重新定位到该输入框
- //object.select() ;//把已有的内容选中
- }
- }
- </script>
- </html>
服务器端验证,这里只对验证码进行验证
- package cn.request;
- import java.io.IOException;
- import java.io.PrintWriter;
- import javax.servlet.ServletException;
- import javax.servlet.http.HttpServlet;
- import javax.servlet.http.HttpServletRequest;
- import javax.servlet.http.HttpServletResponse;
- //主要 服务器端验证码 的验证
- public class LoginServlet extends HttpServlet {
- public void doGet(HttpServletRequest request, HttpServletResponse response)
- throws ServletException, IOException {
- this.doPost(request, response);
- }
- public void doPost(HttpServletRequest request, HttpServletResponse response)
- throws ServletException, IOException {
- String usename = request.getParameter("usename");
- String password = request.getParameter("password");
- String validateValue = request.getParameter("validateValue");
- String vv = (String)request.getSession().getAttribute("validateValue");
- //把验证码全转为小写在进行比较
- if( (validateValue.toLowerCase()).equals(vv.toLowerCase()) )
- {
- response.sendRedirect("index.jsp");
- }
- else
- {
- request.getRequestDispatcher("ValidateLogin.jsp").forward(request, response);
- }
- }
- }