Spring Boot入门(十六) 之 模拟登录页面

我们在登录页面加上action的位置

然后我们新建一个loginController

package com.zhanshen.springbootweb.controller;

import org.springframework.stereotype.Controller;
import org.springframework.util.StringUtils;
import org.springframework.web.bind.annotation.PostMapping;
import org.springframework.web.bind.annotation.RequestParam;

import java.util.Map;

@Controller
public class LoginController {

    /**
     * 如果是post的请求的话,下边的两种方式都是一样的
     * @return
     */
    //@RequestMapping(value = "/user/login", method = RequestMethod.POST)
    @PostMapping("/user/login")
    public String login(@RequestParam("username") String username,
                        @RequestParam("password") String password,
                        Map<String, Object> map) {
        if(!StringUtils.isEmpty(username) && "123456".equals(password)) {
            //登陆成功  这里我们只要用户名不为空并且密码为123456 就算登陆成功
            return "dashboard";
        } else {
            map.put("msg", "用户名密码错误");
            return "login";
        }
    }
}

然后我们回到前端页面,给用户名和密码添加name,用于跟后台绑定

然后我们重启springboot,然后输入用户名和123456的密码就可以登录进来,不过这个页面缺少了很多CSS样式

假如我们错误登录,那么页面还是转到login.html,我们可以给他添加一个错误提示

我们给添加一个p标签

<!--这里的msg是我们后台传过来的错误提示-->
<!--#strings.isEmpty(xxx)   用来判断xxx是否为空-->
<p style="color: red" th:text="${msg}" th:if="${not #strings.isEmpty(msg)}"></p>

然后按ctrl+F9来编译修改过的前端页面,这样就不用重启服务器,若不行可以在application.properties里边清除缓存

调整好后我们试试错误登录,会给出错误提示

(注意,如果登陆错误的页面的css 如下所示, 则在css的链接文件前加上/)


当我们成功登陆后,刷新页面会发现一个提示

意思是说你是否确认重新提交表单
由于我们是用form表单的post请求转发到的登陆成功页面,所以刷新还是这个表单的锅
于是我们可以利用重定向来定向到这个位置
我们在config里多添加一个重定向,

然后我们在controller中加上转发到main.html

然后重启服务器就可以解决这个问题