我做的验证码是讲请求发送到本页面进行判断的,就像这样:
在index.jsp页面上:
<%out.println(session.getAttribute("randomCode")); %>
<body>
<form method="POST" action="index.jsp">
<tr><td>验证码:</td><td> <input id="random" type="text" name="random" maxlength="4"></td>
<a href="#"> <img id="imchange" src="RandomCodeServlet" οnclick="imgchange()"></a></tr>
<tr> <td><input type="submit" value="提交"></td> </tr>
</form>
<script>
function imgchange(){document.getElementById("imchange").src="RandomCodeServlet";} //id不能与function名一样
</script>
<%if(request.getParameter("random")!=null)
{
if(request.getParameter("random").equals(session.getAttribute("randomCode")))
{
out.println("ok");
}
else{
out.println("no ok");
}
} %>
<br>
ps: 由于session比图片数字晚一步可知一个页面是先加载jsp代码再加载img中的src属性跳转到servlet,action要post到本页面(即index.jsp)相当于刷新一次
</body>
</html>
img的src来自RandomCodeServlet的servlet中,里面的代码跟网上画验证码图一样,这里就不贴出。
这算是最原始的做法,没有用到ajax提交。
之后我试下用ajax提交,而不是form方式提交,这里的问题是我是用提交到本页面,出来的data就出现问题了,不只是out的数据,它连原始的代码也打出来了,就像这样
<body> <script type="text/javascript" src="http://lib.sinaapp.com/js/jquery/1.7/jquery.js"></script> <tr><td>验证码:</td><td> <input id="random" type="text" name="random" maxlength="4"></td> <a href="#"> <img id="imchange" src="RandomCodeServlet" οnclick="imgchange()"></a></tr> <tr> <td><input id="submit" type="button" value="提交"></td> </tr> <div id="info"></div> <script>$(document).ready(function(){ $("#submit").click(function(){ var code = $("#random").attr("value"); $.post("index.jsp", { random:code, }, function(data){ alert(data); }); });});</script> <script> function imgchange(){document.getElementById("imchange").src="RandomCodeServlet";} //id不能与function名一样 </script> <% if(request.getParameter("random")!=null){if(request.getParameter("random").equals(session.getAttribute("randomCode"))){out.println("ok");}else{out.println("no ok");}} %><br>ps: 由于session比图片数字晚一步可知一个页面是先加载jsp代码再加载img中的src属性跳转到servlet,action要post到本页面(即index.jsp)相当于刷新一次 </body><%out.println(session.getAttribute("randomCode")); %>
可是按提交后出来的是:
现在奇怪的是上面的提交按钮可用,但下面的就不可用了~~后来知道,原来是页面是先处理jsp代码后才处理js等其他请求。
注意:最典型的就是“/*”错误地拦截了其他的映射为无后缀名的Servlet请求,Struts2默认将“*.action”或者无后缀的URL当做Action ,因此,在struts框架下使用sevlet来传输验证码是会被struts拦截,之后报
There is no Action mapped for namespace / and action name veriftcode。。。我的解决办法是将整个代码移植到jsp上,因为有.jsp后缀,因此成功传送验证,最后要记得 out.clear();
out = pageContext.pushBody();否则点击图片更新src时会报getOutputStream() has already been called for this response。。