java实现图片验证码登录功能（含有微信授权登录的部分功能）

 前台页面：

<title>登录</title>
<div class="col" style="border:1px solid #CCC;">
  <div>
    <div  style="border-bottom:1px solid #CCC;text-align:center;height:50px;">
      <div class="login" style="float:left;"> 
      	<a href="javascript:void(0);"id="switch_qlogin">微信登录</a>
      </div>
      <span style="float:left;top:10px;">|</span>
      <div class="login" style="float:right;"> 
      	<a href="javascript:void(0);" id="switch_login">账户登录</a>
      </div>
    </div>
    <br><br>
    <div id="welogin">
    <div id="login_container"></div>	
    <form class="form-horizontal" method="post" action="" id="form">
		<table>
			<tr>
            	<td>
            		<label class="control-label col-md-2 col-md-offset-1" >用户名：</label>
            	</td>
            	<td>
            		<div class="col-md-6">
                		<@s.textfield name="user.account" id="userAccount" class="form-control" autocomplete="off" required=true maxlength="20" style="width:300px;"/>
              		</div>
            	</td>
			</tr>

            <tr>
            	<td>
            		<label class="control-label col-md-2 col-md-offset-1" >密码：</label>
            	</td>
            	<td>
            		<div class="col-md-6">
            			<input type="password" id="pwd" name="user.password" class="form-control" required=true maxlength="20" style="width:300px;"/>
              		</div>
            	</td>
			</tr>
			<tr>
            	<td>
            		<label class="control-label col-md-2 col-md-offset-1" >验证码：</label>
            	</td>
            	<td>
				  <@s.textfield id="verift_input" placeholder="请输入验证码" maxlength="5"/>
            	  <a href="javascript:void(0);" id="update" rel="external nofollow" title="点击更换验证码">
      				<img id="imgVerify"  alt="更换验证码" height="36" width="170" >
    			 </a> 
    			 <p id="ms" style="font-size:12px;"></p>
            	</td>
			</tr>
			<tr>
            	<td></td>
            	<td>
            		<div class="col-md-6" style="font-size:14px;float:left;">
            			<p>忘记密码</p>
              		</div>
            		<div class="col-md-6" style="font-size:14px;float:right;">
            			<p><a href="${base}/front/user/register">立即注册</a></p>
              		</div>
            	</td>
			</tr>

			<tr>
				<td colspan="2">
					<div class="btn-group">
              			<button type="button" id="login" onclick="aaogin();" class="btn btn-circle btn_list"> <i class="fa fa-times"></i><span class="hidden-sm hidden-xs">登录</span> </button>
            		</div>
				<td>
			</tr>
		</table>
		
    </form>
	</div>
  </div>
</div>

<!-- END SAMPLE FORM PORTLET-->
<style>
	.login{
		width:48%;
		height:99%;
		text-align:center;
		line-height:50px;
	}
	label{
		text-align:right;
	}
	.col{
		width:40%;
		margin:0 auto;
	}

    .col-md-6{
     	width:50%;
    }
	table{
		width:90%;
		margin:0 auto;
		margin-top:20px;
	}
	table tr{
		height:50px;
	}
	button{
		width:200px;
		height:40px;
		margin-left:30%;
	}
	#login_container{
		margin-left:100px;
	}
</style>
<script src="${base}/resources/m45/assets/global/plugins/jquery.min.js" type="text/javascript"></script>
<script src="http://res.wx.qq.com/connect/zh_CN/htmledition/js/wxLogin.js"></script>
<script src="http://code.jquery.com/jquery-latest.js"></script>
<script type="text/javascript">
     $(document).ready(function () {
     		//获得上一级页面的url
 			var url=document.referrer;
            var obj = new WxLogin({
                id:"login_container",
                appid: "wx7287a60bb700fd21",
                scope: "snsapi_login",  // 固定参数，微信官方提供的解析参数
                redirect_uri: "http%3A%2F%2Fwww.txjava.cn%2F${base}%2Ffront%2Fuser%2FcallBackLogin?url="+url,   // 回调url，就是扫码后，微信官方返回一些参数（code，state），然后调用你这里指定的方法
                state: "",   // 该参数可以不写
                style: "black",  //二维码黑白风格，该参数可以不写
                href: ""   // 该参数可以不写
            });
      });
</script>
<script>
	function aaogin(){		
		var userAccount = $("#userAccount").val();	
		var pwd = $("#pwd").val();
		
			
		$.ajax({
			type:"post",
			url:"${base}/front/user/frontlogin",
			data:{
				"userAccount":userAccount,
				"pwd":pwd,
				"yan":yan,
				"flag":1
			},
			dataType:"json",
			async:false,
			success:function(result){
				if(result!=null){
					$("#login").click(function(){
						alert("重复提交");
    					$(this).attr("disabled","disabled");    
					});
					 //返回到上一级页面,并刷新数据
					  window.history.go(-1);
					  window.location.href=document.referrer;	 
				}else{
					alert("用户名或密码错误！");
				}
			}
		});
	}
	$(function(){
		$('#login_container').css('display','block');
		$('#form').css('display','none');
		$('#switch_qlogin').click(function(){
			$('#form').css('display','none');
			$('#login_container').css('display','block');
		});
		$('#switch_login').click(function(){
			$('#form').css('display','block');
			$('#login_container').css('display','none');
		});
	})
	
	$("#verift_input").blur(function(){
		var yan=$("#verift_input").val();
		alert(yan)
		$.ajax({
			type:"post",
			url:"${base}/front/user/yanzheng",
			data:{
				"yan":yan
			},
			dataType:"json",
			async:false,
			success:function(msg){
				if(msg=="验证通过"){
					$("#ms").html("<span style='color:green;'>"+msg+"</span>")
				}else if(msg=="验证失败"){
					$("#ms").html("<span style='color:red;'>"+msg+"</span>")
				}
			}
		});
	})

   
	$(function(){
		$("#imgVerify").attr("src", 'http://www.txjava.cn/visitweb/front/user/pic');
	})
	$("#update").click(function(){
		//var img = document.getElementById("img");
		$("#imgVerify").attr("src", 'http://www.txjava.cn/visitweb/front/user/pic?'+new Date().getTime());
	})
	
</script>

工具类：

package com.ruidev.front.user.util;

import java.awt.Color;
import java.awt.Font;
import java.awt.Graphics2D;
import java.awt.image.BufferedImage;
import java.io.FileOutputStream;
import java.io.IOException;
import java.io.OutputStream;
import java.util.Random;

import javax.imageio.ImageIO;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import javax.servlet.http.HttpSession;

import org.apache.struts2.convention.annotation.Action;
import org.apache.struts2.convention.annotation.Namespace;

@Namespace("/front/check")
public class DrawImageUtil {

	 
    // 图片的宽度。
    private int width = 160;
    // 图片的高度。
    private int height = 40;
    // 验证码字符个数
    private int codeCount = 5;
    // 验证码干扰线数
    private int lineCount = 150;
    // 验证码
    private String code = null;
 
    private char[] codeSequence = {'A', 'B', 'C', 'D', 'E', 'F', 'G', 'H', 'I', 'J',
            'K', 'L', 'M', 'N', 'P', 'Q', 'R', 'S', 'T', 'U', 'V', 'W',
            'X', 'Y', 'Z', '1', '2', '3', '4', '5', '6', '7', '8', '9'};
 
    private BufferedImage bufferedImage;
 
    private DrawImageUtil(int width, int height){
        this.width = width;
        this.height = height;
    }
 
    public DrawImageUtil(int width, int height, int codeCount, int lineCount){
        this(width, height);
        this.codeCount = codeCount;
        this.lineCount = lineCount;
        createCodeImage();
    }
    private void createCodeImage(){
        //字符所在x坐标
        int x = 0;
        //字体高度
        int fontHeight = 0;
        //字符所在y坐标
        int codeY = 0;
        int red = 0;
        int green = 0;
        int blue = 0;
        x = width / (codeCount + 2);
        fontHeight = height - 2;
        codeY = height - 4;
        bufferedImage = new BufferedImage(width, height, BufferedImage.TYPE_INT_BGR);
        Graphics2D graphics2D = bufferedImage.createGraphics();
        Random random = new Random();
        graphics2D.setColor(Color.WHITE);
        graphics2D.fillRect(0, 0, width,height);
        Font font = new Font("Fixedays",Font.PLAIN,fontHeight);
        graphics2D.setFont(font);
 
        for (int i = 0; i < lineCount; i++) {
            //x轴第一个点的位置
            int x1 = random.nextInt(width);
            //y轴第一个点的位置
            int y1 = random.nextInt(height);
            //x轴第二个点的位置
            int x2 = x1 + random.nextInt(width >> 2);
            //y轴第二个点的位置
            int y2 = y1 + random.nextInt(height >> 2);
 
            red = random.nextInt(255);
            green = random.nextInt(255);
            blue = random.nextInt(255);
 
            graphics2D.setColor(new Color(red, green, blue));
            graphics2D.drawLine(x1, y1, x2, y2);
        }
 
        StringBuffer randomCode = new StringBuffer(codeCount);
        for (int i = 0; i < codeCount; i++) {
            String strRand = String.valueOf(codeSequence[random.nextInt(codeSequence.length)]);
            red = random.nextInt(255);
            green = random.nextInt(255);
            blue = random.nextInt(255);
            graphics2D.setColor(new Color(red, green, blue));
            graphics2D.drawString(strRand, (i +1) * x, codeY);
            randomCode.append(strRand);
        }
        code = randomCode.toString();
    }
 
    public void write(String path) throws IOException {
        OutputStream outputStream = new FileOutputStream(path);
        this.write(outputStream);
        outputStream.flush();
        outputStream.close();
    }
 
    public void write(OutputStream outputStream) throws IOException {
        ImageIO.write(bufferedImage, "png", outputStream);
    }
 
    public BufferedImage getBufferedImage(){
        return bufferedImage;
    }
 
    public String getCode(){
        return code;
    }
}

/*
*    获取图片
*/

@Action("pic")
	@ActionEnableAnon
	public String pic() throws Exception {
		
		response.setContentType("image/jpeg");
		// 禁止图像缓存
		response.setHeader("Pragma", "no-cache");
		response.setHeader("Cache-Control", "no-cache");
		response.setDateHeader("Expires", 0);
		HttpSession session = request.getSession();
		DrawImageUtil imageUtil = new DrawImageUtil(100, 40, 5, 30);
		session.setAttribute("code", imageUtil.getCode());
		imageUtil.write(response.getOutputStream());
		return null;
	}
/*
*    验证输入的是否与图片一致
*/
	@Action("yanzheng")
	@ActionEnableAnon
	public String yanzheng() throws Exception{
		String yan=request.getParameter("yan");
		if(request.getSession().getAttribute("code").equals(yan)) {
			returnObject="验证通过";
		}else {
			returnObject="验证失败";
		}
		return JSON;
	}