相关阅读：
X-admin2.2打开页面（添加弹窗），执行成功后如何关闭弹出窗口和刷新table表格内容？
Spring Boot+JPA微服务中数据更新问题(update)
Spring Boot集成X-admin2.2时，Layui字体图标无法正常显示或乱码问题解决方法
ZTree工具类汇总，包括：新增、编辑和删除节点，并提交后台
X-admin是基于LayUi的轻量级前端后台管理框架，简单免费且兼容性好，面向所有层次的前后端程序。
项目创立于2017年初，为了敏捷WEB应用开发和简化企业应用开发而诞生的。X-admin从诞生以来一直秉承简洁实用的设计原则，在保持出色的性能和至简的代码的同时，也注重易用性。并且拥有众多的原创功能和特性。
所以，最近在基于此框架，开发一套自己的后台管理系统，目前是基于X-admin2.2+Spring Boot+Framework实现。
下面介绍一下第一步：登录实现
前端代码：
<!doctype html>
<html class="x-admin-sm">
<head>
<meta charset="UTF-8">
<title>信息管理系统</title>
<link rel="stylesheet" href="/dist/layui/css/font.css">
<link rel="stylesheet" href="/dist/layui/css/login.css">
<link rel="stylesheet" href="/dist/layui/css/xadmin.css">
<#include "/layui/style.ftl"/>
</head>
<body class="login-bg">
<div class="login layui-anim layui-anim-up">
<div class="message">x-admin2.0-管理登录</div>
<div id="darkbannerwrap"></div>
<form method="POST" class="layui-form">
<input id="username" name="username" placeholder="用户名" type="text"
lay-verify="required" class="layui-input">
<hr class="hr15">
<input id="password" name="password" lay-verify="required"
placeholder="密码" type="password" class="layui-input">
<hr class="hr15">
<input value="登录" lay-submit="" lay-filter="login"
style="width: 100%;" type="submit">
<hr class="hr20">
</form>
</div>
</body>
layui.use([ 'form' ], function() {
var form = layui.form;
// 表单提交
form.on('submit(login)', function(data) {
console.log(data.field);
$.ajaxSettings.async = false;//设置同步调用
$.post("/login", data.field, function(LoginResult) { // 请求处理
result = JSON.parse(LoginResult);
if (result["sucess"] == "true" || result["sucess"] == true) {
layer.msg(result["message"], function() {
window.location.href = result["view"];//登录成功后跳转到相应的界面；
});
} else {
layer.msg(result["message"], {
icon : 1,
time : 2000
});
}
}, "json");
$.ajaxSettings.async = true;//改回异步调用
return false;
});
});
</html>
需要注意的是：$.ajaxSettings.async = false;和$.ajaxSettings.async = true;两行代码；
后端代码如下：
@PostMapping(value = "/login")
public void login(HttpServletResponse response, String username, String password,
@RequestParam(value = "rememberMe", defaultValue = "0") Boolean rememberMe, ModelMap model,
HttpServletRequest request) {
Map<String, String> result = new HashMap<String, String>();
Result<User> datas = executeLogin(username, password, rememberMe);
if (datas.isOk()) {
result.put("message", "登录成功！");
result.put("sucess", "true");
result.put("view", "/home");
} else {
result.put("message", datas.getMessage());
result.put("sucess", "false");
result.put("view", "/login");
}
log.info(datas.getMessage());
writeJSON(response, JSONObject.fromObject(result).toString());
}
public static void writeJSON(HttpServletResponse response, Object obj) {
ObjectMapper mapper = new ObjectMapper();
JsonFactory factory = mapper.getJsonFactory();
response.setContentType("text/html;charset=utf-8");
JsonGenerator responseJsonGenerator;
try {
responseJsonGenerator = factory.createJsonGenerator(response.getOutputStream(), JsonEncoding.UTF8);
responseJsonGenerator.writeObject(obj);
} catch (IOException e) {
e.printStackTrace();
}
}
以上即为登录的前后台实现。
