共计 2918 个字符，预计需要花费 8 分钟才能阅读完成。
1、验证码有啥用
在我们注册时，如果没有验证码的话，我们可以使用 URLConnection 来写一段代码发出注册请求。甚至可以使用 while(true)来注册！那么服务器就废了！
验证码可以去识别发出请求的是人还是程序！当然，如果聪明的程序可以去分析验证码图片！但分析图片也不是一件容易的事，因为一般验证码图片都会带有干扰线，人都看不清，那么程序一定分析不出来。
2、VerifyCode 类
现在我们已经有了 cn.itcast.utils.VerifyCode 类，这个类可以生成验证码图片！下面来看一个小例子。
| public void fun1() throws IOException { | |
| // 创建验证码类 | |
| VerifyCode vc = new VerifyCode(); | |
| // 获取随机图片 | |
| BufferedImage image = vc.getImage(); | |
| // 获取刚刚生成的随机图片上的文本 | |
| String text = vc.getText() ; | |
| System.out.println(text); | |
| // 保存图片 | |
| FileOutputStream out = new FileOutputStream("F:/xxx.jpg"); | |
| VerifyCode.output(image, out); | |
| } |
3、在页面中显示动态图片
我们需要写一个 VerifyCodeServlet，在这个 Servlet 中我们生成动态图片，然后它图片写入到 response.getOutputStream()流中！然后让页面的 元素指定这个 VerifyCodServlet 即可。
VerifyCodeServlet
| public class VerifyCodeServlet extends HttpServlet {public void doGet(HttpServletRequest request, HttpServletResponse response) | |
| throws ServletException, IOException {VerifyCode vc = new VerifyCode(); | |
| BufferedImage image = vc.getImage(); | |
| String text = vc.getText(); | |
| System.out.println("text:" + text); | |
| VerifyCode.output(image, response.getOutputStream()); | |
| } | |
| } |
index.jsp
| <script type="text/javascript"> | |
| function _change() {var imgEle = document.getElementById("vCode"); | |
| imgEle.src = "/day06_6/VerifyCodeServlet?" + new Date().getTime(); | |
| } | |
| </script> | |
| ... | |
| <body> | |
| <h1> 验证码 </h1> | |
| <img id="vCode" src="/day06_6/VerifyCodeServlet"/> | |
| <a href="javascript:_change()"> 看不清，换一张 </a> | |
| </body> |
4、在注册页面中使用验证码
| <form action="/day06_6/RegistServlet" method="post"> | |
| 用户名：<input type="text" name="username"/><br/> | |
| 验证码：<input type="text" name="code" size="3"/> | |
| <img id="vCode" src="/day06_6/VerifyCodeServlet"/> | |
| <a href="javascript:_change()"> 看不清，换一张 </a> | |
| <br/> | |
| <input type="submit" value="Submit"/> | |
| </form> |
5、RegistServlet
修改 VerifyCodeServlet
| public class VerifyCodeServlet extends HttpServlet {public void doGet(HttpServletRequest request, HttpServletResponse response) | |
| throws ServletException, IOException {VerifyCode vc = new VerifyCode(); | |
| BufferedImage image = vc.getImage(); | |
| request.getSession().setAttribute("vCode", vc.getText()); | |
| VerifyCode.output(image, response.getOutputStream()); | |
| } | |
| } |
RegistServlet
| public class RegistServlet extends HttpServlet {public void doPost(HttpServletRequest request, HttpServletResponse response) | |
| throws ServletException, IOException {request.setCharacterEncoding("utf-8"); | |
| response.setContentType("text/html;charset=utf-8"); | |
| String username = request.getParameter("username"); | |
| String vCode = request.getParameter("code"); | |
| String sessionVerifyCode = (String)request.getSession().getAttribute("vCode"); | |
| if(vCode.equalsIgnoreCase(sessionVerifyCode) ) {response.getWriter().print(username + ", 恭喜！注册成功！"); | |
| } else {response.getWriter().print("验证码错误！"); | |
| } | |
| } | |
| } |
6、总结验证码案例
VerifyCodeServlet：
生成验证码：VerifyCode vc = new VerifyCode(); BufferedImage image = vc.getImage()；
在 session 中保存验证码文本：request.getSession.getAttribute(“vCode”, vc.getText())；
把验证码输出到页面：VerifyCode.output(image, response.getOutputStream)；
regist.jsp：
表单中包含 username 和 code 字段；
在表单中给出 指向 VerifyCodeServlet，用来在页面中显示验证码图片；
提供“看不清，换一张”链接，指向_change()函数；
提交到 RegistServlet；
RegistServlet：
获取表单中的 username 和 code；
获取 session 中的 vCode；
比较 code 和 vCode 是否相同；
相同说明用户输入的验证码正确，否则输入验证码错误。
