🎨ui: 优化Identity样式,去除AI风格

This commit is contained in:
yubaolee
2026-06-27 20:32:18 +08:00
parent 818e6ad978
commit 5fdf58a0c6
8 changed files with 188 additions and 163 deletions

View File

@@ -4,21 +4,24 @@ createTime: 2025/04/23 21:03:10
outline: [2,4]
permalink: /core/identity/
---
## 前言
OpenAuth.Net支持两种登录认证方式Token认证和==自己搭建=={.tip}的OpenAuth.IdentityServer认证。
OpenAuth.Net支持两种登录认证方式Token认证和==自己搭建=={.tip}的统一认证服务OpenAuth.Identity。
这两种方式通过配置webapi的appsettings.json可以自由切换:
```json
"IdentityServerUrl": "http://localhost:12796", //IdentityServer服务器地址。如果为空则不启用OAuth认证
```
## Token认证
当我们启动OpenAuth.WebApi时如果IdentityServerUrl为空则采用普通的token认证这时不需要启动OpenAuth.Identity项目
```json
"IdentityServerUrl": "", //如果为空则采用普通的token认证
```
这时前端发出请求时会在请求头中添加X-Token字段携带token值。以OpenAuth.WebApi为例客户端在访问的接口时先调用登录接口,得到授权token
![20220119182845](http://img.openauth.net.cn/20220119182845.png)
@@ -27,17 +30,19 @@ OpenAuth.Net支持两种登录认证方式Token认证和==自己搭建=={.tip
![20220119182853](http://img.openauth.net.cn/20220119182853.png)
## OpenAuth.IdentityServer认证
## OpenAuth.Net 统一认证
不同于其他项目的统一登录(如微信登录、支付宝登录等,OpenAuth.Net的统一登录指的是自己搭建一套OAuth登录服务提供给其他项目使用。即OpenAuth.IdentityServer。启动后直接访问[http://localhost:12796](http://localhost:12796),效果如下:
![2025-03-18-23-12-18](http://img.openauth.net.cn/2025-03-18-23-12-18.png)
不同于其他项目使用微信登录、支付宝登录等,OpenAuth.Net的统一认证指的是自己搭建一套基于 OpenIddict 的统一身份认证服务,为其他项目提供 OpenID Connect / OAuth 2.0 协议支持,提供安全可靠的身份验证服务。
项目中的OpenAuth.Identity启动后直接访问[http://localhost:12796](http://localhost:12796),效果如下:
![2026-06-27-20-22-30](http://img.openauth.net.cn/2026-06-27-20-22-30.png)
这时我们修改OpenAuth.WebApi的IdentityServerUrl配置
```json
"IdentityServerUrl": "http://localhost:12796", //IdentityServer服务器地址。
```
### OpenAuth.WebApi效果
当启用了Identity时客户端调用API需要先通过OpenAuth.IdentityServer服务器的OAuth验证才能调用接口。目前调用OpenAuth.WebApi的客户端有两种
@@ -53,14 +58,15 @@ VITE_OIDC_REDIRECTURI = http://localhost:1803 #登录回调
VITE_OIDC_RESPONSETYPE = code #认证方式
VITE_OIDC_SCOPE = openid profile openauthapi #认证范围
VITE_OIDC_AUTOMATICSILENTRENEW = true #自动续期
```
如果服务端启用了Identity认证则打开登录界面如下
![2025-03-10-14-46-47](http://img.openauth.net.cn/2025-03-10-14-46-47.png)
这时点击登录超链接会跳转到OpenAuth.Identity登录界面。效果如下
![2025-04-24-00-24-40](http://img.openauth.net.cn/2025-04-24-00-24-40.png)
![2026-06-27-20-23-17](http://img.openauth.net.cn/2026-06-27-20-23-17.png)
输入用户名和密码,登录成功后,会自动跳转回原页面,并提示授权成功。
#### SwaggerUI
@@ -77,7 +83,3 @@ VITE_OIDC_AUTOMATICSILENTRENEW = true #自动续期
这时所有的接口都可以直接访问访问时会在http头上自动加认证信息
![20220119180608](http://img.openauth.net.cn/20220119180608.png)