牛客网项目-开发注册功能

前言

本文是对牛客网项目的总结，本文主要讲解页面注册逻辑

1. 当我们点击首页的注册按钮时，会跳转到注册页面，然后再祖册页面提交账号，密码邮箱后会跳转到首页或者直接登录页面进行登录，这个操作可以自己设定

【设计逻辑】 

1. 访问注册页面
   • 点击区域内的连接打开注册页面
2. 提交注册数据
   • 通过表单提交数据

   • 服务端验证账号是否存在，邮箱是否已经注册服务端发送激活邮件

3. 激活注册账号
   • 点击邮件中的连接，访问服务端激活服务。

首先两点在于

1、进行服务端的校验工作，首先用户名可以设置为唯一操作，其次密码长度校验，然后邮箱唯一性和正确性的校验。

2、激活账号，我们会生成一个连接发送到邮箱中，执行服务端的账号激活业务。

【Service层】

public Map register(User user) {
        Map map = new HashMap<>();
        if (user == null) {
            throw new IllegalArgumentException("参数不能为空");
        }
        if (StrUtil.isBlank(user.getUsername())) {
            map.put("usernameMessage", "账号不能为空");
            return map;
        }
        if (StrUtil.isBlank(user.getPassword())) {
            map.put("passwordMessage", "密码不能为空");
            return map;
        }
        User u = userMapper.selectByName(user.getUsername());
        if (u != null) {
            map.put("usernameMessage", "账号已经存在");
            return map;
        }
        u = userMapper.selectByEmail(user.getEmail());
        if (u != null) {
            map.put("emailMessage", "邮箱已经存在");
            return map;
        }
        // 注册用户--设置默认的值
        user.setSalt(CommunityUtil.getRandom5());
        user.setPassword(CommunityUtil.getMd5(user.getPassword() + user.getSalt()));
        user.setType(0);
        // 状态参数为0表示用户尚未激活
        user.setStatus(0);
        // 生成激活码。
        user.setActivationCode(CommunityUtil.getUUID());
        user.setHeaderUrl(String.format("http://images.nowcoder.com/head/%dt.png",new Random().nextInt(1000)));
        user.setCreateTime(new Date());
        userMapper.insertUser(user);
 
        // 发送激活邮件---
        Context context = new Context();
        context.setVariable("email", user.getEmail());
        //"http://localhost:8080/community/activation/101/code";
        String url = domain + contextPath + "/activation" + "/" +user.getId() + "/" + user.getActivationCode();
        context.setVariable("url", url);
 
        String content = templateEngine.process("/mail/activation", context);
        System.out.println(content);
 
        mailClient.sendMail(user.getEmail(),"激活账号",content);
        return map;
    }

【controller层】

@PostMapping("/register")
    public String register(Model model, User user) {
        Map map = userService.register(user);
        if (map == null || map.isEmpty()) {
            model.addAttribute("msg", "注册成功");
            model.addAttribute("target", "/index");
            return "/site/operate-result";
        }
        // 失败则继续返回在登陆页面
        model.addAttribute("usernameMsg", map.get("usernameMsg"));
        model.addAttribute("passwordMessage", map.get("passwordMessage"));
        model.addAttribute("emailMessage", map.get("emailMessage"));
        return "/site/register";
    }

邮件发送

由于邮件发送业务也不是很难，这里找了一个相对详细的进行参考。主要分为以下几步

• 开启邮箱的stmp服务
• 引入配置
• 编写代码

Springboot实现发送邮件功能_12程序猿的博客-CSDN博客

【controller层】账号激活逻辑

@GetMapping(path = "/activation/{userId}/{code}")
    public String activation(Model model, @PathVariable("userId") int userId, @PathVariable("code") String code) {
        int result = userService.activation(userId, code);
        if (result == ACTIVATION_SUCCESS) {
            model.addAttribute("msg", "激活成功");
            model.addAttribute("target", "/login");
        } else if (result == ACTIVATION_REPEATE) {
            model.addAttribute("msg", "已经激活");
            model.addAttribute("target", "/index");
        } else {
            model.addAttribute("msg", "激活失败");
            model.addAttribute("target", "/index");
        }
        return "/site/operate-result";
    }

【service层】

public int activation(int id,String code) {
        User user = userMapper.selectById(id);
        // 如果用户状态为1表示已经激活过了
        if (user.getStatus() == 1){
            return ACTIVATION_REPEATE;
            // 否则判断激活码是否正确进行激活
        } else if (user.getActivationCode().equals(code)) {
            userMapper.updateStatus(id,1);
            return ACTIVATION_SUCCESS;
        }
        // 激活码错误，不能激活
        return ACTIVATION_FAIL;
    }

总结流程

开发注册功能：完成这个功能，客户端需要发送三次请求。

第一次请求：访问注册页面

第二次请求：客户端填写相应的信息与数据，将其发送给服务端。

第三次请求：点击邮件中的链接，访问服务端的

@GetMapping("/register")
public String getRegisterPath() {
    return "/site/register";
}

激活服务。

接下来我们针对这三次请求编写代码。：关键在于thymeleaf一段标签的复用。

首先我们在首页，然后点击注册按钮跳转至注册页面，需要的工作在Controller中添加一个方法给前端返回注册页面的路径，让前端跳转。至此完成第一个请求。

填写完表单之后，点击立即注册，就会访问后端的Controller的一个方法。完成以下几个功能

1、校验数据是否正确

2、将数据插入到数据库中

3、发送激活邮件。

4、返回数据给前端，然后由前端进行页面跳转到操作页面

发送的激活邮件如下：

最后点击此链接进行账号激活。至此注册页面完成。