当前位置:Gxlcms > JavaScript > Ajax+Struts2实现验证码验证功能(图文教程)

Ajax+Struts2实现验证码验证功能(图文教程)

时间:2021-07-01 10:21:17 帮助过:20人阅读

这篇文章主要介绍了Ajax+Struts2实现验证码验证功能实例代码的相关资料,非常不错,具有参考借鉴价值,需要的朋友可以参考下

众所周知,验证码在我们的生活中都是非常常见的,很多公司都在各种折腾各种各样的验证码,这里简要的用一个小案例来实现验证码的功能(ps:其实我挺讨厌验证码这个东西的)。

今天分享的是通过ajax来动态的验证验证码输入是否正确。我们这里采用的是ajax+struts2来做的这个验证。 我们新建一个web工程。然后需要导入struts的相应包。之后我们需要写一个类来生成验证码。

这里命名为01_image.jsp,这类的主要功能就是生成验证码,里面是各种画线条,随机数字等,我这里设置的是5个数字的验证,如果你想要改成其他的也可以,大致思路就是在生成数字的那个循环那里加上字母就可以了。

输出流输出 ImageIO.write(image,"jpeg",response.getOutputStream()); out.clear(); out = pageContext.pushBody(); %>

接下来把输入验证码的html页面写好,我这里是些在了一个jsp文件中的。命名为checkcode.jsp

<th>验证码:</th>
<td><input type="text" name="checkcode" id="checkcodeID" maxlength="5" /></td>
<td><img src="01_image.jsp" id="imgID" /></td>
<td id="resID"></td>
</tr> 
</table>
</form>

然后给这个文件添加javascript代码,这里使用的当然就是一个ajax啦,对于ajax的编码步骤之前已经写的很详细了,所以我们这里就直接使用了。 对于ajax.js写好后放到js目录下面,然后再找个checkcode.jsp中引入中国js文件 ajax.js的内容:

然后就是chenkcode中的js内容了

然后开始写服务器端的代码,进行校验的话就需要这样的一个类了:

输出到ajax异步对象中 HttpServletResponse response=ServletActionContext.getResponse(); response.setContentType("text/html;charset=UTF-8"); PrintWriter pw=response.getWriter(); pw.write(tip); pw.flush(); pw.close(); return null; } }

最后在struts.xml文件中写入相应的方法。

<struts>
<package name="myPackage" extends="struts-default" namespace="/"> 
<action 
name="checkRequest" 
class="cn.tf.checkcode.CheckcodeAction" 
method="check">
</action>
</package>
</struts>

运行结果如下:验证成功则返回绿色的小勾,错误则红色的叉。

上面是我整理给大家的,希望今后会对大家有帮助。

相关文章:

Ajax点击不断加载数据列表(图文教程)

浅谈ajax请求技术

非常实用的ajax用户注册模块

以上就是Ajax+Struts2实现验证码验证功能(图文教程)的详细内容,更多请关注Gxl网其它相关文章!

人气教程排行