登錄頁面
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml"
xmlns:th="http://www.thymeleaf.org">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta name="description" content="">
<meta name="keys" content="">
<meta name="author" content="">
<link rel="stylesheet" th:href="@{/webjars/bootstrap/4.1.3/css/bootstrap.min.css}">
<link rel="stylesheet" th:href="@{/css/font-awesome.min.css}">
<link rel="stylesheet" th:href="@{/css/login.css}">
<style>
</style>
</head>
<body>
<nav class="navbar navbar-inverse navbar-fixed-top" role="navigation">
<div class="container">
<div class="navbar-header">
<!--<div><a class="navbar-brand" href="index.html" style="font-size:32px;">學習平臺</a></div>-->
</div>
</div>
</nav>
<div class="container">
<form class="form-signin" id="loginForm" role="form">
<h2 class="form-signin-heading"><i class="glyphicon glyphicon-user"></i> 用戶登錄</h2>
<div class="form-group has-success has-feedback">
<input type="text" class="form-control" id="loginacct" name="loginacct" placeholder="請輸入登錄賬號" autofocus>
<span class="glyphicon glyphicon-user form-control-feedback"></span>
</div>
<div class="form-group has-success has-feedback">
<input type="text" class="form-control" id="userpswd" name="userpswd" placeholder="請輸入登錄密碼"
style="margin-top:10px;">
<span class="glyphicon glyphicon-lock form-control-feedback"></span>
</div>
<div class="form-group has-success has-feedback">
<select class="form-control">
<option value="member">會員</option>
<option value="user">管理</option>
</select>
</div>
<div class="checkbox">
<label>
<input type="checkbox" value="remember-me"> 記住我
</label>
<br>
<label>
忘記密碼
</label>
<label style="float:right">
<a href="reg.html">我要註冊</a>
</label>
</div>
<a class="btn btn-lg btn-success btn-block" onclick="dologin()"> 登錄</a>
</form>
</div>
<script th:src="@{/webjars/jquery/3.4.1/dist/jquery.min.js}" src="jquery/jquery-2.1.1.min.js"></script>
<script th:src="@{/webjars/bootstrap/4.1.3/js/bootstrap.min.js}" src="bootstrap/js/bootstrap.min.js"></script>
<script th:src="@{layer/layer.js}"></script>
<script>
function dologin() {
// 非空校驗
var loginacct = $("#loginacct").val();
var userpswd = $("#userpswd").val();
if (loginacct == "") {
layer.msg("用戶登錄賬號不能爲空，請輸入", {time: 2000, icon: 5, shift: 6}, function () {
});
return;
}
if (userpswd == "") {
//alert("用戶登錄密碼不能爲空，請輸入");
layer.msg("用戶登錄密碼不能爲空，請輸入", {time: 2000, icon: 5, shift: 6}, function () {
});
return;
}
// 提交表單
// alert("提交表單");
//$("#loginForm").submit();
// 使用AJAX提交數據
var loadingIndex = null;
var usedata = {};
usedata['loginacct']= loginacct;
usedata['userpswd']= userpswd;
$.ajax({
type: "POST",
contentType: "application/json",
url: "/dologin",
data: JSON.stringify(usedata),
beforeSend: function () {
loadingIndex = layer.msg('處理中', {icon: 16});
}, success: function (result) {
layer.close(loadingIndex);
if (result.success) {
window.location.href = "main";
} else {
layer.msg("用戶登錄賬號或密碼不正確，請重新輸入", {time: 2000, icon: 5, shift: 6}, function () {
});
}
}
});
}
</script>
</body>
</html>
服務端頁面
import com.jth.pojo.ResultInfo;
import com.jth.pojo.User;
import lombok.extern.log4j.Log4j;
import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.*;
import javax.servlet.http.HttpSession;
import javax.validation.Valid;
/**
* @author liwen406
* @Title: DispatcherController
* @Description:
* @date 2019/5/8 / 20:47
*/
@Log4j
@Controller
public class DispatcherController {
@GetMapping("/{page}")
public String pagea(@PathVariable String page) {
return page;
}
@ResponseBody
@PostMapping("/dologin")
public Object login(@Valid @RequestBody User user, HttpSession session) {
log.info("提交表單數據爲："+user);
ResultInfo result = new ResultInfo();
if (user.getLoginacct().equals("admin") && user.getUserpswd().equals("admin")) {
result.setSuccess(true);
} else {
result.setSuccess(false);
}
return result;
}
}
pojo
import lombok.AllArgsConstructor;
import lombok.Data;
import lombok.NoArgsConstructor;
import lombok.experimental.Accessors;
/**
* @author liwen406
* @Title: ResultInfo
* @Description: 回調方法數據
* @date 2019/5/8 / 21:20
*/
@Data
@NoArgsConstructor
@AllArgsConstructor
@Accessors(chain = true)
public class ResultInfo {
private boolean success;
private Object data;
}
import lombok.AllArgsConstructor;
import lombok.Data;
import lombok.NoArgsConstructor;
import java.io.Serializable;
/**
* @author liwen406
* @Title: User
* @Description:
* @date 2019/5/8 / 20:39
*/
@Data
@NoArgsConstructor
@AllArgsConstructor
public class User implements Serializable {
private Integer id;
private String username;
private String loginacct;
private String userpswd;
private String email;
private String createtime;
}
結果
2019-05-09 12:44:35.218 INFO 11284 --- [nio-8080-exec-1] o.a.c.c.C.[Tomcat].[localhost].[/] : Initializing Spring DispatcherServlet 'dispatcherServlet'
2019-05-09 12:44:35.218 INFO 11284 --- [nio-8080-exec-1] o.s.web.servlet.DispatcherServlet : Initializing Servlet 'dispatcherServlet'
2019-05-09 12:44:35.226 INFO 11284 --- [nio-8080-exec-1] o.s.web.servlet.DispatcherServlet : Completed initialization in 8 ms
[SeleniumAutoConsole] INFO [http-nio-8080-exec-1] com.jth.controller.DispatcherController.login(31) | 提交表單數據爲：User(id=null, username=null, loginacct=121, userpswd=admin, email=null, createtime=null)
2019-05-09 12:44:37.361 INFO 11284 --- [ Thread-47] o.s.s.concurrent.ThreadPoolTaskExecutor : Shutting down ExecutorService 'applicationTaskExecutor'