java实现动态验证码源代码——jsp页面-阿里云开发者社区

java实现动态验证码源代码——jsp页面

2023-05-16 136

版权

本文内容由阿里云实名注册用户自发贡献，版权归原作者所有，阿里云开发者社区不拥有其著作权，亦不承担相应法律责任。具体规则请查看《阿里云开发者社区用户服务协议》和《阿里云开发者社区知识产权保护指引》。如果您发现本社区中有涉嫌抄袭的内容，填写侵权投诉表单进行举报，一经查实，本社区将立刻删除涉嫌侵权内容。

简介： java实现动态验证码源代码——jsp页面

我们通常在其他网站注册或者登陆的时候会发现一个很高大上的验证码，那么怎么用java代码实现呢？下面我给大家贴一下我写的方法：

此文章是写的前台jsp页面的代码：

<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>
<%@ taglib uri="/struts-tags" prefix="s" %>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
<%
  String tag=request.getParameter("tag");
  request.setAttribute("tag",tag);
 %>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
    <base href="<%=basePath%>">
    <title>用户登录</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">
  -->
  <link href="<%=basePath%>css/common.css" rel="stylesheet" type="text/css" />
  <link href="<%=basePath%>css/style.css" rel="stylesheet" type="text/css" />
  <script type="text/javascript" src="js/jquery-1.8.3.js"></script>
  <script type="text/javascript">
  $(function(){
    if(${tag == 'nologin'}){
      alert("对不起，您还没有登录,请先进行登录");
    }
  });
  </script>
  <script type="text/javascript" >
    $(function(){
      //注册
      $("#register").click(function(){
        location.href="register.jsp";
      });
      //验证码
      $("#changeCode").click(function(event){
        $("#validateCode").attr("src","Number.jsp?ran"+Math.random());
        event.preventDefault();
        return false; 
      });
      //判断验证码输入是否正确
       $("#passwords").blur(function(){
        $.post(
          "doNumrand.jsp",
          "inputCode="+$("#passwords").val(),
          function(result){
            if($.trim(result)=="true"){
              $("#cl").html("<span style='color:green'>验证码正确</span>");  
            }else{
              $("#cl").html("<span style='color:red'>验证码错误</span>");  
            }
          }
        );
      }); 
    });
  </script>
  <script type="text/javascript">
    <%
      String msg = request.getParameter("msg");
      if("registerSuccess".equals(msg)){
        out.print("alert('注册成功，系统将自动跳转登录页');");
      }
      if("loginError".equals(msg)){
        out.print("alert('用户名密码错误，请重新登录');");
      }
      if("validateCodeError".equals(msg)){
        out.print("alert('验证码错误，请重新输入');");
      }
    %>  
  </script>
  </head>
<body>
<div class="wrap">
<!-- main begin-->
 <div class="main">
   <div class="sidebar">
     <p><img src="images/img1.jpg" width="443" height="314" alt="" /></p>
   </div>
   <div class="sidebarg">
     <form action="login.action" method="post">
    <div class="login">
      <span style="color:red"><s:property value="msg"/></span>
      <dl>
        <dt class="blues">用户登陆</dt>
        <dd><label for="name">用户名：</label>
          <input type="text" name="auctionuser.username" class="inputh" value="${username}" id="name"/></dd>
        <dd><label for="password">密 码：</label>
          <input type="password" name="auctionuser.userpassword" class="inputh" value="${userpassword}" id="password"/></dd>
        <dd>
           <label class="lf" for="passwords">验证码：</label>
           <input type="text" name="inputCode" class="inputh inputs lf" value="" id="passwords"/>
           <span class="wordp lf"><img id="validateCode" src="Number.jsp" width="96" height="27" alt="" /></span>
           <span class="blues lf"><a id="changeCode" href="javascript:void(0);" title="">看不清</a>    <a id="cl"></a></span>
        </dd>
        <dd>
           <input name=""  type="checkbox" id="rem_u"  />
           <span class="rem_u">下次自动登录</span>
        </dd>
        <dd class="buttom">
           <input name="" type="submit" value="登 录" class="spbg buttombg f14 lf" />
           <input id="register" name="" type="button" value="注 册" class="spbg buttombg f14 lf" />
           <span class="blues  lf"><a href="" title="">忘记密码?</a></span>
           <div class="cl"></div>
        </dd>
      </dl>
    </div>
    </form>
   </div>
  <div class="cl"></div>
 </div>
<!-- main end-->
<!-- footer begin-->
</div>
 <!--footer end-->
</body>
</html>