layui请求加token_layui的一个登录和权限示例

layui是一个专门为后台而设计的一个前端框架，功能强大，特别适合后端开发人员，本文以一个demo把登录模块和权限模块基本原理说明，详细的内容可以参考layui的官方文档，git地址

搭建项目

项目架构是springboot+thymeleaf+layui，结构如下图，文件有点多，分成两张图

image.png

image.png

其中resources资源文件里的layui文件夹下就是layui的所有文件，内容需要到官网下载，解压后全部复制即可

pom.xml

xsi:schemaLocation="http://maven.apache.org/POM/4.0.0 http://maven.apache.org/xsd/maven-4.0.0.xsd">

4.0.0

org.springframework.boot

spring-boot-starter-parent

2.1.2.RELEASE

com.haijunyin

layuidemo-permission

0.0.1-SNAPSHOT

layuidemo-permission

Demo project for Spring Boot

war

1.8

org.springframework.boot

spring-boot-starter-web

org.springframework.boot

spring-boot-starter-tomcat

javax.servlet

javax.servlet-api

4.0.0

provided

org.thymeleaf

thymeleaf

3.0.11.RELEASE

org.thymeleaf

thymeleaf-spring4

3.0.11.RELEASE

org.springframework.boot

spring-boot-starter-thymeleaf

org.springframework.boot

spring-boot-starter-test

test

org.springframework.boot

spring-boot-maven-plugin

application.properties

#thymelea模板配置

xspring.thymeleaf.prefi=classpath:/templates/

spring.thymeleaf.suffix=.html

spring.thymeleaf.mode=HTML5

spring.thymeleaf.encoding=UTF-8

#热部署文件，页面不产生缓存，及时更新

spring.thymeleaf.cache=false

spring.resources.chain.strategy.content.enabled=true

spring.resources.chain.strategy.content.paths=/**

LayuidemoPermissionApplication.java

package com.haijunyin.layuidemo.permission;

import org.springframework.boot.SpringApplication;

import org.springframework.boot.autoconfigure.SpringBootApplication;

import org.springframework.boot.autoconfigure.jdbc.DataSourceAutoConfiguration;

import org.springframework.boot.builder.SpringApplicationBuilder;

import org.springframework.boot.web.servlet.support.SpringBootServletInitializer;

import org.springframework.context.annotation.ComponentScan;

import org.springframework.scheduling.annotation.EnableAsync;

/**

* 继承SpringBootServletInitializer，因为继承SpringBootServletInitializer是继承WebApplicationInitializer的，而servlet容器启动的时候

* 会将WebApplicationInitializer相关的所有子类实例化(这也是servlet3.0以上的版本提供支持)，所以我们还需要在pom.xml

* 文件中导入servlet3.0及以上的版本

*/

@ComponentScan(value = "com.haijunyin.layuidemo.permission")

@SpringBootApplication(exclude = {DataSourceAutoConfiguration.class})

@EnableAsync

public class LayuidemoPermissionApplication extends SpringBootServletInitializer{

@Override

public SpringApplicationBuilder configure(SpringApplicationBuilder builder) {

return builder.sources(LayuidemoPermissionApplication.class);

}

public static void main(String[] args) {

SpringApplication.run(LayuidemoPermissionApplication.class, args);

}

}

admin_user_list.html

layui在线调试

body{margin: 10px;}

.demo-carousel{height: 200px; line-height: 200px; text-align: center;}

查看

编辑

删除

• 演示说明
• 日期
• 分页
• 上传
• 滑块

在这里，你将以最直观的形式体验 layui！

在编辑器中可以执行 layui 相关的一切代码

你也可以点击左侧导航针对性地试验我们提供的示例

如果最左侧的导航的高度超出了你的屏幕

你可以将鼠标移入导航区域，然后滑动鼠标滚轮即可



点击上传，或将文件拖拽到此处

layui { { layui.v }} 提供强力驱动

layui.config({

version: '1545041465480' //为了更新 js 缓存，可忽略

});

layui.use(['laydate', 'laypage', 'layer', 'table', 'carousel', 'upload', 'element', 'slider'], function(){

var laydate = layui.laydate //日期

,laypage = layui.laypage //分页

,layer = layui.layer //弹层

,table = layui.table //表格</