Java实现图片验证码功能

第Java实现图片验证码功能在实现登录功能时，一般为了安全都会设置验证码登录，为了防止某个用户用特定的程序暴力破解方式进行不断的尝试登录。常见验证码分为图片验证码和短信验证码，还有滑动窗口模块和选中指定物体验证方式。下面通过Java来实现图片验证码实例。

如上图所示，图片验证码由4个数字和一些彩色的干扰线段组成，点击图片可以更新验证码，只有输入的验证码与图片中的数字一致才能通过登录，否则将会重新刷新验证码，重新输入正确的验证码。

1、controller

@RestController

publicclassValidateCodeController{

@GetMapping("/getCodeImg")

publicvoidgetCodeImage(HttpServletRequestrequest,HttpServletResponseresponse,HttpSessionhttpSession)throwsIOException,InterruptedException{

BufferedImageimage=newBufferedImage(80,32,BufferedImage.TYPE_3BYTE_BGR);

//编辑图像

//获取绘图对象

Graphicsg=image.getGraphics();

g.setColor(newColor(239,239,239));

g.fillRect(0,0,80,32);

//设置字体颜色

g.setColor(newColor(49,49,49));

//设置字体

g.setFont(newFont("SimSong",Font.ITALIC,20));

//绘制字符串；

Stringtext="";

for(inti=0;ii++){

text+=(int)(Math.random()*10);

}

//字符串输出内容，水平起始坐标，垂直起始坐标。

g.drawString(text,17,24);

//画线条

for(inti=0;ii++){

g.setColor(newColor((int)(Math.random()*255),(int)(Math.random()*255),(int)(Math.random()*255)));

g.drawLine((int)(Math.random()*50),(int)(Math.random()*30),(int)(Math.random()*80),(int)(Math.random()*80));

}

//设置session

httpSession.setAttribute("code",text);

//输出图像

//ImageIO.write(image,"png",newFileOutputStream("C:/Users/H/Desktop/"+tet+".png"));

ImageIO.write(image,"png",response.getOutputStream());

g.dispose();

}

//获取保存在session中的验证码

@GetMapping("/getCode")

publicStringgetCode(HttpSessionhttpSession){

return(String)httpSession.getAttribute("code");

}

}

2、登录页面

body

divid="container"

!--登录--

divid="login"

h3登陆/h3

span{{msg}}/span

formth:action="@{/}"method="get"@submit.prevent="check()"ref="export"

div

label登录名/label

div

inputtype="text"name="username"required

lay-verify="required"placeholder="请输入登录名"autocomplete="off"v-model="userName"@blur="loseFocus()"@focus="getFocus()"

/div

/div

div

label密码/label

div

inputtype="password"required

lay-verify="required"placeholder="请输入密码"autocomplete="off"v-model="userPwd"name="password"@focus="getFocus()"

/div

/div

div

label验证码/label

div

inputtype="text"required

lay-verify="required"placeholder="请输入验证码"autocomplete="off"v-model="code"name="code"@blur="validateCode()"@focus="getFocus()"

/div

imgsrc="/getCodeImg"@click="changeCode()"id="codeImg"

/div

div

div

buttontype="submit"lay-submitlay-filter="formDemo"登录/button

buttontype="button"id="reg"注册/button

/div

/div

/form

/div

!--

注册--

divid="register"

h3注册/h3

span{{msg2}}/span

formth:action="@{/login}"method="post"@submit.prevent="check()"ref="export"

div

label登录名/label

div

inputtype="text"name="username"required

lay-verify="required"placeholder="请输入登录名"autocomplete="off"v-model="userName"@blur="loseFocus()"@focus="getFocus()"

/div

/div

div

label密码/label

div

inputtype="password"required

lay-verify="required"placeholder="请输入密码"autocomplete="off"v-model="userPwd"name="password"@focus="getFocus()"

/div

/div

div

label确认密码/label

div

inputtype="password"required

lay-verify="required"placeholder="请再次输入密码"autocomplete="off"v-model="rePassword"

name="rePassword"@focus="getFocus()"

/div

/div

div

label邮箱/label

div

inputtype="email"required

lay-verify="required"placeholder="请输入邮箱"autocomplete="off"v-model="userEmail"name="userEmail"@blur="validateCode()"@focus="getFocus()"

/div

/div

div

div

buttontype="button"lay-submitlay-filter="formDemo"@click="addUser()"注册/button

buttontype="reset"lay-submitlay-filter="formDemo"重置/button

/div

/div

/form

/div

/div

/body

3、JavaScript

varvm=newVue({

el:'#container',

data:{

userName:'',

userPwd:'',

userEmail:'',

rePassword:'',

msg:'',

msg2:'',

code:'',

text:''

},

methods:{

changeCode:function(){

//如果src里的图片链接不变的话，会直接用缓存的图片，加上Math.random()是为了让src的图片链接改变重新去渲染图片

document.getElementById("codeImg").src="/getCodeImg"+Math.random();

},

validateCode:function(){

vm.$http.get('/getCode').then((response)={

this.text=response.data

})

},

addUser:function(){

if(vm.userPwd!==vm.rePassword){

vm.msg2="确认密码不正确！"

}else{

vm.$http.post('/user/add/'+vm.userName+'/'+vm.userPwd+'/'+vm.userEmail).then((response)={

window.location.href='/'

})

}

},

loseFocus:function(){

vm.$http.get('/user/queryUserByName/'+vm.userName).then((response)={

if(response.data.userName!==vm.userName){

vm.msg="该用户名不存在！"

}

})

},

getFocus:function(){

vm.msg=""

},

check:function(){

if(vm.userName===""){

vm.msg="用户名为空！"

return

}

if(vm.userPwd===""){

vm.msg="密码为空！"