我对模态有疑问。我的登录信息是通过模式登录的，它在百里香布局模板的导航栏中，是除登录信息以外所有页面的组件。可以，但是如果登录错误，它将返回到全尺寸页面而不是模式页面，为什么不呢？
编辑1 的背面我使用SpringBoot，Spring Security和UserDetailsService
https://e-commerce-springboot.herokuapp.com/
这是layout.hmtl
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml"
xmlns:th="http://www.thymeleaf.org"
xmlns:layout="http://www.ultraq.net.nz/thymeleaf/layout"
xmlns:sec="http://www.thymeleaf.org/thymeleaf-extras-springsecurity3">
<meta charset="utf-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<title layout:title-pattern="$LAYOUT_TITLE - $CONTENT_TITLE">Buy-A-Thing</title>
<meta
content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no"
name="viewport" />
<link rel="stylesheet" type="text/css"
th:href="@{/webjars/bootstrap/3.3.7/css/bootstrap.min.css}" />
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1 /jquery.min.js"></script>
<script src="//netdna.bootstrapcdn.com/bootstrap/3.1.1 /js/bootstrap.min.js"></script>
<link rel="stylesheet" type="text/css"
href="//netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap.min.css">
<head>
<style>
@import url(https://fonts.googleapis.com/css?family=Lobster);
.footer {
position: fixed;
left: 0;
bottom: 0;
width: 100%;
background-color: black;
color: white;
height: 20px;
text-align: center;
}
.glyphicon {
font-size: 17px;
}
h6 {
margin: 5px;
}
#homeButton{
font-family:Lobster;
font-size:20px;
}
#userNameDisplay {
color: rgba(250, 250, 250, 0.4);
margin: 15px;
}
</style>
</head>
<body>
<nav id="navbar" class="navbar navbar-inverse navbar-fixed-top">
<div class="container-fluid">
<div class="navbar-header">
<a class="navbar-brand active" id="homeButton" th:href="@{/}">Buy-A-Thing</a>
<button type="button" class="navbar-toggle" data-toggle="collapse"
data-target="#myNavbar">
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
</div>
<div class="collapse navbar-collapse" id="myNavbar">
<ul class="nav navbar-nav navbar-right">
<!-- <li id="userNameDisplay" sec:authorize="isAuthenticated()"
th:text="${#authentication.principal.username}">
</li>-->
<li sec:authorize="isAuthenticated()"><a
class="dropdown-toggle" data-toggle="dropdown" href="#" th:text="${#authentication.principal.username}">
<span class="caret"></span>
</a>
<ul class="dropdown-menu">
<li sec:authorize="hasRole('ROLE_ADMIN')">
<a th:href="@{/admin}">Administrator</a>
</li>
<li>
<a th:href="${'/user/' + #authentication.principal.username}">User</a>
</li>
</ul>
</li>
<li sec:authorize="!isAuthenticated()">
<a th:href="@{/registration}" data-target="#theModalRegistration"
data-toggle="modal"><span class="glyphicon glyphicon-user"></span>
Sign Up</a>
</li>
<li sec:authorize="!isAuthenticated()">
<a th:href="@{/login}"
data-target="#theModalLogin" data-toggle="modal"> <span
class="glyphicon glyphicon-log-in"></span>Login
</a>
</li>
<li sec:authorize="isAuthenticated()">
<a th:href="@{/cartOfUser/}" role="dialog"
data-target="#theModalCart" data-toggle="modal"> <span
class="glyphicon glyphicon-shopping-cart"></span>
</a>
</li>
<li sec:authorize="isAuthenticated()"><a th:href="@{/logout}"><span
class="glyphicon glyphicon-log-out"></span> Logout</a>
</li>
</ul>
</div>
</div>
</nav>
<div class="modal fade text-center" id="theModalLogin">
<div class="modal-dialog">
<div class="modal-content"></div>
</div>
</div>
<div class="modal fade text-center" id="theModalRegistration">
<div class="modal-dialog">
<div class="modal-content"></div>
</div>
</div>
<div class="modal fade text-center" id="theModalCart">
<div class="modal-dialog">
<div class="modal-content"></div>
</div>
</div>
<div class="container">
<div layout:fragment="custom-content">
<!-- Your Page Content Here -->
</div>
</div>
<div class="footer">
<h6>@2019 Buy-A-Thing</h6>
</div>
</body>
</html>
这是login.html
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml"
xmlns:th="http://www.thymeleaf.org"
xmlns:layout="http://www.ultraq.net.nz/thymeleaf/layout"
xmlns:sec="http://www.thymeleaf.org/thymeleaf-extras-springsecurity3"
>
<head>
<meta charset="utf-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<link rel="stylesheet" type="text/css"
th:href="@{/webjars/bootstrap/3.3.7/css/bootstrap.min.css}" />
<title>Login</title>
</head>
<body>
<!-- Modal content-->
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal">× </button>
<h5 class="modal-title">Login</h5>
</div>
<div class="modal-body">
<div class="row">
<div class="col-md-6 col-md-offset-3">
<h1>Login</h1>
<form th:action="@{/login}" method="post">
<div th:if="${param.error}">
<div class="alert alert-danger">Invalid username or
password.</div>
</div>
<div th:if="${param.logout}">
<div class="alert alert-info">You have been logged out.</div>
</div>
<div class="form-group">
<label for="username">Email</label>: <input type="text"
id="username" name="username" class="form-control"
autofocus="autofocus" placeholder="Username" />
</div>
<div class="form-group">
<label for="password">Password</label>: <input type="password"
id="password" name="password" class="form-control"
placeholder="Password" />
</div>
<div class="form-group">
<label>
<input type="checkbox" name="remember-me">
Remember me</label>
</div>
<div class="form-group">
<div class="row">
<div class="col-sm-6 col-sm-offset-3">
<input type="submit" name="login-submit" id="login-submit"
class="form-control btn btn-primary" value="Log In" />
</div>
</div>
</div>
<div class="form-group">
<span>New user? <a href="/" th:href="@{/registration}">Register
here</a></span>
</div>
</form>
</div>
</div>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
</div>
<script type="text/javascript"
th:src="@{/webjars/jquery/3.2.1/jquery.min.js/}"></script>
<script type="text/javascript"
th:src="@{/webjars/bootstrap/3.3.7/js/bootstrap.min.js}"></script>
</body>
</html>
antMatchers
@Override
protected void configure(HttpSecurity http) throws Exception {
http
.anonymous()
.and()
.authorizeRequests()
.antMatchers("/login")
.permitAll()
.antMatchers("/admin/**").hasRole("ADMIN")
.antMatchers(
"/**",
"/products**",
"/registration**",
"/js/**",
"/css/**",
"/fonts.googleapis.com/css**",
"/img/**",
"/webjars/**").permitAll()
.anyRequest().authenticated()
.and()
.formLogin()
.loginPage("/login")
.defaultSuccessUrl("/products", true)
.permitAll()
.and()
.logout()
.invalidateHttpSession(true)
.clearAuthentication(true)
.logoutRequestMatcher(new AntPathRequestMatcher("/logout"))
.logoutSuccessUrl("/products")
.deleteCookies("my-remember-me-cokie")
.permitAll()
.and()
.rememberMe()
//.key("my-secure-key")
.rememberMeCookieName("my-remember-me-cookie")
.tokenRepository(persistentTokenRepository())
.tokenValiditySeconds(24 * 60 * 60)
.and()
.exceptionHandling();
}
控制器
@GetMapping("/login")
public String login(Model model) {
return "login";
}
谢谢！