pad.ws 使用指南：如何在Keycloak配置用户授权登录

Pad.ws 是一款基于浏览器的在线协作白板工具，让你可以随时随地进行创意绘图、头脑风暴和视觉化思考。

应用安装后，打开首页，这里需要先进行授权登录

在 Keycloak 中创建 Client 的完整步骤

第1步：进入 Keycloak 管理界面

1. 访问：https://padws.域名.heiyu.space/auth/
2. 登录：
   • Username: admin
   • Password: admin123

第2步：选择/创建 Realm

1. 点击左上角下拉菜单（默认是 "Master"）
2. 此时还没有 padws realm：
   • 点击 "Create Realm"
   • Realm name: padws
   • 点击 "Create"
     
3. 确保当前在 padws realm 中（左上角显示 "padws"）

第3步：创建 Client（重点）

3.1 General Settings（常规设置）

点击左侧菜单 "Clients" → "Create client"

填写：

Client type: OpenID Connect
Client ID: padws-client

直接复制:

padws-client

点击 "Next"

---

3.2 Capability config（功能配置）

填写：

☑ Client authentication: ON（重要！）
☐ Authorization: OFF
☑ Standard flow: ON（勾选）
☑ Direct access grants: ON（勾选）
☐ Implicit flow: OFF
☐ Service accounts roles: OFF
☐ OAuth 2.0 Device Authorization Grant: OFF

点击 "Next"

---

3.3 Login settings（登录设置）⭐ 这是最关键的一步

所有 URL 配置（直接复制粘贴）：

字段名	填写内容	说明
Root URL	https://padws.{your-url}.heiyu.space	应用根地址
Home URL	https://padws.{your-url}.heiyu.space	首页地址
Valid redirect URIs	https://padws.{your-url}.heiyu.space/*	⭐ OAuth 回调地址（重点）
Valid post logout redirect URIs	https://padws.{your-url}.heiyu.space/*	登出后重定向地址
Web origins	https://padws.{your-url}.heiyu.space	CORS 允许的来源

📋 详细填写说明

✅ Root URL

https://padws.lanmao168.heiyu.space

作用: 应用的根 URL，Keycloak 会以此为基础生成其他相对路径。

---

✅ Home URL

https://padws.lanmao168.heiyu.space

作用: 用户登录后的默认跳转页面。

---

⭐ Valid redirect URIs（最重要！）

https://padws.lanmao168.heiyu.space/*

详细说明:

• 这是 OAuth 回调地址
• 登录成功后，Keycloak 会重定向到这个地址
• /* 通配符允许所有子路径
• 实际回调地址是：https://padws.lanmao168.heiyu.space/api/auth/callback

---

✅ Valid post logout redirect URIs

https://padws.lanmao168.heiyu.space/*

作用: 用户登出后允许重定向的地址。

---

✅ Web origins

https://padws.lanmao168.heiyu.space

作用:

• CORS（跨域资源共享）配置
• 允许从这个域名发起请求到 Keycloak
• 不需要 /* 通配符
• 不需要 尾部斜杠 /

---

🔑 第4步：获取 Client Secret

1. 保存后，点击 "Credentials" 标签
2. 查看 Client secret 字段
3. 点击复制图标（📋）复制 secret
4. 保存这个值！示例格式：

   aBcD1234eFgH5678iJkL9012mNoPqRsT
   

🎨 第5步：配置 Audience Mapper（必须！）

这一步很重要，否则 token 验证会失败。

1. 在 padws-client 详情页面，点击 "Client scopes" 标签

3. 找到 padws-client-dedicated 并点击
4. 点击 "Add mapper" → "configure a new mapper"

6. 选择 "Audience"

8. 填写：

Name: audience-mapper
Included Client Audience: padws-client
Add to ID token: ON
Add to access token: ON

6. 点击 "Save"

---

👤 第6步：创建测试用户

1. 点击左侧菜单 "Users"
2. 点击 "Add user"

4. 填写：

Username: testuser
Email: test@padws.local
Email verified: ✅ 勾选（重要！）
First name: Test
Last name: User

4. 点击 "Create"
5. 点击 "Credentials" 标签

7. 点击 "Set password"
8. 填写：

Password: test123
Password confirmation: test123
Temporary: OFF（关闭临时密码）

8. 点击 "Save"
9. 确认对话框点击 "Save password"

---

配置完成后的下一步

1. 复制 Client secret
2. 更新应用环境变量 OIDC_CLIENT_SECRET
3. 重启应用
4. 测试登录：https://padws.lanmao168.heiyu.space/api/auth/login

登录后即可看到界面了

也可以重新打开应用，点击 google登录，用刚才的 testuser用户授权即可

享受创作的乐趣吧！ ✨