Java秒殺系統7.2 數學表達式圖形驗證碼

1.設計思路

前端頁面在立即秒殺 按鈕旁邊添加img 標籤顯示驗證碼,添加input標籤用於用戶填入驗證碼。

img 標籤添加onclick時間用戶按下調用refreshVerifyCode(),在refreh VerifyCode()中發送ajax 請求攜帶goodsId和時間Date()controller: 創建BufferedImge 獲得maioshaService.createVerifyCode的返回值,通過javax.imageio.ImageIO 寫入。在按秒殺之後在do_miaosha 中獲得redis 中的保存的圖片驗證碼與前端獲得驗證碼作比較是否相等。


 

 

 

2.代碼實現

goods.detail.htm  style設置爲“dispaly:none” 默認展示

  <td>
        <!--  
        	<form id="miaoshaForm" method="post" action="/miaosha/do_miaosha">
        		<button class="btn btn-primary btn-block" type="submit" id="buyButton">立即秒殺</button>
        		<input type="hidden" name="goodsId"  id="goodsId" />
        	</form>-->
            <img  id="verifyCodeImg" width="80" height="32" style="display: none"   onclick="refreshVerifyCode()" >
            <input id="verifyCode" class="form-control" style="display: none">

        	<button class="btn btn-primary btn-block" type="button" id="buyButton"onclick="getMashaPath()">立即秒殺</button>
        	<input type="hidden" name="goodsId"  id="goodsId" />
        </td>

 秒殺進行時展示上面的驗證碼:

controller:

   @RequestMapping(value = "/verifyCode",method = RequestMethod.GET)
    @ResponseBody
    public Result<String> getMiaoshaVerifyCode(HttpServletResponse response, MiaoshaUser user,
                                              @RequestParam("goodsId")long goodsId) {
        if(user == null) {
            return Result.error(CodeMsg.SESSION_ERROR);
        }
        try {
            BufferedImage image  = miaoshaService.createVerifyCode(user, goodsId);
            OutputStream out = response.getOutputStream();
            ImageIO.write(image, "JPEG", out);
            out.flush();//刷新到頁面
            out.close();
            return null;
        }catch(Exception e) {
            e.printStackTrace();
            return Result.error(CodeMsg.MIAOSHA_FAIL);
        }
    }

service:生成驗證碼,把驗證碼保存在redis 中

@Override
    public BufferedImage createVerifyCode(MiaoshaUser user, long goodsId) {

        if(user == null || goodsId <=0) {
            return null;
        }
        int width = 80;
        int height = 32;
        //create the image
        BufferedImage image = new BufferedImage(width, height, BufferedImage.TYPE_INT_RGB);
        Graphics g = image.getGraphics();
        // set the background color
        g.setColor(new Color(0xDCDCDC));
        g.fillRect(0, 0, width, height);
        // draw the border
        g.setColor(Color.black);
        g.drawRect(0, 0, width - 1, height - 1);
        // create a random instance to generate the codes
        Random rdm = new Random();
        // make some confusion
        for (int i = 0; i < 50; i++) {
            int x = rdm.nextInt(width);
            int y = rdm.nextInt(height);
            g.drawOval(x, y, 0, 0);
        }
        // generate a random code
        String verifyCode = generateVerifyCode(rdm);
        g.setColor(new Color(0, 100, 0));
        g.setFont(new Font("Candara", Font.BOLD, 24));
        g.drawString(verifyCode, 8, 24);
        g.dispose();
        //把驗證碼存到redis中
        int rnd = calc(verifyCode);
        redisService.set(MiaoshaKey.getMiaoshaVerifyCode, user.getId()+","+goodsId, rnd);
        //輸出圖片
        return image;


    }
private static int calc(String exp) {
        try {
            ScriptEngineManager manager = new ScriptEngineManager();
            ScriptEngine engine = manager.getEngineByName("JavaScript");
            return (Integer)engine.eval(exp);
        }catch(Exception e) {
            e.printStackTrace();
            return 0;
        }
    }
    private static char[] ops = new char[] {'+', '-', '*'};
    private String generateVerifyCode(Random rdm) {
        int num1 = rdm.nextInt(10);
        int num2 = rdm.nextInt(10);
        int num3 = rdm.nextInt(10);
        char op1 = ops[rdm.nextInt(3)];
        char op2 = ops[rdm.nextInt(3)];
        String exp = ""+ num1 + op1 + num2 + op2 + num3;
        return exp;
    }

顯示效果: 

redis中保存的:驗證碼 

兩個值對應 

在按秒殺之後在path 中獲得redis 中的保存的圖片驗證碼與前端獲得驗證碼作比較是否相等。

 

  @ResponseBody
    @RequestMapping(value = "/path")
    public   Result<String>  getMiaoshaPath(HttpServletRequest  request, MiaoshaUser  user,
                                            @RequestParam(value = "goodsId") Long  goodsId,
    @RequestParam(value = "verifyCode",defaultValue = "0") Integer verifyCode
    ){
     logger.info("test");
     user=getMiaoshauser(request);
        if(user.getId()==null){
            return Result.error(CodeMsg.SESSION_ERROR);
        }

      //  Integer aveifyCode = Integer.valueOf(verifyCode);
        logger.info("averifyCode "+verifyCode);
        // 驗證碼是否正確
        boolean ret=    miaoshaService.chechVerifyCode(user, goodsId,verifyCode);
        if(!ret){
            return  Result.error(CodeMsg.MIAOSHA_VERYCODEERROR);
        }

     logger.info("test2"+user);
        String path = miaoshaService.createMiaoshaPath(user, goodsId);
     return Result.success(path);
    }

 

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章