DDR爱好者之家 Design By 杰米

JSP 制作验证码的实例详解

 验证码

  验证码(CAPTCHA)是“Completely Automated Public Turing test to tell Computers and Humans Apart”(全自动区分计算机和人类的图灵测试)的缩写,是一种区分用户是计算机还是人的公共全自动程序。可以防止:恶意破解密码、刷票、论坛灌水,有效防止某个黑客对某一个特定注册用户用特定程序暴力破解方式进行不断的登陆尝试,实际上用验证码是现在很多网站通行的方式,我们利用比较简易的方式实现了这个功能。这个问题可以由计算机生成并评判,但是必须只有人类才能解答。由于计算机无法解答CAPTCHA的问题,所以回答出问题的用户就可以被认为是人类。

   Jsp制作验证码

  运行环境:tomcat+eclipse+jdk

  基本思想:现在Servlet上画出验证码的图片,让其显示到页面上,再用js方法能刷新验证码,可以用ajax得到用户输入的值经过servlet跟验证码比对判断是否,并符合提示用户

  基本方法:  

BufferedImage: 

Image是一个抽象列,BufferedImage是Image的实现。


Image和BufferedImage的主要作用就是将一副图片加载到内存中。
Java将一副图片加载到内存中的方法是:
Java代码 
String imgPath = "d:/demo.jpg"; 
BufferedImage image = ImageIO.read(new FileInputStream(imgPath)); 
该方法可以获得图片的详细信息,例如:获得图片的宽度:image.getWidth(null);图片只有加载内存中才能对图片进行进一步的处理。


Graphics: 

Graphics类提供基本的几何图形绘制方法,主要有:画线段、画矩形、画圆、画带颜色的图形、画椭圆、画圆弧、画多边形等,具体操作其内容我推荐可以看看使用Java的Graphics类进行绘图的方法详解

  验证码的代码实现

  我这里做的验证码是显示中文的,可以在servlet中修改想要显示的是数字还是字母还是结合的,可以用数组存放这些,也可以转换ASCII码经行随机数字,看个人喜好

  先是做一个jsp中的验证码的地方

<div class="row cl">
    <div>
     <input type="text" placeholder="验证码" value="验证码:" onblur="testCheck(this.value);">
     <img id="pic" src="/UploadFiles/2021-04-02/CheckTestServlet">

  在做一个Servlet叫做CheckTestServlet.java

@WebServlet("/CheckTestServlet")
public class CheckTestServlet extends HttpServlet {
  private static final long serialVersionUID = 1L;
    
  
  protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
          //这个方法实现验证码的生成
          response.setCharacterEncoding("utf-8");
          //创建图片缓冲区设置其大小  BufferedImage(int width, int height, int imageType) 
         BufferedImage bImage=new BufferedImage(100, 30, BufferedImage.TYPE_3BYTE_BGR);
         //在缓冲区上创建画布
         Graphics g=bImage.getGraphics();
         //设置背景颜色
         g.setColor(Color.orange);
         //创建画布矩形,位置(0,0)点,大小100,30
         g.fillRect(0, 0, 100, 30);
         //创建随机对象
         Random r=new Random();
         int index;//存放随机数
         //得到的文字东西存放处
         StringBuffer sBuffer=new StringBuffer();
         //循环产生四个字
         for (int i = 0; i < 4; i++) {
           //中文字的第一个十六进制码为4e00转十进制是19968,最后一个是9fa0十进制为40869,所以可以产生在此之间的随机数
           index=r.nextInt(40869-19968+1)+19968;//产生随机数字
           //设置随机颜色,
           g.setColor(new Color(r.nextInt(255), r.nextInt(255), r.nextInt(255)));
           //设置文字的类型,大小
           g.setFont(new Font("", Font.BOLD, 20));
           /*画字,将随机数字转换成十六进制Integer.toHexString(index),16)再转换字符(char)(Integer.parseInt,
           在设置每个文字的位置
           */
           g.drawString((char)(Integer.parseInt(Integer.toHexString(index),16))+"", i*22+4, 18);
           //将其存放在StringBuffer中,以便后面读取作比较
           sBuffer.append((char)(Integer.parseInt(Integer.toHexString(index),16)));
        }
         //将得到的文字设置到session中
         request.getSession().setAttribute("piccode", sBuffer.toString());
         /*将这个验证码图片读写到页面中
          * write(RenderedImage im, String formatName, OutputStream output)
        */         
         ImageIO.write(bImage, "jpg", response.getOutputStream());
  }

  protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
    // TODO Auto-generated method stub
    doGet(request, response);
  }

  在做一个js刷新验证码的,用于看不清,或者别的刷新用处

 function Checktest(){
     var time=new Date().getTime();
    $("#pic").attr('src',"CheckTestServlet"+time)
  }

  再写一个Ajax去验证用户输入的是否正确返回提示,这是用jQuery做的,需要引js

function testCheck(num){
    $.ajax({
      type:"post",//提交方式
      url:"TestCheckServlet",//提交地址
      async:true,//是否异步请求
      dataType:"html",//返回类型
      data:{"num":num},//传过去的值
      success:function(data,textStatus){//成功执行的方法
        $("#checks").html(data)
      },
      error:function(){//失败执行的方法
        alert("error");
      }
    })
  } 

  有点麻烦的再去做一个Servlet去验证Ajax传过来的值是否匹配验证码

@WebServlet("/TestCheckServlet")
public class TestCheckServlet extends HttpServlet {
  private static final long serialVersionUID = 1L;
  
  protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
    response.setCharacterEncoding("utf-8");
    PrintWriter out=response.getWriter();
    //得到输入的验证码与随机的图片验证码作比较,判断是否相等,返回提示用户,
    if (request.getSession().getAttribute("piccode").toString().equals(request.getParameter("num"))) {
      out.println("验证码正确");
    }else {
      out.println("验证码错误");
    }
  }


  protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
    // TODO Auto-generated method stub
    doGet(request, response);
  }

}

就这样验证码已经基本搞定,其中还有许多需要修改的内容,花样,根据需求而来

 以上就是二维码的制作,如有疑问请留言或者到本站社区交流讨论,感谢阅读,希望能帮助到大家,谢谢大家对本站的支持!

DDR爱好者之家 Design By 杰米
广告合作:本站广告合作请联系QQ:858582 申请时备注:广告合作(否则不回)
免责声明:本站资源来自互联网收集,仅供用于学习和交流,请遵循相关法律法规,本站一切资源不代表本站立场,如有侵权、后门、不妥请联系本站删除!
DDR爱好者之家 Design By 杰米

《魔兽世界》大逃杀!60人新游玩模式《强袭风暴》3月21日上线

暴雪近日发布了《魔兽世界》10.2.6 更新内容,新游玩模式《强袭风暴》即将于3月21 日在亚服上线,届时玩家将前往阿拉希高地展开一场 60 人大逃杀对战。

艾泽拉斯的冒险者已经征服了艾泽拉斯的大地及遥远的彼岸。他们在对抗世界上最致命的敌人时展现出过人的手腕,并且成功阻止终结宇宙等级的威胁。当他们在为即将于《魔兽世界》资料片《地心之战》中来袭的萨拉塔斯势力做战斗准备时,他们还需要在熟悉的阿拉希高地面对一个全新的敌人──那就是彼此。在《巨龙崛起》10.2.6 更新的《强袭风暴》中,玩家将会进入一个全新的海盗主题大逃杀式限时活动,其中包含极高的风险和史诗级的奖励。

《强袭风暴》不是普通的战场,作为一个独立于主游戏之外的活动,玩家可以用大逃杀的风格来体验《魔兽世界》,不分职业、不分装备(除了你在赛局中捡到的),光是技巧和战略的强弱之分就能决定出谁才是能坚持到最后的赢家。本次活动将会开放单人和双人模式,玩家在加入海盗主题的预赛大厅区域前,可以从强袭风暴角色画面新增好友。游玩游戏将可以累计名望轨迹,《巨龙崛起》和《魔兽世界:巫妖王之怒 经典版》的玩家都可以获得奖励。