springboot+mybatis+vue前后端分离实现用户登陆注册功能

package com.example.demo.controller;import com.example.demo.entity.User;import com.example.demo.service.UserService;import com.example.demo.utils.Md5Util;import io.swagger.annotations.Api;import io.swagger.annotations.ApiOperation;import org.slf4j.Logger;import org.slf4j.LoggerFactory;import org.springframework.beans.factory.annotation.Autowired;import org.springframework.util.StringUtils;import org.springframework.web.bind.annotation.*;import javax.servlet.http.HttpServletResponse;import javax.servlet.http.HttpSession;import java.text.SimpleDateFormat;import java.util.Date;import java.util.HashMap;import java.util.Map;
/** * @author: 关注微信公众号《web项目开发》 */
@Api(description = "用户接口")@RestController@RequestMapping("/user")@CrossOriginpublic class UserController {
    private static final Logger logger = LoggerFactory.getLogger(UserController.class);
    @Autowired    private UserService userService;
    @RequestMapping("test")    @ResponseBody    public String getData() {        return "String";    }
    @ApiOperation(value = "用户注册", notes = "用户注册")    @RequestMapping(value = "/register", method = RequestMethod.POST)    @CrossOrigin    public Map<String, Object> register(@RequestParam String userName,                                        @RequestParam String passwd) {        Map<String, Object> map = new HashMap<String, Object>();        if (StringUtils.isEmpty(userName) || StringUtils.isEmpty(passwd)) {            map.put("msg", "用户名和密码不能为空");            return map;        }        // 验证用户名是否已经注册        User exsitUser = userService.selectByName(userName);        if (exsitUser != null) {            map.put("msg", "该用户名已存在!");            return map;        }        SimpleDateFormat sdf = new SimpleDateFormat("yyyy-MM-dd HH:mm:ss");        String format = sdf.format(new Date());        User user = new User();        user.setUserName(userName);        user.setRegistTime(format);        user.setStatus("1");        user.setPasswd(Md5Util.MD5(passwd) + userName);        int count = userService.insert(user);        System.out.println(count);        if (count != 1) {            map.put("msg", "注册失败");            return map;        }        map.put("msg", "注册成功");        return map;    }
    @ApiOperation(value = "用户登录", notes = "用户登录")    @RequestMapping(value = "/login", method = RequestMethod.POST)    @CrossOrigin    public Map<String, Object> login(@RequestParam String userName,                                     @RequestParam String passwd,                                     HttpSession session,                                     HttpServletResponse response) {        Map<String, Object> map = new HashMap<String, Object>();        User exsitUser = userService.selectByName(userName);        if (exsitUser == null) {            map.put("msg", "该用户未注册");            return map;        }        if (!exsitUser.getPasswd().equals(Md5Util.MD5(passwd) + userName)) {            map.put("msg", "密码错误,请重新输入");            return map;        }        session.setAttribute("loginUser", exsitUser);        map.put("msg", "登录成功");        return map;    }}//注册的时候密码涉及到md5加密

<template>  <div>    <div class="top_div">div>      <p style="padding: 30px 0px 10px; position: relative;"><span        class="u_logo">span> <input id="loginName" class="ipt" type="text" v-model="userName" placeholder="请输入用户名"                                      value="">      p>      <p style="position: relative;"><span class="p_logo">span>        <input class="ipt" id="password" type="password" v-model="password" placeholder="请输入密码" value="">      p>      <p style="position: relative;margin-top: 10px;"><span class="p_logo">span>        <input class="ipt" id="password2" type="password" v-model="password2" placeholder="请输入密码" value="">      p>

      <div id="errorText" style="height: 20px;margin-top:10px">        <p style="color: red;display: none">用户名密码错误请从新输入p>      div>      <div        style="height: 50px; line-height: 50px; margin-top: 30px; border-top-color: rgb(231, 231, 231); border-top-width: 1px; border-top-style: solid;">                        <router-link to='/'>          <span style="float: left;margin-left: 10px;font-size: 14px;">已有账号，现在登录span>        router-link>
        <span style="float: right;">              <a id="loginBtn" @click="register()">注册a>           span>div>    div>  div>template>
<script>  export default {    name: 'Register',    data() {      return {        userName: "",        password: "",        password2: ""      }    },    created() {
    },    methods: {      register: function () {        let fd = new FormData();        fd.append("userName", this.userName);        fd.append("passwd", this.password);
        let config = {          headers: {            'Content-Type': 'multipart/form-data'          }        }        if (this.password === this.password2) {          this.$axios.post("user/register", fd, config).then(res => {            alert(res.data.msg)          }).catch(res => {            alert(res.data.msg)          })        } else {          alert("两次输入的密码不同")        }      }    }  }script>