• 使用后端生成图片验证码流文件(不推荐)


    代码:

    @Controller
    @RequestMapping("/user")
    public class UserLoginController {
    
    	//生成验证码图片流、并把验证码写到会话中
        @RequestMapping("/loginVerCodeImg")
        public void verifyCodeImage(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException { 
            response.setHeader("Pragma", "No-cache"); 
            response.setHeader("Cache-Control", "no-cache"); 
            response.setDateHeader("Expires", 0); 
            response.setContentType("image/jpeg"); 
               
            //生成随机字串 
            String verifyCode = VerifyCodeUtils.generateVerifyCode(4); 
    
            //存入会话session 
            HttpSession session = request.getSession(true); 
            //删除以前的
            session.removeAttribute("verCode");
            session.setAttribute("verCode", verifyCode); 
            //生成图片 
            int w = 100, h = 30; 
            VerifyCodeUtils.outputImage(w, h, response.getOutputStream(), verifyCode); 
            
            logger.warn("【loginVerCodeImg】: 生成随机验证码:" + verifyCode);
        }
    	
    	//登录方法
        @RequestMapping("/login/addlogin")
        public ModelAndView addlogin(HttpServletRequest request,HttpServletResponse response,Map<String, Object> map){
            String username = request.getParameter("username");
            String password = request.getParameter("password");
            String verifyCode = request.getParameter("verifyCode");
            request.getSession().setAttribute("username", username);
            //读取session中verCode的值
            HttpSession session = request.getSession();
            String verCode2 = session.getAttribute("verCode").toString();
            
            if(username == "" || username == null ) {
            	logger.warn("帐户名为空");
            	map.put("login_msg", "帐户名为空");
            	return new ModelAndView("/login/login",map);
            }else if (password == "" || password == null) {
            	logger.warn("密码为空");
            	map.put("username", username);
            	map.put("login_msg", "密码为空");
            	return new ModelAndView("/login/login",map);
            }else if(!(verifyCode.equals(verCode2) || verifyCode.equals(verCode2.toLowerCase()))) {
            	logger.warn("验证码不正确");
            	map.put("username", username);
            	map.put("password", password);
            	map.put("login_msg", "验证码错误");
        		return new ModelAndView("/login/login",map);
            }
            
            
            logger.warn("【addlogin】:输入验证码:"+ verifyCode + ",session中的验证码:"+ verCode2);
            //第1步. 去和数据库里的数据匹配
            User user = userService.findOneByNameAndPWD(username,password);
            
            if ( user == null){
            	logger.warn("登录失败");
            	map.put("username", username);
            	map.put("login_msg", "登录失败:帐户密码有误或未启用的帐户");
            	return new ModelAndView("/login/login",map);
            }else {
            	
            	//将对象user转成json格式
            	ObjectMapper mapper = new ObjectMapper();
            	String json;
        		try {
        			json = mapper.writeValueAsString(user);
        		} catch (JsonProcessingException e) {
        			json = null;
        			e.printStackTrace();
        		}
    
        		//第2步. 设置token至redis
        		String token = session.getId();     
        		redisTemplate.opsForValue().set(String.format("token_%s", token), json, ExpireEnum.REDISExpire.getCode(), TimeUnit.SECONDS);
            	
        		//第3步. 设置token至cookie
        		CookieUtil.set(response, "token", token, ExpireEnum.COOKIEExpire.getCode());
        		return new ModelAndView("redirect:" + projectUrlConfig.getSell() + "/userManage/userShow?userid="+user.getUserid()); 	
            }
        }
    }

    页面:

    <!DOCTYPE html>
    <html lang="en">
    <link rel="stylesheet" href="https://cdn.bootcss.com/bootstrap/3.3.7/css/bootstrap.min.css">  
    	<script src="https://cdn.bootcss.com/jquery/2.1.1/jquery.min.js"></script>
    	<script src="https://cdn.bootcss.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
    <#include "../common/header.ftl">
    <body>
    
    <div align="left" style="border:100px solid white">
    	<div class="container">
    	    <div class="row">
    	        <div class="col-md-offset-3 col-md-6">
    	            <form class="form-horizontal" action="/user/login/addlogin" name="loginfrom" accept-charset="utf-8" method="post">
    	            	<div class="form-group">
    	                   	
    	                	<span class="heading">用户登录  </span><font color="red">${(login_msg?if_exists)}</font><p>
    	                </div>
    	                <div class="form-group">
    	                	<label class="control-label control-label-normal">用户名</label>
    	                    <input type="text" class="form-control" id="username" name="username" placeholder="用户名" value="${username?if_exists}">
    	                </div>
    	                <div class="form-group">
    	                	<label class="control-label control-label-normal">密 码</label>
    	                    <input type="password" class="form-control" id="password" name="password" placeholder="密 码" value="${password?if_exists}">
    	                </div>
    	                <div class="form-group">
    	                	<label class="control-label control-label-normal">验证码</label><p>
    	                	<img src="/user/loginVerCodeImg" id="verImg" onclick="javascript:changeImg()" />
    	                    <input type="text" class="form-control" id="verifyCode" name="verifyCode" placeholder="验证码" />
    	                </div>
    	                <div class="form-group">
    	                    <button type="submit" class="btn btn-default">登录</button>
    	                    <a href="/user/register" class="zcxy" target="_blank">注册</a><p>
    	                </div>
    	            </form>
    	        </div>
    	    </div>
    	</div>
    </div>
    	
    </body>
    </html>
    <!-- 触发JS刷新-->
     <script type="text/javascript">
        function changeImg(){
            var img = document.getElementById("verImg"); 
            img.src = "/user/loginVerCodeImg?date=" + new Date();;
        }
    </script>
    

      

  • 相关阅读:
    VC++菜单
    VC++的菜单控制和自绘菜单
    windowsUI的总结
    Linux mount BSD disk partition
    Linux qemu-nbd mount qemu disk image
    自定义chromium浏览器
    EF6配合MySQL或MSSQL(CodeFirst模式)配置指引
    使用 dmidecode 查看Linux服务器信息
    修改KVM的模拟网卡类型
    华为TaiShan 2280 ARM 服务器
  • 原文地址:https://www.cnblogs.com/amoyzhu/p/9171714.html
Copyright © 2020-2023  润新知