SpringBoot4重构,React仪表盘升级详解
时间:2025-12-20 22:21:47 381浏览 收藏
在科技周边实战开发的过程中,我们经常会遇到一些这样那样的问题,然后要卡好半天,等问题解决了才发现原来一些细节知识点还是没有掌握好。今天golang学习网就整理分享《Spring Boot 4重构,React仪表盘升级来袭》,聊聊,希望可以帮助到正在努力赚钱的你。
CoSky - 高性能、低成本微服务治理平台
English Document
CoSky 是一个轻量级、低成本的服务注册、服务发现、配置服务 SDK,通过使用现有基础设施中的 Redis(相信您已经部署了 Redis),无需给运维部署带来额外的成本与负担。借助 Redis 的高性能,CoSky 提供了超高的 TPS&QPS (10W+/s JMH 基准测试)。CoSky 结合本地进程缓存策略 + Redis PubSub,实现实时进程缓存刷新,兼具无与伦比的 QPS 性能 (7000W+/s JMH 基准测试) 和进程缓存与 Redis 的实时一致性。
拥抱Spring Boot 4,重构React现代化仪表盘 | CoSky v5.2.0 发布
我们非常高兴地宣布 CoSky v5.2.0 正式发布!这是一个里程碑式的版本,带来了对最新 Spring 生态的支持、一次彻底的技术栈革新以及一系列激动人心的新功能。此版本致力于提升开发者体验、增强系统性能并提供一个更现代化、更强大的服务治理平台。
? 核心技术框架升级
- 全面支持 Spring Boot 4:无缝升级至最新的 Spring Boot 4 框架,确保您的项目能够利用其最新的性能优化、安全特性和功能增强,保持技术栈的前沿性。
- 引入全局 CORS 配置:新增
OrderedCorsWebFilter,为 REST API 提供灵活、可排序的全局跨域资源共享配置,简化前端集成。
? 现代化仪表盘焕新登场
我们对管理控制台进行了彻底的架构重构,从 Angular 迁移至 React 技术栈,带来了全面的用户体验革新:
- 性能大幅提升:通过为所有页面实现按需懒加载(Lazy Loading) 和引入可刷新的路由守卫(Route Guard),显著提升了应用初始加载速度和页面切换的响应效率。
- 全新视觉与交互:采用了现代化的渐变背景和卡片设计,增强视觉层次感,提供更具吸引力的登录页面和整体界面。
- 优化上下文管理:重构了应用路由和上下文提供逻辑,改善了数据流,并增强了命名空间选择器的下拉框样式。
? 强大的服务拓扑可视化
全新的服务拓扑功能,让您能够直观地洞察微服务间的依赖关系与运行状态。
- 从布局引擎升级为网格布局,节点定位更清晰、直观。
- 支持动态布局、节点分类(如按服务类型区分)、交互式探索以及节点拖拽,使拓扑图不再是静态展示,而是一个强大的分析工具。
⚙️ 功能特性全面增强
配置管理中心:
- 格式支持增强:为配置编辑器添加文件格式选择器,并明确提示对 Nacos 配置格式的兼容性支持。
- 版本管理精细化:新增支持展开行的配置版本表格,方便追踪历史变更。
- 批量操作便捷化:实现通过 ZIP 包导入配置的功能,并优化导出功能以使用 Blob 对象,提升大批量配置操作的效率。
- 交互体验优化:为配置表和服务表新增排序、搜索过滤功能,动态设置配置抽屉标题,并解决了差异编辑器初始化问题。
服务与权限管理:
- 服务实例管理:新增服务实例元数据编辑器,并为实例表格添加排序功能。
- 权限体系完善:实现了完整的角色管理功能,支持资源绑定;新增用户编辑组件。
- 审计与安全:改进了审计日志在 WebFilter 中的错误处理,增强了系统的可观测性与稳定性。
? 依赖更新与其他改进
- 移除 Angular 仪表盘:彻底告别旧版,全面拥抱 React 现代化架构。
- 升级至 Kotlin 2.3.0,并同步更新了 Spring Boot、SpringDoc、Gradle 等大量核心及工具依赖至最新稳定版本,夯实项目基础。
- 代码结构优化:提升了 TypeScript 类型安全性和代码结构,移除
cosky-mirror模块,简化项目架构。 - 为 REST 控制器添加了 Swagger 标签,进一步优化 API 文档。
立即升级,体验更强大、更流畅的 CoSky!
服务注册与发现

配置中心

Examples
Service Consumer --RPC--> Service Provider Examples
安装
Gradle
Kotlin DSL
val coskyVersion = "lastVersion";
implementation("me.ahoo.cosky:spring-cloud-starter-cosky-config:${coskyVersion}")
implementation("me.ahoo.cosky:spring-cloud-starter-cosky-discovery:${coskyVersion}")
implementation("org.springframework.cloud:spring-cloud-starter-loadbalancer:3.0.3")
Maven
project xmlns="http://maven.apache.org/POM/4.0.0"
xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
xsi:schemaLocation="http://maven.apache.org/POM/4.0.0 http://maven.apache.org/xsd/maven-4.0.0.xsd">
modelVersion>4.0.0modelVersion>
artifactId>demoartifactId>
properties>
cosky.version>lastVersioncosky.version>
properties>
dependencies>
dependency>
groupId>me.ahoo.coskygroupId>
artifactId>spring-cloud-starter-cosky-configartifactId>
version>${cosky.version}version>
dependency>
dependency>
groupId>me.ahoo.coskygroupId>
artifactId>spring-cloud-starter-cosky-discoveryartifactId>
version>${cosky.version}version>
dependency>
dependency>
groupId>org.springframework.cloudgroupId>
artifactId>spring-cloud-starter-loadbalancerartifactId>
version>3.0.3version>
dependency>
dependencies>
project>
bootstrap.yaml (Spring-Cloud-Config)
spring:
application:
name: ${service.name:cosky}
data:
redis:
url: redis://localhost:6379
cloud:
cosky:
namespace: ${cosky.namespace:cosky-{system}}
config:
config-id: ${spring.application.name}.yaml
service-registry:
auto-registration:
enabled: ${cosky.auto-registry:true}
logging:
file:
name: logs/${spring.application.name}.log
? REST-API Server(可选)
根据您的环境选择三种部署方式之一:
?️ 方式一:独立可执行文件
下载最新版本并直接运行:
# 下载 cosky-server
wget https://github.com/Ahoo-Wang/cosky/releases/latest/download/cosky-server.tar
# 解压并运行
tar -xvf cosky-server.tar
cd cosky-server
bin/cosky --server.port=8080 --spring.data.redis.url=redis://localhost:6379
? 方式二:Docker 部署
使用 Docker 快速部署:
docker pull ahoowang/cosky:latest
docker run --name cosky -d -p 8080:8080 \
-e SPRING_DATA_REDIS_URL=redis://your-redis-host:6379 \
ahoowang/cosky:latest
☸️ 方式三:Kubernetes 部署
在 Kubernetes 集群中部署:
apiVersion: apps/v1
kind: Deployment
metadata:
name: cosky
labels:
app: cosky
spec:
replicas: 1
selector:
matchLabels:
app: cosky
template:
metadata:
labels:
app: cosky
spec:
containers:
- name: cosky
image: ahoowang/cosky:latest
ports:
- containerPort: 8080
protocol: TCP
env:
- name: SPRING_DATA_REDIS_URL
value: redis://your-redis-host:6379
resources:
requests:
cpu: 250m
memory: 1024Mi
limits:
cpu: "1"
memory: 1280Mi
volumeMounts:
- name: volume-localtime
mountPath: /etc/localtime
volumes:
- name: volume-localtime
hostPath:
path: /etc/localtime
type: ""
---
apiVersion: v1
kind: Service
metadata:
name: cosky
labels:
app: cosky
spec:
selector:
app: cosky
ports:
- name: rest
port: 80
protocol: TCP
targetPort: 8080
? Dashboard
访问基于Web的管理界面:
http://localhost:8080

CoSky Dashboard 提供以下功能:
- 实时服务监控和管理
- 配置管理(含版本控制)
- 命名空间隔离和管理
- 基于角色的访问控制(RBAC)
- 审计日志用于合规性
- 服务拓扑可视化
- 简单的导入/导出功能
服务依赖拓扑

基于角色的访问控制(RBAC)
- cosky: 保留用户名,超级用户,拥有最高权限。应用首次启动时会初始化超级用户(cosky)的密码,并打印在控制台。忘记密码也不用担心,可以通过配置
enforce-init-super-user: true,CoSky 会帮助你重新初始化密码并打印在控制台。
---------------- ****** CoSky - init super user:[cosky] password:[6TrmOux4Oj] ****** ----------------
- admin: 保留角色,超级管理员角色,拥有所有权限,一个用户可以绑定多个角色,一个角色可以绑定多个资源操作权限。
- 权限控制粒度为命名空间,读写操作
角色权限

添加角色

用户管理

添加用户

审计日志

命名空间管理

配置管理

编辑配置

回滚配置

从 Nacos 导入配置

服务管理

编辑服务实例信息

REST-API
https://ahoo-cosky.apifox.cn/
? 性能基准测试
CoSky 提供卓越的性能,相比其他方案性能提升数个数量级
测试环境
- 硬件: MacBook Pro (M1)
- Redis: 在同一台机器上本地部署
- 方法论: 所有基准测试均使用 JMH (Java Microbenchmark Harness) 进行
配置服务性能
gradle cosky-config:jmh
# or
java -jar cosky-config/build/libs/cosky-config-lastVersion-jmh.jar -bm thrpt -t 25 -wi 1 -rf json -f 1
测试结果
Benchmark Mode Cnt Score Error Units
ConsistencyRedisConfigServiceBenchmark.getConfig thrpt 256733987.827 ops/s
RedisConfigServiceBenchmark.getConfig thrpt 241787.679 ops/s
RedisConfigServiceBenchmark.setConfig thrpt 140461.112 ops/s
服务发现性能
gradle cosky-discovery:jmh
# or
java -jar cosky-discovery/build/libs/cosky-discovery-lastVersion-jmh.jar -bm thrpt -t 25 -wi 1 -rf json -f 1
测试结果
Benchmark Mode Cnt Score Error Units
ConsistencyRedisServiceDiscoveryBenchmark.getInstances thrpt 76621729.048 ops/s
ConsistencyRedisServiceDiscoveryBenchmark.getServices thrpt 455760632.346 ops/s
RedisServiceDiscoveryBenchmark.getInstances thrpt 226909.985 ops/s
RedisServiceDiscoveryBenchmark.getServices thrpt 304979.150 ops/s
RedisServiceRegistryBenchmark.deregister thrpt 255305.648 ops/s
RedisServiceRegistryBenchmark.register thrpt 110664.160 ops/s
RedisServiceRegistryBenchmark.renew thrpt 210960.325 ops/s
? 关键洞察: CoSky 的一致性层在配置检索方面提供超过 800 倍的性能提升,在服务发现方面提供超过 250 倍的性能提升,相比标准 Redis 操作。
? CoSky-Mirror (实时同步服务实例变更状态)
CoSky-Mirror 就像一座桥梁连接 Nacos 和 CoSky,构建一个统一的服务发现平台,实现无缝集成。


通过 CoSky-Mirror,您可以:
- 在 Nacos 和 CoSky 之间实时同步服务实例
- 保持不同服务注册中心之间的一致性
- 零停机从 Nacos 迁移到 CoSky
- 构建混合服务发现架构
? 功能对比
| 功能 | CoSky | Eureka | Consul | CoreDNS | Zookeeper | Nacos | Apollo |
|---|---|---|---|---|---|---|---|
| 健康检查 | Client Beat | Client Beat | TCP/HTTP/gRPC/Cmd | Keep Alive | Keep Alive | TCP/HTTP/Client Beat | Client Beat |
| 负载均衡策略 | Weight/Selector | Ribbon | Fabio | RoundRobin | RoundRobin | Weight/metadata/RoundRobin | RoundRobin |
| 自动注销实例 | ✅ | ✅ | ❌ | ❌ | ✅ | ✅ | ✅ |
| 访问协议 | HTTP/Redis | HTTP | HTTP/DNS | DNS | TCP | HTTP/DNS | HTTP |
| 监听支持 | ✅ | ✅ | ✅ | ❌ | ✅ | ✅ | ✅ |
| SpringCloud集成 | ✅ | ✅ | ✅ | ❌ | ❌ | ✅ | ✅ |
| K8S集成 | ✅ | ❌ | ✅ | ✅ | ❌ | ✅ | ❌ |
| 持久化 | Redis | - | - | - | - | MySql | MySql |
? 贡献
欢迎社区贡献!无论是报告错误、提出功能建议还是提交拉取请求,您的参与都能帮助 CoSky 变得更好。
? 许可证
CoSky 是基于 Apache License 2.0 许可的开源软件。
源码地址:点击下载
到这里,我们也就讲完了《SpringBoot4重构,React仪表盘升级详解》的内容了。个人认为,基础知识的学习和巩固,是为了更好的将其运用到项目中,欢迎关注golang学习网公众号,带你了解更多关于的知识点!
-
501 收藏
-
501 收藏
-
501 收藏
-
501 收藏
-
501 收藏
-
268 收藏
-
184 收藏
-
326 收藏
-
273 收藏
-
320 收藏
-
324 收藏
-
459 收藏
-
164 收藏
-
265 收藏
-
329 收藏
-
242 收藏
-
295 收藏
-
- 前端进阶之JavaScript设计模式
- 设计模式是开发人员在软件开发过程中面临一般问题时的解决方案,代表了最佳的实践。本课程的主打内容包括JS常见设计模式以及具体应用场景,打造一站式知识长龙服务,适合有JS基础的同学学习。
- 立即学习 543次学习
-
- GO语言核心编程课程
- 本课程采用真实案例,全面具体可落地,从理论到实践,一步一步将GO核心编程技术、编程思想、底层实现融会贯通,使学习者贴近时代脉搏,做IT互联网时代的弄潮儿。
- 立即学习 516次学习
-
- 简单聊聊mysql8与网络通信
- 如有问题加微信:Le-studyg;在课程中,我们将首先介绍MySQL8的新特性,包括性能优化、安全增强、新数据类型等,帮助学生快速熟悉MySQL8的最新功能。接着,我们将深入解析MySQL的网络通信机制,包括协议、连接管理、数据传输等,让
- 立即学习 500次学习
-
- JavaScript正则表达式基础与实战
- 在任何一门编程语言中,正则表达式,都是一项重要的知识,它提供了高效的字符串匹配与捕获机制,可以极大的简化程序设计。
- 立即学习 487次学习
-
- 从零制作响应式网站—Grid布局
- 本系列教程将展示从零制作一个假想的网络科技公司官网,分为导航,轮播,关于我们,成功案例,服务流程,团队介绍,数据部分,公司动态,底部信息等内容区块。网站整体采用CSSGrid布局,支持响应式,有流畅过渡和展现动画。
- 立即学习 485次学习