基于 Spring Boot 的前后端分离脚手架 EL-ADMIN 项目介绍EL-ADMIN 基于 Spring Boot 2.1.0 、 Spring Boot Jpa、 JWT、Spring Security、Redis、Vue、Element-UI 的前后端分离的后台管理系统， 项目采用按功能分模块的开发方式，权限控制采用 RBAC 思想，支持数据字典与数据权限管理，支持一键生成前后端代码，支持前端菜单动态路由等主要特性使用最新技术栈，社区资源丰富。高效率开发，代码生成器可一键生成前后端代码支持数据字典，可方便地对一些状态进行管理支持接口限流，避免恶意请求导致服务层压力过大支持接口级别的功能权限与数据权限，可自定义操作自定义权限注解与匿名接口注解，可快速对接口拦截与放行对一些常用地前端组件封装：表格数据请求、数据字典等前后端统一异常拦截处理，统一输出异常，避免繁琐的判断支持在线用户管理与服务器性能监控，支持限制单用户登录支持运维管理，可方便地对远程服务器的应用进行部署与管理主要功能用户管理：提供用户的相关配置，新增用户后，默认密码为123456角色管理：对权限与菜单进行分配，可根据部门设置角色的数据权限菜单管理：已实现菜单动态路由，后端可配置化，支持多级菜单部门管理：可配置系统组织架构，树形表格展示岗位管理：配置各个部门的职位字典管理：可维护常用一些固定的数据，如：状态，性别等系统日志：记录用户操作日志与异常日志，方便开发人员定位排错SQL监控：采用druid 监控数据库访问性能，默认用户名admin，密码123456定时任务：整合Quartz做定时任务，加入任务日志，任务运行情况一目了然代码生成：高灵活度生成前后端代码，减少大量重复的工作任务邮件工具：配合富文本，发送html格式的邮件七牛云存储：可同步七牛云存储的数据到系统，无需登录七牛云直接操作云数据支付宝支付：整合了支付宝支付并且提供了测试账号，可自行测试服务监控：监控服务器的负载情况运维管理：一键部署你的应用项目结构- eladmin-common 公共模块 - annotation 为系统自定义注解 - aspect 自定义注解的切面 - base 提供了Entity、DTO基类和mapstruct的通用mapper - config 自定义权限实现、redis配置、swagger配置、Rsa配置等 - exception 项目统一异常的处理 - utils 系统通用工具类 - eladmin-system 系统核心模块（系统启动入口） - config 配置跨域与静态资源，与数据权限 - thread 线程池相关 - modules 系统相关模块(登录授权、系统监控、定时任务、运维管理等) - eladmin-logging 系统日志模块 - eladmin-tools 系统第三方工具模块 - eladmin-generator 系统代码生成模块项目地址码云作为国内同步仓库，可解决Github克隆缓慢的问题，两个平台的代码都是同步更新的，按需选择 ，Bug 提交请在 Github 创建 Issues/后端源码前端源码Githubhttps://github.com/elunez/eladminhttps://github.com/elunez/eladmin-webGiteehttps://gitee.com/elunez/eladminhttps://gitee.com/elunez/eladmin-web反馈交流开发文档 https://el-admin.vip为了统一管理，现已关闭 Gitee 的 Issues 功能使用中遇到问题或者 Bug 可以在 Github 上提 IssuesQQ交流群：一群： 891137268 、二群：947578238、三群：659622532项目预览预览地址：https://el-admin.xin账号密码：admin / 123456登录界面用户管理菜单管理定时任务代码生成更多功能，点击预览地址体验：https://el-admin.xin

利用 Nginx 的 Gzip 模块解决 Vue 首屏加载缓慢的问题 通过 Nginx 的 Gize 模块拦截请求，并且对相应的资源进行压缩，已达到减少文件体积加快文件访问速度的目的，使用 Nginx 的 Gizp 模块不需要重新编译，直接开启即可。基本配置在 server 中加入如下代码# 开启gzip gzip on; # 低于1kb的资源不压缩 gzip_min_length 1k; # 设置压缩所需要的缓冲区大小 gzip_buffers 4 16k; # 压缩级别【1-9】，越大压缩率越高，同时消耗cpu资源也越多，建议设置在4左右。 gzip_comp_level 6; # 需要压缩哪些响应类型的资源，缺少的类型自己补。 gzip_types text/css text/javascript application/javascript; # 配置禁用gzip条件，支持正则。此处表示ie6及以下不启用gzip（因为ie低版本不支持） gzip_disable "MSIE [1-6]\."; # 是否添加“Vary: Accept-Encoding”响应头， gzip_vary on; # 设置gzip压缩针对的HTTP协议版本，没做负载的可以不用 # gzip_http_version 1.0;查看效果在 response headers 中的 Content-Encoding 是 gzip 就代表开启成功前后对比未开启 Gzip 的文件大小与加载速度开启 Gzip 后的文件大小与加载速度前后速度提升明显完整配置附上完整的 Nginx https + Gzip 配置server { listen 443 ssl http2; server_name el-admin.xin www.el-admin.xin; # 证书配置 ssl_certificate /etc/nginx/cert/el-admin-xin/el-admin.xin_chain.crt; ssl_certificate_key /etc/nginx/cert/el-admin-xin/el-admin.xin_key.key; # DHE密码器的Diffie-Hellman参数，需要openssl手动生成 # openssl命令：openssl dhparam -dsaparam -out /home/nginx/cert/el-admin-vip/dhparam.pem 4096 ssl_dhparam /etc/nginx/cert/el-admin-xin/dhparam.pem; # 开启OCSP Stapling，由服务器验证证书在线状态，提高TLS握手效率 ssl_stapling on; ssl_stapling_verify on; # 开启HSTS，缓存http重定向到https，以防止中间人攻击 add_header Strict-Transport-Security "max-age=63072000;" always; # 开启TLS False Start ssl_prefer_server_ciphers on; # 中等兼容程度，Mozilla推荐配置 ssl_ciphers ECDHE-ECDSA-AES128-GCM-SHA256:ECDHE-RSA-AES128-GCM-SHA256:ECDHE-ECDSA-AES256-GCM-SHA384:ECDHE-RSA-AES256-GCM-SHA384:ECDHE-ECDSA-CHACHA20-POLY1305:ECDHE-RSA-CHACHA20-POLY1305:DHE-RSA-AES128-GCM-SHA256:DHE-RSA-AES256-GCM-SHA384; # 中等兼容程度，Mozilla推荐配置 ssl_protocols TLSv1.1 TLSv1.2 TLSv1.3; # 由客户端保存加密后的session信息 ssl_session_tickets on; # 缓存SSL ssl_session_cache shared:SSL:10m; ssl_session_timeout 1d; # 长链接 keepalive_timeout 70; #减少点击劫持，禁止在iframe中加载 add_header X-Frame-Options DENY; # 开启gzip gzip on; # 低于1kb的资源不压缩 gzip_min_length 1k; # 设置压缩所需要的缓冲区大小 gzip_buffers 4 16k; # 压缩级别【1-9】，越大压缩率越高，同时消耗cpu资源也越多，建议设置在4左右。 gzip_comp_level 4; # 需要压缩哪些响应类型的资源，缺少自己补。 gzip_types text/css text/javascript application/javascript; # 配置禁用gzip条件，支持正则。此处表示ie6及以下不启用gzip（因为ie低版本不支持） gzip_disable "MSIE [1-6]\."; # 是否添加“Vary: Accept-Encoding”响应头， gzip_vary on; # 根目录 location / { root /usr/share/nginx/html/eladmin/dist; index index.html; try_files $uri $uri/ @router; proxy_set_header Host $host; proxy_set_header X-Real-IP $remote_addr; proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for; } location @router { rewrite ^.*$ /index.html last; } } server { listen 80; server_name el-admin.xin; return 301 https://el-admin.xin$request_uri; }

EL-ADMIN 邮箱配置之使用 QQ 邮箱发送邮件 EL-ADMIN 配置邮箱后，发送邮件提示：邮箱发送邮件失败：AuthenticationFailedExceptionissues 地址：https://github.com/elunez/eladmin/issues/571修复步骤1、在QQ邮箱中 开启 IMAP/SMTP服务，获取独立密码2、在邮件工具里面配置邮箱信息参数说明1、发件人用户名：用户收信时显示的发件人名称2、邮箱密码：QQ邮箱需要为SMTP服务单独设置密码3、QQ 邮箱的 SMTP 地址：smtp.qq.com4、SMTP 使用默认的 465 即可修改代码定位到：eladmin-tools/src/main/java/me/zhengjie/service/impl/EmailServiceImpl.java修改第 72 行// 设置用户 String user = emailConfig.getFromUser().split("@")[0]; account.setUser(user);重新启动项目即可

EL-ADMIN V2.5 版本发布，新增多项实用功能，代码多项优化 V2.4版本现基本稳定，V2.5版本都是基于现版本进行Bug修复与优化调整，新版本更新内容如下后端改动新增功能加入审计功能，继承 BaseEntity 后自动写入创建时间、修改时间、创建人、更新人，详见 AuditorConfigToken 自动续期功能，用户在快过期的时间内操作活跃，可将 Token 过期时间延长，详见 TokenFilter数据权限注解的实现，摈弃在 Controller 的操作方式，采用 @DataPermission 注解实现，详见 后端手册新的服务监控实现，后端采用 oshi，前端采用 echarts 做可视化借鉴了[宝塔监控]，详见 预览地址定时任务创建时支持添加异常通知人，当定时任务执行失败发送邮件通知 [支持多邮箱], 详见 后端手册定时任务支持添加子任务，当主任务执行完后自动执行子任务 [支持多子任务，顺序执行], 详见 后端手册细节优化结构优化数据库脚本选择，见 脚本指南所有表按功能加入前缀：sys、tool、mnt 方便后续管理维护所有表字段的主键改为: 表名_id，方便与关联表的 id 统一所有表加入 create_by、update_by、create_time、update_time 字段,便于审计去除无用字段，加入必要索引加快查询速度，去除外键改为程序控制sys_user 表中加入 is_admin 字段用户区分是否为管理员删除 avatar 头像表，将头像的的头像名称与路径存入 sys_user 表代码优化去除首页 ip，pv 统计，此功能对于后台管理显得多余邮箱验证功能的验证码改为存储在 Redis 中，删除了原来从数据库中取的逻辑代码修改不规范的字段名/包名，将 mapper 包改为 mapstruct，避免与 mybatis 的 mapper 冲突重新设计缓存功能，去除不必要的缓存，去除监控模块，将新服务监控管理移入 system 模块用户管理、角色管理、菜单管理、部门管理中树形均采用懒加载方式实现，避免大量的数据导致页面卡顿加入RsaUtils工具类解决Hutool工具Rsa解密过慢的问题，IP 归属地查询改为用太平洋IP地址查询接口TokenFilter Token 验证逻辑优化，对于已放行的接口不去验证 Token 合法性文件上传优化，加入 FileProperties 配置，根据系统选择上传目录代码生成器前端 index.vue 模板查询优化，取消以前的下拉方式查询 详见错误修复运维管理解决不能向不同服务器部署应用的缺陷 #347运维管理解决部署到linux服务器路径拼接不正确问题 #347运维管理解决每次连接不同服务器都默认访问第一台服务器的问题 #347当前用户如果没有任何权限时，在输入用户名后，刷新验证码会抛IllegalArgumentException #333修复不存在账号登录时userService.findByName 抛出异常，loadUserByUsername未捕获处理的Bug 详见前端改动新增功能同一界面内，多CRUD共存，支持自定义数据id字段名 详见字典管理使用CRUD组件改写，CRUD组件增加对table延迟实例化支持，完善组件注册、注销 #83登录页背景使用本地图片，服务监控采用 v-echarts 实现用户管理、角色管理、菜单管理、部门管理，列表和弹窗数据懒加载用户头像裁剪上传节省空间 详见@crud/CRUD.operation中增加对列隐藏(初始阶段)支持 #95@crud/CRUD.operation中增加对列忽略支持 #95@crud/CRUD.operation中列可见性控制选项顺序跟随表格列顺序变更 #95细节优化优化主题切换按钮下移问题、优化tabs被footer遮挡问题、优化主题在页面刷新后重置的问题取消crud.props记录tableColumns，调整表格列可见性控制时插入位置计算 #95修改Token过期的提示，由原来的弹窗提示改为登录界面消息提示 详见错误修复修复V2.4版本中路由懒加载问题 详见修复菜单管理选择图标，backspace删除时不过滤数据 详见修复重定向到登录页，登录后参数丢失问题，比如文章详情/article?id=6 #94修复首页搜索菜单外链无法点击跳转问题 By RuoYi-Vue解决部署管理和数据库管理，选择记录不能启用自定义按钮的问题 详见修复字典管理模块点击编辑后再点击新增报错的问题 #366脚本指南项目根目录的 sql 文件夹内提供了本次数据库变更的脚本，脚本如何选择，以及执行的顺序如下操作数据库属于危险行为，请勿用于生产库，请事先做好备份！！！初次使用eladmin.sql 为 eladmin 项目完整的 sql 脚本，适合于初次使用的用户更新迭代对于老版本的，可以按下面的顺序执行删除所有外键.sql表名修改.sqlcode_ 相关表字段调整.sqlmnt_ 相关表字段调整.sqltool_ 相关表字段调整.sqlsys_ 相关表字段调整.sql用户岗位改动.sql相关数据更新.sql索引相关.sql删除无用表.sql脚本已经提供，其他的就需要自己慢慢调试了，祝成功！项目源码开发文档：https://el-admin.vip预览地址：https://el-admin.xin 后端源码前端源码Githubhttps://github.com/elunez/eladminhttps://github.com/elunez/eladmin-web码云https://gitee.com/elunez/eladminhttps://gitee.com/elunez/eladmin-web

快速解决 npm 安装 node-sass 速度慢/错误的问题 可通过配置淘宝的镜像源解决，首先配置淘宝的镜像源npm config set registry https://registry.npm.taobao.org然后在 ~/.npmrc 加入下面内容sass_binary_site=https://npm.taobao.org/mirrors/node-sass/.npmrc 文件位于win：C:\Users\[你的账户名称]\.npmrc linux：直接使用 vi ~/.npmrc完整配置如图

EL-ADMIN v2.4 发布，升级 cli3，新增监控模块，运维管理等 EL-ADMIN 基于 Spring Boot 2.1.0 、 Jpa、 Spring Security、redis、Vue 的前后端分离的后台管理系统，项目采用分模块开发方式， 权限控制采用 RBAC，支持数据字典与数据权限管理，支持一键生成前后端代码，支持前端菜单动态路由。v2.4 版本更新内容如下后端1、新增服务监控模块 eladmin-monitor，监控服务器的负载情况 (by @zhy6599)2、代码生成器优化，支持配置更多信息，支持打包下载与预览生成(1) 界面(2) 配置(3) 预览3、加入了运维管理 (by @zhy6599)4、用户加入昵称与性别字段5、免费图床支持同步功能6、新增清空日志功能，需要相应的权限才能操作 (#217 by @zoulejiu)7、security 优化，密码加密方式采用BCryptPasswordEncoder方式：SHA-256 +随机盐+密钥对密码进行加密7、前后端用户登陆密码rsa加密，后端解密，避免撞库8、@Query新增 NOT_EQUAL 、BETWEEN 、NOT_NULL查询9、匿名访问统一使用 @AnonymousAccess去除 @PreAuthorize("hasRole('anonymous')")、@PreAuthorize("@el.check('anonymous')") 的匿名访问效果10、新增单点登录，多设备登录 (#217 by @zoulejiu)以最后登录为准，之前的登录都会被踢掉，可以使用single.login =false 关闭11、代码优化，2.4版本完全遵循阿里巴巴代码规范前端1、前端升级为 vue-cli3 ，加入主题配置，目录结构优化2、移除 initData.js，封装 crud.js ，只需要引入该 js 即可实现所有增删改查的功能（详情查看源码）3、封装crud通用组件，建议使用，2.4 前端页面几乎都是使用这种形式 (#57 by @moxun1639)(1) 组件路径(2) 如何使用<template> <div class="app-container"> <!--工具栏--> <div class="head-container"> <div v-if="crud.props.searchToggle"> <!-- 搜索 --> <el-input v-model="query.value" clearable placeholder="输入搜索内容" style="width: 200px;" class="filter-item" @keyup.enter.native="crud.toQuery" /> <!--略--> <rrOperation :crud="crud" /> </div> <!--如果想在工具栏加入更多按钮，可以使用插槽方式， slot = 'left' or 'right'--> <crudOperation :permission="permission" /> <!--表单组件--> <el-dialog :close-on-click-modal="false" :before-close="crud.cancelCU" :visible.sync="crud.status.cu > 0" :title="crud.status.title" width="500px"> <!--略--> <div slot="footer" class="dialog-footer"> <el-button type="text" @click="crud.cancelCU">取消</el-button> <el-button :loading="crud.cu === 2" type="primary" @click="crud.submitCU">确认</el-button> </div> </el-dialog> <!--表格渲染--> <el-table ref="table" v-loading="crud.loading" :data="crud.data" size="small" style="width: 100%;" @selection-change="crud.selectionChangeHandler"> <el-table-column type="selection" width="55" /> <el-table-column v-if="columns.visible('createTime')" prop="createTime" label="createTime"> <template slot-scope="scope"> <span>{{ parseTime(scope.row.createTime) }}</span> </template> </el-table-column> <el-table-column v-permission="['admin','genTest:edit','genTest:del']" label="操作" width="150px" align="center"> <template slot-scope="scope"> <udOperation :data="scope.row" :permission="permission" /> </template> </el-table-column> </el-table> <!--分页组件--> <pagination /> </div> </div> </template> <script> import crudGenTest from '@/api/genTest' import CRUD, { presenter, header, form, crud } from '@crud/crud' import rrOperation from '@crud/RR.operation' import crudOperation from '@crud/CRUD.operation' import udOperation from '@crud/UD.operation' import pagination from '@crud/Pagination' // crud交由presenter持有 const defaultCrud = CRUD({ title: '测试生成', url: 'api/genTest', sort: 'id,desc', crudMethod: { ...crudGenTest }}) const defaultForm = { id: null, name: null, sex: null, createTime: null } export default { name: 'GenTest', components: { pagination, crudOperation, rrOperation, udOperation }, mixins: [presenter(defaultCrud), header(), form(defaultForm), crud()], data() { return { permission: { add: ['admin', 'genTest:add'], edit: ['admin', 'genTest:edit'], del: ['admin', 'genTest:del'] }, rules: { id: [ { required: true, message: 'ID不能为空', trigger: 'blur' } ], name: [ { required: true, message: '名称不能为空', trigger: 'blur' } ] }, queryTypeOptions: [ { key: 'name', display_name: '名称' }, { key: 'sex', display_name: '性别' } ] } }, methods: { // 获取数据前设置好接口地址 [CRUD.HOOK.beforeRefresh]() { const query = this.query if (query.type && query.value) { this.crud.params[query.type] = query.value } return true } } } </script>(3) 界面如下3、异常日志详情加入代码高亮显示，生产环境移除console4、其他升级可以查看演示页面修复1、修复查询时输入 []{} 符号报错的问题#1852、修复本地存储预览关闭按钮被header遮挡的问题#1883、修复Menu排序问题 (#194 by CCCY0)4、修复ip2region 不会自动关闭连接问题 (#217 by @zoulejiu)5、QueryHelp 中 RIGHT_LIKE 缺少 break 的问题 (#214 by jhpx)指南新版本代码生成器：链接新版本服务监控：链接新版本运维管理：链接新版本免费图床：链接新版本@Query查询：链接

EL-ADMIN v2.3 发布，新增在线用户管理，多项优化 EL-ADMIN 是基于 Spring Boot 2.1.0 、 Jpa、 Spring Security、Redis、Vue的前后端分离的权限管理系统，项目采用按功能分模块开发方式， 权限控制采用 RBAC 方式，前端菜单动态路由。新版更新内容如下：后端代码优化，优化大量Idea警告，代码更严谨 #134加入实体基类(BaseEntity)、DTO基类(BaseDTO)，按需继承 #137新增基于Redis的在线用户管理，可强制下线用户 #6新增退出登录接口，退出登录后Token不再有效图形验证码更换，由随机验证码模式，改为算术验证日志管理加入浏览器字段，获取Ip地址优化，局域网内支持获取到主机地址菜单与权限调整，权限管理作为按钮存入菜单表增加匿名访问注解，扩展PreAuthorize 匿名注解 #159自定义权限校验，@PreAuthorize("@el.check('dept:list')")，根据个人习惯可自行选择代码生成器优化，前后端默认添加导出功能，input时间组件自动判定自定义异步线程池(重写spring默认线程池)，使用自定义线程池执行定时任务，避免程序OOM免费图床优化，通过MD5判断图片是否重复上传，如果图片存在则返回历史图片前端简化数据字典的使用，由混入改为全局，支持单组件内多字典同时使用 #37存储管理增加图片路径提示和图片预览 #40树形表格更换，采用 element-ui 自带的树形表格组件修复解决Gson找不到包的bug #141解决ip2region.db路径不正确的问题 #1462.3版本指南：https://docs.auauz.net/#/sjzn预览地址：https://auauz.net/项目源码 后端源码前端源码Githubhttps://github.com/elunez/eladminhttps://github.com/elunez/eladmin-web码云https://gitee.com/elunez/eladminhttps://gitee.com/elunez/eladmin-web