Kaptcha 验证码在springBoot中的使用

1. 添加依赖

    <dependency>
       <groupId>com.github.axet</groupId>
       <artifactId>kaptcha</artifactId>
       <version>0.0.9</version>
   </dependency>
   

2. javaconfig

   import com.google.code.kaptcha.impl.DefaultKaptcha;
   import com.google.code.kaptcha.util.Config;
   import org.springframework.context.annotation.Bean;
   import org.springframework.context.annotation.Configuration;
   
   import java.util.Properties;
   
   
   /**
    * 生成验证码配置
    *
    * @author Mark [email protected]
    * @since 2.1.0 2017-04-20
    */
   @Configuration
   public class KaptchaConfig {
   
       @Bean
       public DefaultKaptcha producer() {
           Properties properties = new Properties();
           properties.put("kaptcha.border", "no");
           properties.put("kaptcha.textproducer.font.color", "black");
           properties.put("kaptcha.textproducer.char.space", "5");
           Config config = new Config(properties);
           DefaultKaptcha defaultKaptcha = new DefaultKaptcha();
           defaultKaptcha.setConfig(config);
           return defaultKaptcha;
       }
   }
   

3. conroller使用

       @Autowired
       private Producer producer;
   
       @RequestMapping("captcha.jpg")
       public void captcha(HttpServletResponse response) throws IOException {
           response.setHeader("Cache-Control", "no-store, no-cache");
           response.setContentType("image/jpeg");
   
           //生成文字验证码
           String text = producer.createText();
           //生成图片验证码
           BufferedImage image = producer.createImage(text);
           //保存到shiro session
           ShiroUtils.setSessionAttribute(Constants.KAPTCHA_SESSION_KEY, text);
   
           ServletOutputStream out = response.getOutputStream();
           ImageIO.write(image, "jpg", out);
       }
   

4. 前端页面

       //  html --div
       <div class="form-group has-feedback">
       <img alt="如果看不清楚，请单击图片刷新！" class="pointer" :src="src" @click="refreshCode">
       &nbsp;&nbsp;&nbsp;&nbsp;<a href="javascript:;" @click="refreshCode">点击刷新</a>
     </div>
   
   
       // vue--js请求 
       refreshCode: function(){
       this.src = "captcha.jpg?t=" + $.now();
    },
   

5. 效果图