zoukankan      html  css  js  c++  java
  • 随机验证码实现案例

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

       建立一个javawebproject,新建login.html,在里面主要是写界面,代码实现例如以下,写在body区就能够了。来一个表单验证

    <body>
        <form action="">
        	username:<input/><br/>
        	password:<input/><br/>
        	验证码:<input name="code"/><img id="image1" src="/day08_response/servlet/responseDemo4"/>
        		<input type="button" value="看不清。换一张" onclick="change()"/>
        	<br/>
        	<input type="submit" value="登陆"/>
        </form>
        <script type="text/javascript">
        	function change(){
        		var imageObj = document.getElementById("image1");
        		//地址一样,浏览器不会发出请求
        		imageObj.src="/day08_response/servlet/responseDemo4?time="+new Date().getTime();
        	}
        </script>
      </body>


    然后我们须要新建一个servlet类,实现验证码我们能够有两种方式,一种是自己写。例如以下:颜色能够直接配置就好,好吧。鉴于我的审美观有限,貌似这样的颜色搭配起来挺丑的。

    private void test1(HttpServletResponse response) throws IOException {
    		int width=110;
    		int height=25;
    		//1构建一幅内存图片BufferedImage
    		BufferedImage bi=new BufferedImage(width, height, BufferedImage.TYPE_INT_BGR);
    		
    		//3.图片上的画笔
    		Graphics g=bi.getGraphics();
    		g.setColor(Color.green);
    		g.drawRect(0, 0, width, height);   //画矩形边线
    		
    		//4填充背景色
    		g.setColor(Color.gray);
    		g.fillRect(1, 1, width, height);
    		
    		//5干扰线
    		g.setColor(Color.yellow);
    		Random r=new Random();
    		for(int i=0;i<20;i++)
    			g.drawLine(r.nextInt(width), r.nextInt(height),r.nextInt(width), r.nextInt(height));
    		
    		//6数字验证码
    		g.setColor(Color.BLACK);
    		g.setFont(new Font("宋体",Font.BOLD|Font.ITALIC,13));//加粗倾斜
    		int x=20;
    		for(int i=0;i<4;i++){
    			g.drawString(r.nextInt(10)+"",x,20);
    			x+=20;
    		}	
    		//2输出响应对象的字节流输出流
    		ImageIO.write(bi, "jpg", response.getOutputStream());
    	}

    另一种方法能够使用,开源框架validate.jar,导入这个jar包。两行代码就能够搞定,当然了,假设你想要更好的效果。你能够自己写或者看里面的.class中的源代码,自己进行改动,这里就不在多废话了。

    //开源框架实现
    		ValidateCode vc=new ValidateCode(110, 25, 4, 30);//第一个參数是宽,第二个是高,第三个是验证码的数目。第四个是干扰线的条数
    		vc.write(response.getOutputStream());

    最后。我们还须要清除一下浏览器的缓存,我们都知道,清除缓存当然是用那三种方法啦。

    //清除缓存
    		response.setIntHeader("Expires", -1);
    		response.setHeader("Cache-Control", "no-cache");
    		response.setHeader("Pragma", "no-cache");

    哦?你还不惬意。好吧,那我们再加一个定时刷新的功能吧!

    第一种刷新方式是直接刷新:

    private void test1(HttpServletResponse response) throws IOException {
    		response.setIntHeader("Refresh", 1);//单位是秒
    		Random r = new Random();
    		response.getWriter().write(r.nextInt()+"");
    	}
    当然,我们还能够来那种倒计时几秒钟就跳转到其它页面的这样的效果。

    //刷新到别处
    	private void test2(HttpServletResponse response) throws IOException {
    		response.setContentType("text/html;charset=UTF-8");
    		response.getWriter().write("注冊成功!2秒后自己主动转向登陆页面。");
    		response.setHeader("Refresh", "2;URL=/day08_response/login.html");//单位是秒
    	}
    以下再来说一下控制浏览器缓存时间的实现方法:

    response.setDateHeader("Expires", System.currentTimeMillis()+1*60*60*1000);//取值是一个毫秒值。假设该值小于当前时间,则不缓存。
    												//假设大于当前时间,缓存的时间是:值-当前时间。
    		response.getWriter().write("hello");

    好吧,基本上说完了,将以上知识整个起来就能够实现你的一个项目的功能了,快去试试吧。

  • 相关阅读:
    javaScript事件(二)事件处理程序
    【前端】模糊图片
    【前端】js转码
    【翻译】Sencha Touch2.4 The Layout System 布局
    Sencha Touch 2.4 callParent() 用法
    2015 WEB前端学习路线图
    Nodejs Express 4.X 中文API 4--- Router篇
    Nodejs Express 4.X 中文API 3--- Response篇
    Nodejs Express 4.X 中文API 2--- Request篇
    Nodejs Express 4.X 中文API 1--- Application篇
  • 原文地址:https://www.cnblogs.com/mfmdaoyou/p/7207246.html
Copyright © 2011-2022 走看看