(自用)Java学习-5.14(注册，盐值加密，模糊查询)

一、核心功能实现

1. 用户注册功能

前端实现

• 用户名实时校验：通过AJAX异步请求检查用户名是否已存在。

  function checkName() {
    $.ajax({
      url: '/users/checkUserName?uname=' + uname,
      success: function(resp) {
        if (resp.code == 200) alert("用户名可用");
        else $("#info").html("<font color='red'>用户名已被注册</font>");
      }
    });
  }

• 密码一致性校验：提交前验证两次输入的密码是否一致

  if (ps != rps) {
    alert("两次密码输入不一致");
    return;
  }

• 表单提交：使用serialize()方法序列化表单数据并发送POST请求。

  $.ajax({
    url: '/users/register',
    data: $("#form-reg").serialize(),
    success: function(resp) {
      if (resp.code == 200) window.location.href = "/login.html";
    }
  });

后端实现

• 控制器层：处理注册请求，返回JSON结果。

  @RestController
  @RequestMapping("/users")
  public class UserController {
      @PostMapping("/register")
      public JsonResult register(User user) {
          boolean flag = userService.register(user);
          return flag ? new JsonResult(OK) : new JsonResult(FALL);
      }
  }

• 服务层：密码加密（MD5加盐）及用户数据持久化。

  public boolean register(User user) {
      String md5Password = getMd5Password(user.getPassword(), user.getUsername());
      user.setPassword(md5Password);
      return userMapper.insert(user) > 0;
  }

• 数据层：通过MyBatis操作数据库。

  <insert id="register">
    INSERT INTO t_user (username, password, salt) 
    VALUES (#{username}, #{password}, #{salt});
  </insert>

---

2. 用户登录功能

前端实现

• 回车键触发登录：监听键盘事件，回车键提交表单。

  $(window).keydown(function(e) {
    if (e.keyCode == 13) $("#btn-login").click();
  });

• 登录请求：提交用户名和密码至后端验证。

  $.ajax({
    url: '/users/login',
    data: $("#form-login").serialize(),
    success: function(resp) {
      if (resp.code == 200) window.location.href = "/index.html";
    }
  });

后端实现

• 控制器层：验证用户信息并存储会话。

  @PostMapping("/login")
  public JsonResult login(User user, HttpSession session) {
      User dbUser = userService.login(user);
      session.setAttribute("uid", dbUser.getUid());
      return new JsonResult(OK);
  }

• 服务层：校验用户状态与密码。

  public User login(User user) {
      User dbUser = userMapper.getUserByUsername(user.getUsername());
      if (dbUser == null) throw new UserNotFoundException("用户不存在");
      if (!validatePassword(user.getPassword(), dbUser.getSalt(), dbUser.getPassword())) {
          throw new PasswordNotMatchException("密码错误");
      }
      return dbUser;
  }

---

二、安全与优化策略

1. 密码安全

• 加密方式：使用MD5加盐（盐值为用户名）加密密码。

  private String getMd5Password(String password, String salt) {
      for (int i = 0; i < 3; i++) {
          password = DigestUtils.md5DigestAsHex((salt + password + salt).getBytes());
      }
      return password;
  }

• 改进建议：推荐使用BCrypt等更安全的哈希算法，并生成随机盐值。

2. 防御措施

• SQL注入防护：通过MyBatis参数绑定（#{param}）避免注入。

• 会话管理：用户登录后通过Session存储UID，敏感操作需校验Session有效性。

• 输入校验：后端需重复验证用户名和密码格式（如长度、特殊字符）。

---

三、页面状态管理

1. 动态菜单显示

• 未登录状态：显示“登录”和“注册”链接。

  if (id == 0) {
    $("#mymenu").append("<li><a href='/login'>登录</a></li>");
  }

• 已登录状态：显示用户ID和“退出”按钮。

  if (id != 0) {
    $("#mymenu").append("<li>用户ID：" + id + "</li>");
    $("#mymenu").append("<li><a href='javascript:logout()'>退出</a></li>");
  }

---

四、商品检索功能

1. 前端实现

• 搜索表单提交：跳转至搜索页并携带参数。

  <form action="/search.html" onsubmit="return validateSearch()">
    <input type="text" id="search" name="keyword">
    <button type="submit">搜索</button>
  </form>

• 解析URL参数：获取关键字并发送请求。

  const keyword = new URLSearchParams(window.location.search).get("keyword");
  $.ajax({
    url: '/product/search?keyword=' + keyword,
    success: function(resp) { /* 渲染结果 */ }
  });

2. 后端实现

• 模糊查询：通过SQL的LIKE实现。

  <select id="searchProducts">
    SELECT * FROM t_product WHERE title LIKE CONCAT('%', #{keyword}, '%');
  </select>