直接跳severlet在java後臺生成驗證碼：

@RequestMapping(value="yzm.action")
	public void Yzm(HttpSession session,HttpServletResponse resp){
		// 驗證碼圖片的寬度。      
	     int width = 60;      
	     
	    // 驗證碼圖片的高度。      
	     int height = 20;      
	     
	    // 驗證碼字元個數      
	     int codeCount = 4;      
	     
	     int x = 0;      
	     
	    // 字型高度      
	     int fontHeight;      
	     
	     int codeY;      
	     
	    char[] codeSequence = { 'A', 'B', 'C', 'D', 'E', 'F', 'G', 'H', 'I', 'J',      
	            'K', 'L', 'M', 'N', 'O', 'P', 'Q', 'R', 'S', 'T', 'U', 'V', 'W',      
	            'X', 'Y', 'Z', '0', '1', '2', '3', '4', '5', '6', '7', '8', '9' };      
	    x = width / (codeCount + 1);      
        fontHeight = height - 2;      
        codeY = height - 4;  
        BufferedImage buffImg = new BufferedImage(width, height,      
                BufferedImage.TYPE_INT_RGB);      
        Graphics2D g = buffImg.createGraphics();      
     
        // 建立一個隨機數生成器類      
        Random random = new Random();      
     
        // 將影象填充為白色      
        g.setColor(Color.WHITE);      
        g.fillRect(0, 0, width, height);      
     
        // 建立字型，字型的大小應該根據圖片的高度來定。      
        Font font = new Font("Fixedsys", Font.PLAIN, fontHeight);      
        // 設定字型。      
        g.setFont(font);      
     
        // 畫邊框。      
//        g.setColor(Color.BLACK);      
//        g.drawRect(0, 0, width - 1, height - 1);      
     
        // 隨機產生160條幹擾線，使圖象中的認證碼不易被其它程式探測到。      
        g.setColor(Color.BLACK);      
        for (int i = 0; i < 1; i++) {      
            int x2 = random.nextInt(width);      
            int y2 = random.nextInt(height);      
            int xl = random.nextInt(12);      
            int yl = random.nextInt(12);      
            g.drawLine(x2, y2, x + xl, y2 + yl);      
        }      
     
        // randomCode用於儲存隨機產生的驗證碼，以便使用者登入後進行驗證。      
        StringBuffer randomCode = new StringBuffer();
		
        int red = 0, green = 0, blue = 0;      
     
        // 隨機產生codeCount數字的驗證碼。      
        for (int i = 0; i < codeCount; i++) {      
            // 得到隨機產生的驗證碼數字。      
            String strRand = String.valueOf(codeSequence[random.nextInt(36)]);      
            // 產生隨機的顏色分量來構造顏色值，這樣輸出的每位數字的顏色值都將不同。      
            red = random.nextInt(255);      
            green = random.nextInt(255);      
            blue = random.nextInt(255);      
     
            // 用隨機產生的顏色將驗證碼繪製到影象中。      
            g.setColor(new Color(red, green, blue));      
            g.drawString(strRand, (i + 1) * x, codeY);      
     
            // 將產生的四個隨機數組合在一起。      
            randomCode.append(strRand);      
        }      
        // 將四位數字的驗證碼儲存到Session中。      
        session.setAttribute("validateCode", randomCode.toString());      
        ServletOutputStream sos;
		try {
			sos = resp.getOutputStream();
			ImageIO.write(buffImg, "jpeg", sos);      
			sos.close();      
		} catch (IOException e) {
			// TODO Auto-generated catch block
			e.printStackTrace();
		}      
	}
 

jsp顯示頁面的程式碼，點選圖片重新整理

<td><img id="img" src="yzm.action"/>${validateCode}</td>
           <td><input type="text" name="yzma"/><br/></td>

 $("#img").click(function(){
	$(this).attr("src","yzm.action?"+new Date().getTime());
    });

頁面上拿到的session的值老是比驗證碼晚一步，所以採取後臺進行驗證。這裡我也不知道什麼原因，望小夥伴們告知。。。

另一種思路，後臺生成隨機數，前端生成畫布，用ajax拿隨機數

//後臺只生成隨機數
	@RequestMapping(value="random.action")
	public void findRandom (HttpServletResponse response) throws IOException{
		 // 驗證碼字元個數      
	     int codeCount = 4;
	     char[] codeSequence = { 'A', 'B', 'C', 'D', 'E', 'F', 'G', 'H', 'I', 'J',      
		            'K', 'L', 'M', 'N', 'O', 'P', 'Q', 'R', 'S', 'T', 'U', 'V', 'W',      
		            'X', 'Y', 'Z', '0', '1', '2', '3', '4', '5', '6', '7', '8', '9' };
	     
	     // 建立一個隨機數生成器類      
	        Random random = new Random();
	     // randomCode用於儲存隨機產生的驗證碼，以便使用者登入後進行驗證。      
	        StringBuffer randomCode = new StringBuffer();
	        for (int i = 0; i < codeCount; i++) {      
	            // 得到隨機產生的驗證碼數字。      
	            String strRand = String.valueOf(codeSequence[random.nextInt(36)]);  
	            // 將產生的四個隨機數組合在一起。      
	            randomCode.append(strRand);      
	        }
	        PrintWriter out = response.getWriter();
	        out.print(randomCode);
	}
 

<body>
       <canvas id="canvas" width="70" height="34"></canvas>
       <a href="javascript:;" id="img" class="pull-right" style="line-height: 34px;text-indent: 10px;">換一張</a>
       <input type="text" class="form-control" id="yzms" name="yzms" readonly = "readonly" style="display:none" >
     
  </body>
  <script type="text/javascript">
        $.ajax({
	url:"random.action",
	success:function(k){
		console.log(k)
		 $("#yzms").attr("value",k);
		 drawPic();
	}
})

  $("#img").on("click",function(){
		var _this=$(this)
	 	$.ajax({
			url:"random.action",
			success:function(k){
				console.log(k)
				 $("#yzms").attr("value",k);
				 drawPic();
			}
		})
	}) 
  /**生成一個隨機數**/
  function randomNum(min,max){
    return Math.floor( Math.random()*(max-min)+min);
  }
  /**生成一個隨機色**/
  function randomColor(min,max){
    var r = randomNum(min,max);
    var g = randomNum(min,max);
    var b = randomNum(min,max);
    return "rgb("+r+","+g+","+b+")";
  }
  	
		
  /**繪製驗證碼圖片**/
  function drawPic(){
    var canvas=document.getElementById("canvas");
    var width=canvas.width;
    var height=canvas.height;
    var ctx = canvas.getContext('2d');
    ctx.textBaseline = 'bottom';

    /**繪製背景色**/
    ctx.fillStyle = randomColor(180,240); //顏色若太深可能導致看不清
    ctx.fillRect(0,0,width,height);
    /**繪製文字**/

  /*   for(var i=0; i<4; i++){ */
      var txt = $("#yzms").attr("value");
      ctx.fillStyle = randomColor(50,160);  //隨機生成字型顏色
      ctx.font = randomNum(15,20)+'px SimHei'; //隨機生成字型大小
      var x = 20;
      var y = randomNum(20,30);
      var deg = randomNum(-45, 45);
      //修改座標原點和旋轉角度
      ctx.translate(x,y);
      ctx.rotate(deg*Math.PI/180);
      ctx.fillText(txt, 0,0);
      //恢復座標原點和旋轉角度
      ctx.rotate(-deg*Math.PI/180);
      ctx.translate(-x,-y);
 /*    } */
    /* /**繪製干擾線**/
     for(var i=0; i<8; i++){
      ctx.strokeStyle = randomColor(40,180);
      ctx.beginPath();
      ctx.moveTo( randomNum(0,width), randomNum(0,height) );
      ctx.lineTo( randomNum(0,width), randomNum(0,height) );
      ctx.stroke();
    } 
    /**繪製干擾點**/
   /*  for(var i=0; i<100; i++){
      ctx.fillStyle = randomColor(0,255);
      ctx.beginPath();
      ctx.arc(randomNum(0,width),randomNum(0,height), 1, 0, 2*Math.PI);
      ctx.fill();
    }  */
  }