关于验证码

关于验证码

通过alert方法,发现这里的问题首先在于,kcode一直是最初显示的那个验证码,不会随着刷新而接收到刷新后的新的验证码的值。

第二个问题是,输入的验证码和kcode验证码不一致,但每次还是能成功登陆,这是为什么?

<%@page contentType="text/html; UTF-8" pageEncoding="UTF-8" language="java" %>
<!DOCTYPE html>
<html>
<head>
<%--均可,均不必,因为已经在外部写了common.jsp--%>
<%--<base href="<%=basePath%>">--%>
<%--<base href="${basepath}">--%>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">

<title>登录页面</title>
<style type="text/css">
   .code 
   {
    font-family:Arial;
    font-style:normal;
    color:blue;
    font-size:20px;
    border:0;
    padding:2px 3px;
    letter-spacing:3px;
    font-weight:bolder;
    float:left;
    cursor:pointer;
    width:40px;
    height:20px;
    line-height:20px;
    text-align:center;
    vertical-align:middle;
   }
   a 
   {
    text-decoration:none;
    font-size:12px;
    color:#288bc4;
   }
   a:hover 
   {
    text-decoration:underline;
   }
</style>
</head>
<body >
<%
   String msg = "";
   if(request.getAttribute("msg")!=null){
      msg = (String)request.getAttribute("msg");
   }
%>
   <center>
      <h1>用户登录</h1>
      <h3><font color="red"><%=msg%></font></h3>
      <form action="<%=basePath%>/loginServlet" method="post"
           onsubmit="return validateCode()">
         <table width="300px" cellspacing="0px" cellpadding="0px" border="1px">
            <tr>
               <td>用户名</td>
               <td colspan="2">
                  <input type="text" name="username" pattern="[a-zA-Z_0-9]{3,12}"
                        required="required" placeholder="用户名为3-12位字母数字或下划线组合">
               </td>
            </tr>
            <tr>
               <td>密&nbsp;码</td>
               <td  colspan="2">
                  <input type="password" name="password" pattern="[a-zA-Z_0-9]{5,12}"
                        required="required" placeholder="长度为5-12位字母数字或下划线组合" >
               </td>
            </tr>
            <tr>
               <td>验证码</td>
               <td style="border-right-style:none; width: 150px">
                  <input type="text" name="checkCode" pattern="[a-zA-Z0-9]{4}"
                        required="required" placeholder="请输入验证码" id="inputCode">
               </td>
               <td style="border-left-style:none;">
                  <div class="code">
                     <img id="changeCode" src="http://localhost:8080/mook_course/kaptcha.jpg" />
                  </div>
               </td>
            </tr>
            <tr>
               <td colspan="3" style="text-align:center">
                  <input type="submit" value="登录">
                  <input type="reset" value="取消">
               </td>
            </tr>
         </table>
      </form>
   </center>
   <script src="js/jquery-3.3.1.min.js"></script>
   <script>
      $(function(){
         $("#changeCode").on("click",function(){
            $(this).attr("src","http://localhost:8080/mook_course/kaptcha.jpg?d="+new Date().getTime());
         });
      })
   </script>

   <%--检验验证码--%>
   <script type="text/javascript">
      function validateCode(){
         var inputCode = document.getElementById("inputCode").value.toLowerCase();
         var kcode = "<%=session.getAttribute("kcode")%>".toLowerCase();

         alert(inputCode);
         alert(kcode);

         if(inputCode.equals(kcode)){
            return true;
         }else{
            alert("验证码输入有误!");
            document.getElementById("inputCode").value="";
            return false;
         }
      }
   </script>
</body>
</html>


正在回答

登陆购买课程后可参与讨论,去登陆

2回答

同学你好,实验同学的代码,可以刷新验证码。如下代码处:

http://img1.sycdn.imooc.com//climg/5c9736a70001d3f506200096.jpg

kcode获取为null,问一下同学session中有kcode吗?

另外js中没有equals方法,这里同学可以使用==比较即可。

祝:学习愉快~

提问者 慕数据7156690 2019-03-24 16:55:33

web.xml里配置了的,把kcode放进sessionhttp://img1.sycdn.imooc.com//climg/5c9744f0000147f212260446.jpg


老师再试我的代码的时候,启动tomcat后,不关闭tomcat而是同步一下,然后重新进入登陆页面,就能发现能接收到验证码kcode。

但这时候还是跟之前一样,刷新验证码后并不能接收到新的kcode,而一直是原本的kcode。

就像下面这样,图一alert的是我输入的值,图二alert的是session中存的kcode

http://img1.sycdn.imooc.com//climg/5c9745e90001582211100944.jpg


http://img1.sycdn.imooc.com//climg/5c9745f800015fc110440886.jpg

  • 同学你好,按照同学的配置的试了下,发现session中存放的kcode的值是不变的,所以不能使用在web.xml中配置kcode的方式校验输入的验证码是否正确。祝:学习愉快~
    2019-03-25 10:58:36
  • 提问者 慕数据7156690 回复 好帮手慕阿满 #2
    不能吗?可是老师课上不就是这么讲的吗
    2019-03-25 11:37:10
  • 好帮手慕阿满 回复 提问者 慕数据7156690 #3
    抱歉同学,可以在web.xml中配置kcode,但是在index.jsp获取kcode值时,不能获取刷新后的值,所以不建议使用这种方式。可以将输入的用户名、密码、验证码等信息提交,在LoginServlet中获取提交过来的信息,以及使用String kcode= (String) request.getSession().getAttribute(com.google.code.kaptcha.Constants.KAPTCHA_SESSION_KEY);这种方式获取实时的验证码的值。再对验证码进行校验。祝:学习愉快~
    2019-03-25 18:34:38
问题已解决,确定采纳
还有疑问,暂不采纳

恭喜解决一个难题,获得1积分~

来为老师/同学的回答评分吧

0 星
从网页搭建入门Java Web2018版
  • 参与学习           人
  • 提交作业       1088    份
  • 解答问题       10205    个

如果你有Java语言基础,又想以后从事Java Web开发,那么本路径是你的不二选择!本路径从网页搭建开始入手,通过大量案例来学习Java Web基础。定能助你完成Java Web小白的蜕变!

了解课程
请稍等 ...
意见反馈 帮助中心 APP下载
官方微信

在线咨询

领取优惠

免费试听

领取大纲

扫描二维码,添加
你的专属老师