登录页面只能使用用户名和密码进行判断，现在的问题就是无论验证码正不正确只要账号密码对了就能登录到主页面

Question

问题遇到的现象和发生背景

登录页面只能使用用户名和密码进行判断，现在的问题就是无论验证码正不正确只要账号密码对了就能登录到主页面。

问题相关代码，请勿粘贴截图

<div class="main">
        <input class="c_Name" type="text" name="username" id="username" placeholder="请输入用户名">
        <input class="c_Password" type="password" name="password" id="password" placeholder="请输入密码">
        <input class="c_codes" type="text" name="code" size=4 placeholder="验证码">
        <div onclick="refresh()" class="c_refresh">换一张</div>
        <div class="c_code"><img id='captcha_img' width="80px" height="40px" src="Kaptcha" onclick="refresh()"></div>
        <input class="c_bgc" type="color" name="color"><span>请选择你的背景颜色</span>
        <input class="c_login2" type="submit" value="登录"  onclick="login()"/>
    </div>

@Controller
public class UserLoginController {
   //登录页面
    @RequestMapping("/LoginHtml")
    public String LoginHtml() {
        return "UserLogin";
    }
    //主页面
    @RequestMapping("/MainHtml")
    public String MainHtml() {
        return "Main";
    }

  @RequestMapping(value = "/Login",method=RequestMethod.POST)
    @ResponseBody
    public boolean login(String username, String password, Model model) {
        model.addAttribute("username",username);
        return userService.LoginIn(username, password);

    }


}

function refresh(){
    document.getElementById("captcha_img").src='Kaptcha?='+new Date().getTime();
}

    //  通过JQuery 获取密码输入框里输入的密码的数据
    function login() {
        var username = $('#username').val();
        var password = $('#password').val();
        var params = {
            "username": username,
            "password": password
        };
        //发送获取的数值到后台
        $.ajax({
            type:"post",
            ansyv:true,
            data:params,
            datatype:"json",
            url:"http://localhost:8080/StudentInfo/Login",
            success:function(data){
                if (data){
                    // alert('登录成功')
                    window.location.href ="http://127.0.0.1:8080/StudentInfo/MainHtml";
                }else{
                    alert('帐号或密码错误');
                }
            },
            error:function(){
                alert("请求出错!");
            }
        })
    }

运行结果及报错内容

我的解答思路和尝试过的方法

将判断成功的验证码以JSON的形式跳转至页面，试过想引用AJAX引入数据，但未能达到想要的结果
 @RequestMapping(value = "/hello",method = RequestMethod.POST)
   @ResponseBody
    public String hello(HttpServletRequest request) {
        if (!CodeUtil.checkVerifyCode(request)) {
            return false;
        } else {
            return true;
        }
    }

我想要达到的结果

页面上验证码错误有提示，错误的不能进入到当前主页面，如果用户登录和验证码都通过了即可进入主页面。

Answer 1

@Controller
public class UserLoginController {
   //登录页面
    @RequestMapping("/LoginHtml")
    public String LoginHtml() {
        return "UserLogin";
    }
    //主页面
    @RequestMapping("/MainHtml")
    public String MainHtml() {
        return "Main";
    }
    
    
    
    
    
    
    
 
  @RequestMapping(value = "/Login",method=RequestMethod.POST)
    @ResponseBody
    public String login(String username, String password, Model model,HttpServletRequest request) {
    
        //图片里的验证码，从seesion中获取。verifyCodeExepected这个为实际的验证码
        String verifyCodeExepected = (String)request.getSession().getAttribute(
                com.google.code.kaptcha.Constants.KAPTCHA_SESSION_KEY);
        //verifyCodeActual这个为输入的验证码。将request中对应的key转换为string类型的
        String verifyCodeActual = HttpServletRequestUtil.getString(request, "code");
        //如果输入验证码与实际验证码不相等或空返回false，如果输入验证码不为空切与实际验证码相等，返回true。
        if(verifyCodeActual == null || !verifyCodeActual.equals(verifyCodeExepected)) {
            
            return "-1";
            
        }else{
        
            model.addAttribute("username",username);
            if(userService.LoginIn(username, password)){
                return "0";
            }else{
                return "-2";
            };
        } 
 
    }
 
 
}

















function refresh(){
    document.getElementById("captcha_img").src='Kaptcha?='+new Date().getTime();
}
 
    //  通过JQuery 获取密码输入框里输入的密码的数据
    function login() {
        var username = $('#username').val();
        var password = $('#password').val();
        var params = {
            "username": username,
            "password": password,
            "code": $("input[name='code']").val()
        };
        //发送获取的数值到后台
        $.ajax({
            type:"post",
            ansyv:true,
            data:params,
            datatype:"json",
            url:"http://localhost:8080/StudentInfo/Login",
            success:function(data){
                if (data == '-1'){
                    refresh();
                    alert('请输入正确的验证码');
                }else if(data == '-2'){
                    alert('帐号或密码错误');
                }else if(data == '0'){
                    // alert('登录成功')
                    window.location.href ="http://127.0.0.1:8080/StudentInfo/MainHtml";
                }
            },
            error:function(){
                alert("请求出错!");
            }
        })
    }