后台项目
泛泛之素
君子不器
展开
-
Spring WebFlux + React搭建后台管理系统(14):项目前端docker image并实现云端部署
前端的image制作流程其实跟后端的也没啥区别,首先通过build生成静态文件,也就是dist文件夹中的文件,然后通过放到nginx的image中,配置nginx的配置文件,进行包装即可。1. Dockerfile这里dist文件夹,是项目build之后生成的静态文件,一般是npm buildEXPOSE 指令是声明运行时容器提供服务端口,这只是一个声明。在 Dockerfile 中写入这样的声明有两个好处,一个是帮助镜像使用者理解这个镜像服务的守护端口,以方便配置映射;另一个用处则是在运行时使用随原创 2020-09-17 19:54:42 · 402 阅读 · 0 评论 -
Spring WebFlux + React搭建后台管理系统(13):微服务 项目制作成docker image
1.微服务现在是微服务(Microservices )大行其道的时代,微服务将一个大的服务拆分成多个独立的服务,通过网络在独立的服务之间进行沟通,这样做可以使各个独立服务之间松耦合,就像变形金刚每个是独立的,但是可以合体成为一个超级战士。微服务的优点还是很多的:每个服务模块之间低耦合,开发人员可以专心完成自己的任务微服务能使用不同的语言开发。不同的服务通过注册中心整合可以提高容错性能,通过熔断器处理,如果问题直接熔断,不会导致雪崩效应每个服务可以通过需求配置到合适硬件的服务器上,深度学习的服务原创 2020-09-16 17:28:01 · 468 阅读 · 0 评论 -
Spring WebFlux + React搭建后台管理系统(12):初次运行初始化表格和数据
这里有一个使用场景:我希望通过docker-compose直接部署我的项目,运行的时候拉下来的mysql数据库容器中是空的,而且r2dbc没有初始化数据库这里功能,需要通过sql文件进行配置,这里有两个选项:通过mysql容器进行配置,这样不好控制,配置起来比较麻烦通过spring服务端配置,读取sql文件通过jdbc进行配置这里又有一个问题就是,我们在配置文件中配置的mysql的路径是有数据库的,如果使用注入的DatabaseClient的话是不行的,因为数据库还没有创建,直接使用会提示找不到x原创 2020-09-16 13:01:53 · 373 阅读 · 0 评论 -
Spring WebFlux + React搭建后台管理系统(11):尝试RSocket数据流传输
reactor等响应式可以轻松的传递流数据,想起了spring的webflux也支持以rsocket,它可以通过websocket或是tcp的方式进行数据传输,正好有java版本和js版本,且spring也支持rsocket,下面尝试是哟给你rsocket模拟天气数据的传输,前端接到数据通过折线图展示。1. 后端部分1.1 model实现创建一个weather类用于传输包装数据包含时间、风速、风向、温度数据/** * @author: ffzs * @Date: 2020/9/2 下午5:原创 2020-09-03 13:57:50 · 1168 阅读 · 2 评论 -
Spring WebFlux + React搭建后台管理系统(10):配合Redis进行鉴权
如果是网关等服务,可以将路由及每个路由的权限缓存到redis数据库中,用户访问,在网关进行鉴权:token比对redis缓存的token,不存在返回token进行jwt解析,获取roles通过api的path和访问模式在redis数据库中获取该接口通行的rolestoken中的roles和api对应的roles有相交说明有权限,否则返回roles同时通过ReactiveSecurityContextHolder进行设置1. 启动时api信息写入redis通过PostConstruct在启原创 2020-09-02 15:25:38 · 1081 阅读 · 1 评论 -
Spring WebFlux + React搭建后台管理系统(9):通过上传excel实现批量新增
有这样的需求,需要批量新增数据,但是一个一个的表单填写太麻烦,可以通过excel将数据汇总,然后通过上传的方式显示出来,在前端页面进行勾选,实现批量上传,需要实现一下功能:新增上传页面的切换上传的文件通过表格展示通过勾选将选定数据进行上传效果展示1.添加API表处理excel逻辑添加controller处理excel跟user的主体逻辑基本相同@PostMapping(value = "/upload/url/excel", consumes = MediaType.MULTIPA原创 2020-09-01 23:13:20 · 691 阅读 · 0 评论 -
Spring WebFlux + React搭建后台管理系统(8):通过access鉴权
不得不说umi这个access功能还是比较实用的,现在鉴权的逻辑写起来要方便的多。我们可以通过access轻松实现很多功能:通过不同权限展示不同的菜单在组建中展示不同的内容对写入功能进行限制做一个简单的实践,下面是三个用户不同权限,以及不同权限能达到的目的:用户权限功能ffzsadmin可以查看所有内容包括权限,修改人等,以及添加用户,修改用户,删除用户dzit可以看到部分用户信息,可以修改用户部分信息vincenthr只能查看用户部分信息,不可修原创 2020-08-31 22:02:33 · 524 阅读 · 0 评论 -
Spring WebFlux + React搭建后台管理系统(7): 实现excel文件上传下载
后台管理系统的excel导出功能,以及使用excel进行批量导入都是必不可少的功能,本篇主要介绍内容如下:java后端 excel的读写excel类型判断以及通过反射适配class后端接收upload服务逻辑实现后端download服务逻辑前端upload组建使用前端download配置先上效果图:1. 读取Excel文件1.1 添加依赖通过使用poi进行excel文件的解析:implementation 'org.apache.poi:poi:4.0.1'implementa原创 2020-08-31 20:45:13 · 1632 阅读 · 1 评论 -
Spring WebFlux + React搭建后台管理系统(6): 使用faker获取测试数据
由于测试没有数据,一个一个写的话太麻烦了,这是我们可以使用faker伪造测试数据,之前用写爬虫的时候经常用来生成user-agent,查了一些java也有类似的库:implementation 'com.github.javafaker:javafaker:0.17.2'通过爬虫获取图像地址通过faker编写生成SysUser类的对象通过编写一个faker数据的controller,get传入个数fake相应的用户数据1. 获取头像地址随便找了个头像网站,编写了一个爬虫获取了一些头像地原创 2020-08-31 20:38:59 · 405 阅读 · 0 评论 -
Spring WebFlux + React搭建后台管理系统(5): antd pro v5 ProTable使用
本篇配合antdpro的 ProTable实现简单的CRUD操作:官方网站更改了ProTable获取数据改写UpdateForm内容,实现新增用户更改用户信息删除用户信息修改删除需要admin权限处理效果图1. 设置自己的tableItem跟据自己的数据编写Table使用的tableItem类:export interface UserDetails { key: number; username: string; avatar: string; createBy:原创 2020-08-29 22:19:09 · 1671 阅读 · 0 评论 -
Spring WebFlux + React搭建后台管理系统(4): antd pro v5 设置
本篇使用l研究一下ayout中的一些设置,以及locale使用,更改标题,添加logo,更改样式样式功能。点我进入官方教程内容分为一下几点:更改标题更改logoroute配置locale修改样式设置footer修改rightContent美化登录页面1. 更改标题,logo通过config文件夹的defaultSetting文件进行layout设置的更改,也可以在config.ts文件中更改,config中的修改会覆盖setting中内容title指的就是logo旁边的名原创 2020-08-28 21:58:34 · 1376 阅读 · 0 评论 -
Spring WebFlux + React搭建后台管理系统(3): antd pro v5实现登入登出
antdpro是蚂蚁金服开发的后台管理框架模板,继承了许多组建,可以满足快速开发,组建使用的antd,组建种类比较多,功能比较全,设计也挺好看的,但是封装程度有点高,用起来可能不是很灵活,一些功能需要研究一下。1. 创建antd项目官方创建项目说明1.1 命令行键入:yarn create umi1.2 选择Pro v5:这时项目文件全部拉下来了:1.3 下载依赖通过yarn下载,时间会比较长yarn1.4 运行项目通过键入yarn start启动项目通过浏览器原创 2020-08-28 14:26:56 · 1926 阅读 · 2 评论 -
Spring WebFlux + React搭建后台管理系统(2): 主要业务逻辑实现
上一篇简单实现了数据库表的生成以及生成POJO,这里主要介绍后台服务中实现的接口以及如何通过使用webflux实现一些复杂的逻辑,以及登录鉴权等内容。业务接口如下为整理的实现的借口汇总,应为是RESTful接口,一个path会对应多个功能:UrlHttpMethod描述**/api/auth/logout **get登出**/api/auth/login **post登入**/api/user **get通过用户名获取数据用户**/api/us原创 2020-08-27 21:40:01 · 1207 阅读 · 0 评论 -
Spring WebFlux + React搭建后台管理系统(1):创建数据表及生成POJOs
搞了一个月的响应式,开个新坑,本系列简单搭建一个后台管理系统,主要功能如下:jwt 登录+鉴权实现用户管理页面,用户查询数据表,增删改表单实现api管理页面,api权限管理的增添修改mysql存储用户信息redis用于缓存权限路由映射,记录token使用技术栈:后端使用spring webflux + mysql + redis + jwt实现 RESTful api + RSocket?,前端使用reactjs + umijs + antd + material-ui?。spring原创 2020-08-26 12:30:26 · 875 阅读 · 0 评论