没有跳转和登陆失败提示​

package com.imooc.reader.service.impl;

import com.baomidou.mybatisplus.core.conditions.query.QueryWrapper;
import com.imooc.reader.entity.Member;
import com.imooc.reader.mapper.MemberMapper;
import com.imooc.reader.service.MemberService;
import com.imooc.reader.service.exception.MemberException;
import com.imooc.reader.utils.Md5Utils;
import org.springframework.stereotype.Service;
import org.springframework.transaction.annotation.Propagation;
import org.springframework.transaction.annotation.Transactional;

import javax.annotation.Resource;
import java.util.Date;
import java.util.List;
import java.util.Random;

@Service
@Transactional(propagation = Propagation.NOT_SUPPORTED,readOnly = true)
public class MemberServiceImpl implements MemberService {
    @Resource
    private MemberMapper memberMapper;
    @Transactional(rollbackFor = Exception.class)
    @Override
    public Member createMember(String username, String password, String nickname) {
        QueryWrapper<Member> wrapper = new QueryWrapper<>();
        wrapper.eq("username", username);
        List<Member> members = memberMapper.selectList(wrapper);
        if(members.size() > 0 ){
            throw new MemberException("用户已存在");
        }
        Member member = new Member();
        member.setUsername(username);
        member.setNickname(nickname);
        member.setCreateTime(new Date());
        int salt = new Random().nextInt(1000) + 1000;
        member.setSalt(salt);
        String md5 = Md5Utils.md5Digest(password, salt);
        member.setPassword(md5);
        memberMapper.insert(member);
        return member;
    }

    @Override
    public Member checkLogin(String username, String password) {
        QueryWrapper<Member> wrapper = new QueryWrapper();
        wrapper.eq("username", username);
        Member member = memberMapper.selectOne(wrapper);
        if(member == null){
            throw new MemberException("用户不存在");
        }
        String md5 = Md5Utils.md5Digest(password, member.getSalt());
        if(!md5.equals(member.getPassword())){
            throw new MemberException("您输入的密码有误");
        }
        return member;
    }
}

package com.imooc.reader.controller;

import com.imooc.reader.entity.Member;
import com.imooc.reader.service.MemberService;
import com.imooc.reader.utils.ResponseUtils;
import org.springframework.web.bind.annotation.PostMapping;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.RestController;

import javax.annotation.Resource;
import javax.servlet.http.HttpServletRequest;

@RestController
@RequestMapping("/api/member")
public class MemberController {
    @Resource
    private MemberService memberService;
    @PostMapping("/registe")
    public ResponseUtils registe(String username, String password , String nickname , String vc , HttpServletRequest request){
        String verifyCode = (String)request.getSession().getAttribute("kaptchaVerifyCode");
        ResponseUtils resp ;
        if(vc == null || verifyCode == null || !vc.equalsIgnoreCase(verifyCode)){
            resp = new ResponseUtils("VerifyCodeError", "验证码错误");
        }else{
            resp = new ResponseUtils();
            //验证码比对成功后进行用户注册
            try {
                Member member = memberService.createMember(username, password, nickname);
                resp = new ResponseUtils();
            }catch (Exception e){
                e.printStackTrace();
                resp = new ResponseUtils(e.getClass().getSimpleName(), e.getMessage());
            }
        }
        return resp;
    }
    @PostMapping("/check_login")
    public ResponseUtils checkLogin(String username , String password, String vc , HttpServletRequest request){
        String verifyCode = (String)request.getSession().getAttribute("kaptchaVerifyCode");
        ResponseUtils resp ;
        if(vc == null || verifyCode == null || !vc.equalsIgnoreCase(verifyCode)){
            resp = new ResponseUtils("VerifyCodeError", "验证码错误");
        }else{
            resp = new ResponseUtils();
            //验证码比对成功后进行用户登录查询
            try {
                Member member = memberService.checkLogin(username, password);
                member.setPassword(null);
                member.setSalt(null);
                resp = new ResponseUtils().put("member" , member);
            }catch (Exception e){
                e.printStackTrace();
                resp = new ResponseUtils(e.getClass().getSimpleName(), e.getMessage());
            }
        }
        return resp;
    }
}

package com.imooc.reader.service;

import com.imooc.reader.entity.Member;

public interface MemberService {
    public Member createMember(String username,String password,String nickname);
    public Member checkLogin(String username,String password);

}

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width,initial-scale=1.0, maximum-scale=1.0,user-scalable=no">
    <title>慕课书评网</title>
    <!-- 引入样式文件 -->
    <link rel="stylesheet"
          href="/assets/vant/index.css"/>

    <!-- 引入 Vue 和 Vant 的 JS 文件 -->
    <script src="/assets/vue/vue.global.js"></script>
    <script src="/assets/vant/vant.min.js"></script>
    <script src="/assets/axios/axios.js"></script>
</head>
<body>
<div id="app">
    <van-nav-bar right-text="会员注册" @click-right="directRegister">
        <template #left>
            <a href="/" style="padding-top: 10px">
                <img src="/images/logo2.png" style="width: 80px">
            </a>
        </template>
    </van-nav-bar>
    <h3 style="padding-left:32px">会员登录</h3>
    <van-form ref="loginForm">
        <van-cell-group inset>
            <van-field
                    v-model="username"
                    name="用户名"
                    label="用户名"
                    autocomplete="off"
                    placeholder="请输入用户名"
                    :rules="[{ required: true, message: '请填写用户名' }]"
            />
        </van-cell-group>
        <van-cell-group inset>
            <van-field
                    v-model="password"
                    type="password"
                    name="密码"
                    label="密码"
                    placeholder="请输入密码"
                    :rules="[{ required: true, message: '请填写密码' }]"
            />
        </van-cell-group>
        <van-cell-group inset>
            <van-row>
                <van-col span="16">
                    <van-field
                            v-model="verifyCode"
                            name="verifyCode"
                            label="验证码"
                            placeholder="请输入验证码"
                            autocomplete="off"
                            :rules="[{ required: true, message: '请填写验证码' }]"
                    />
                </van-col>
                <van-col span="8">
                    <img id="imgVerifyCode" src="/api/verify_code"
                         style="width: 100%;height:44px;cursor: pointer" @click="reloadVerifyCode">
                </van-col>
            </van-row>
        </van-cell-group>
        <div style="margin: 16px;">
            <van-button round block type="primary" @click="onSubmit('loginForm')">
                登录
            </van-button>
        </div>
    </van-form>
</div>
<script>

    const Main = {
        data() {
            return {
                username: "",
                password: "",
                verifyCode: ""
            }
        }
        , methods: {
            onSubmit: function (formName) {
                const form = this.$refs[formName];
                const objApp = this;
                form.validate().then(function(){
                    //这里组织表单验证后登录代码
                    const params = new URLSearchParams();
                    params.append("username", objApp.username);
                    params.append("password", objApp.password);
                    params.append("vc", objApp.verifyCode);
                    axios.post("/api/member/check_login" , params)
                        .then(function(response){
                            const json = response.data;
                            if(json.code == "0"){
                                sessionStorage.mid = json.data.member.memberId;
                                window.location = "/index.html";
                            }else{
                                objApp.reloadVerifyCode();
                                vant.Dialog.alert({
                                    title : "登录失败",
                                    message : json.message
                                })
                            }
                        })
                }).catch(function(e){console.debug("表单验证失败",e)});
            }
            , directRegister: function () {
                window.location.href = '/register.html';
            }
            , reloadVerifyCode: function () {
                document.getElementById("imgVerifyCode").src = "/api/verify_code?ts=" + new Date().getTime();
            }
        }
        , mounted() {

        }
    };
    const app = Vue.createApp(Main);
    app.use(vant);
    app.use(vant.Lazyload);
    app.mount("#app");
</script>
</body>
</html>