基于springboot的登录界面
时间: 2023-10-19 20:04:24 浏览: 44
下面是一个基于Spring Boot的简单登录页面示例代码:
首先,创建一个名为`LoginController`的控制器类,该类处理用户登录和返回登录页面:
```java
@Controller
public class LoginController {
@GetMapping("/login")
public String showLoginForm() {
return "login";
}
@PostMapping("/login")
public String login(@RequestParam String username, @RequestParam String password) {
if("admin".equals(username) && "123456".equals(password)) {
return "redirect:/dashboard";
} else {
return "redirect:/login?error";
}
}
}
```
在`showLoginForm`方法中,我们使用`@GetMapping`注释将请求映射到`/login`并返回登录页面。
在`login`方法中,我们使用`@PostMapping`注释将请求映射到`/login`并检查用户名和密码是否正确。如果用户输入的用户名和密码是正确的,则将用户重定向到仪表板页面。否则,将用户重定向到登录页面并显示错误消息。
接下来,我们需要创建一个名为`login.html`的HTML模板文件。在该文件中,我们将创建一个表单,用户可以输入用户名和密码并提交表单以进行登录:
```html
<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head>
<meta charset="UTF-8">
<title>Login Page</title>
</head>
<body>
<h1>Login Page</h1>
<form th:action="@{/login}" method="post">
<label for="username">Username:</label>
<input type="text" name="username" id="username"><br><br>
<label for="password">Password:</label>
<input type="password" name="password" id="password"><br><br>
<input type="submit" value="Login">
</form>
<br>
<p th:if="${param.error}">Invalid username and/or password</p>
</body>
</html>
```
在表单中,我们使用`th:action`属性指定表单提交到`/login`。我们还为用户名和密码字段添加标签并将表单提交按钮放在底部。
我们使用Thymeleaf模板引擎的条件语句(`th:if="${param.error}"`)来检查是否有错误消息传递给登录页面。如果检测到错误,则显示错误消息。
最后,我们需要在`application.properties`文件中配置端口号、视图解析器和静态资源路径:
```properties
server.port=8080
spring.mvc.view.prefix=/WEB-INF/views/
spring.mvc.view.suffix=.html
spring.resources.static-locations=classpath:/static/
```
将静态资源文件(例如CSS和JavaScript文件)放在`src/main/resources/static`目录下。
这就是一个基于Spring Boot的简单登录页面的实现。