spring mvc +mybatis登录首页功能 实现

//image.jsp生成图片验证码的jsp

<%@ page language="java" import="java.util.*" pageEncoding="utf-8"%>
<%@ page contentType="image/jpeg"
 import="java.awt.*,java.awt.image.*,java.util.*,javax.imageio.*"%>
<%!Color getRandColor(int fc, int bc) {
  Random random = new Random();
  if (fc > 255)
   fc = 255;
  if (bc > 255)
   bc = 255;
  int r = fc + random.nextInt(bc - fc);
  int g = fc + random.nextInt(bc - fc);
  int b = fc + random.nextInt(bc - fc);
  return new Color(r, g, b);
 }%>
<%
 response.setHeader("Pragma", "No-cache");
 response.setHeader("Cache-Control", "no-cache");
 response.setDateHeader("Expires", 0);
 int width = 60, height = 20;
 BufferedImage image = new BufferedImage(width, height,
   BufferedImage.TYPE_INT_RGB);
 Graphics g = image.getGraphics();
 Random random = new Random();
 g.setColor(getRandColor(200, 250));
 g.fillRect(0, 0, width, height);
 g.setFont(new Font("Times New Roman", Font.PLAIN, 18));
 g.setColor(getRandColor(160, 200));
 for (int i = 0; i < 155; i++) {
  int x = random.nextInt(width);
  int y = random.nextInt(height);
  int xl = random.nextInt(12);
  int yl = random.nextInt(12);
  g.drawLine(x, y, x + xl, y + yl);
 }
 String sRand = "";
 for (int i = 0; i < 4; i++) {
  String rand = String.valueOf(random.nextInt(10));
  sRand += rand;
  g.setColor(new Color(20 + random.nextInt(110), 20 + random
    .nextInt(110), 20 + random.nextInt(110)));
  g.drawString(rand, 13 * i + 6, 16);
 }
 // 将认证码存入SESSION
 session.setAttribute("rand", sRand);
 g.dispose();
 ImageIO.write(image, "JPEG", response.getOutputStream());
 out.clear();
 out = pageContext.pushBody();
%>
//前台登录代码

 <form action="login.do" method="post" name="form">
      <dl>
       <dt>用户名</dt>
       <dd>
        <input type="text" name="username" id="username"
         οnblur="userload(this.value)" /> <span id="name"></span>//失去焦点时判断是否存在
       </dd>
       <dt style="letter-spacing:12px">密码</dt>
       <dd>
        <input type="password" name="password" id="password" /> <span
         id="pwd">${checkpws }</span>
       </dd>
       <dt>验证码</dt>
       <dd class="num">
        <input type="text" name="num" id="num"  />
        <a href="javascript:loadimage();"  >看不清楚,换一张</a> <span id="divnum">${code}</span>//验证码显示
       </dd>
       <dt></dt>
       <dd>
        <img src="image.jsp" id="img" />
       </dd>
      </dl>

      <div id="button">
       <input type="submit" class="button" value="登录" /> <a
        href="register.jsp">免费注册</a>
      </div>
     </form>

//控制器中判断

 @RequestMapping(value="/login.do")
 public String userlogin(Users users,Model model,HttpServletRequest request,String num){
   String rand=request.getSession().getAttribute("rand").toString();
      boolean result=userService.select(users.getUsername());
      if(result==false){
      return "login";
      }
      else{
       Users u=userService.check(users);
      
       if(u!=null && rand.equals(num)){
        request.getSession().setAttribute("users", u);
        model.addAttribute("sucess", "登陆成功!");
       // 验证码输入错误,请重新输入
       
        return "sucess";
       }else{
        if(!rand.equals(num)){
         model.addAttribute("code", "验证码输入错误,请重新输入");
         System.out.print(rand+"\n"+num);
        }
       if(u==null){
        model.addAttribute("checkpws", "密码输入错误,请重新输入!");
       }
        return "login";
       }
      }

 

/DWR  失去焦点判断用户是否存在

<script type="text/javascript">
function loadimage(){
document.getElementById("img").src = "image.jsp?"+Math.random();
} //刷新验证码
 function call(date) {
  if (date == true) {
   // alert(date);
   document.getElementById("name").innerHTML = "";
  } else {
   document.getElementById("name").innerHTML = "用户不存在,请到注册账号!";
  }
 }
 function userload(name) {
  // var name=document.getElementById("username").value;
  // alert(name);
  userService.select(name, call);
 }
 
</script>

 

  • 0
    点赞
  • 3
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值