|
|
@@ -41,21 +41,145 @@
|
|
|
<li><strong>手机号码（唯一标识）：</strong> 用户的手机号码是统一认证平台的核心标识，<strong>同步后不能修改</strong>。</li>
|
|
|
<li><strong>可修改字段：</strong> 您只能修改用户的 <strong>映射账号</strong> (Mapped Account/ID) 和 <strong>邮箱</strong>。这允许您在业务系统账号变更时更新映射关系。</li>
|
|
|
</ul>
|
|
|
+
|
|
|
+ <div class="feature-card" style="margin-top: 20px;">
|
|
|
+ <h4>📌 同步接口使用场景</h4>
|
|
|
+ <p>普通对接的平台可以在自己平台的账号管理模块中使用同步接口，实现用户信息的实时同步：</p>
|
|
|
+ <ul>
|
|
|
+ <li><strong>新增用户：</strong> 当您的平台新增用户时，可以调用同步接口（<code>sync_action: UPSERT</code>）同步映射信息。此时支持传输手机号码、姓名等用户基本信息。</li>
|
|
|
+ <li><strong>修改用户：</strong> 当您的平台修改用户信息时，可以调用同步接口（<code>sync_action: UPSERT</code>）更新映射信息。注意：修改操作<strong>只支持更新映射信息</strong>（<code>mapped_key</code>、<code>mapped_email</code>、<code>is_active</code>），不支持修改手机号码、姓名等用户基本信息。</li>
|
|
|
+ <li><strong>删除用户：</strong> 当您的平台删除用户时，可以调用同步接口（<code>sync_action: DELETE</code>）删除映射关系。删除操作<strong>只删除映射关系</strong>，不会删除统一认证平台上的用户账号。</li>
|
|
|
+ </ul>
|
|
|
+ <p class="note" style="margin-top: 10px;">
|
|
|
+ <strong>重要提示：</strong> 同步接口只有在新增用户（用户不存在时）时才支持传输手机号码、姓名等用户信息；修改和删除操作仅支持映射信息的更新或删除。
|
|
|
+ </p>
|
|
|
+ </div>
|
|
|
</div>
|
|
|
|
|
|
<div class="section">
|
|
|
<h3>3. 用户管理数据说明</h3>
|
|
|
<ul>
|
|
|
- <li><strong>姓名与英文名：</strong> 在“用户管理”中维护的姓名和英文名称字段，<strong>不与特定应用的账号映射强行关联</strong>。</li>
|
|
|
+ <li><strong>姓名与英文名：</strong> 在"用户管理"中维护的姓名和英文名称字段，<strong>不与特定应用的账号映射强行关联</strong>。</li>
|
|
|
<li><strong>设计目的：</strong> 这部分是为了方便平台数据初始化和展示，方便管理员识别用户身份，而不作为业务系统的强校验字段。</li>
|
|
|
</ul>
|
|
|
</div>
|
|
|
+
|
|
|
+ <div class="section">
|
|
|
+ <h3>4. 快速对接统一登录平台</h3>
|
|
|
+ <p>这是最简单的集成方式，只需实现一个回调接口并配置用户映射信息，被配置的用户即可在快捷导航中看到该应用。</p>
|
|
|
+
|
|
|
+ <h4>4.1 准备工作</h4>
|
|
|
+ <ol>
|
|
|
+ <li>在 UAP 管理后台创建应用，获取 <code>App ID</code> 和 <code>App Secret</code></li>
|
|
|
+ <li><strong>关键配置：</strong> 在应用配置中填写合法的 <strong>回调地址 (Redirect URIs)</strong>，例如：<code>http://your-app.com/callback</code></li>
|
|
|
+ </ol>
|
|
|
+
|
|
|
+ <h4>4.2 实现回调接口</h4>
|
|
|
+ <p>用户登录成功后，统一认证平台会将用户重定向到您配置的回调地址，URL 格式如下：</p>
|
|
|
+ <div class="code-block">
|
|
|
+ <pre>http://your-app.com/callback?ticket=TICKET-xxxxx</pre>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <p>您的后端需要接收 <code>ticket</code> 参数，并调用 UAP 的验证接口换取用户信息。具体实现方式请参考：</p>
|
|
|
+ <p>
|
|
|
+ <a href="#" @click.prevent="switchToFastIntegration" class="help-link">
|
|
|
+ <el-icon style="margin-right: 5px;"><Link /></el-icon>
|
|
|
+ 快速对接指南 (Redirect SSO)
|
|
|
+ </a>
|
|
|
+ </p>
|
|
|
+
|
|
|
+ <div class="feature-card">
|
|
|
+ <h4>📋 验证接口说明</h4>
|
|
|
+ <ul>
|
|
|
+ <li><strong>接口地址：</strong> <code>POST /api/v1/simple/validate</code></li>
|
|
|
+ <li><strong>请求参数：</strong>
|
|
|
+ <ul>
|
|
|
+ <li><code>app_id</code> (string, 必填): 您的应用 ID</li>
|
|
|
+ <li><code>ticket</code> (string, 必填): 接收到的票据</li>
|
|
|
+ <li><code>timestamp</code> (int, 必填): 当前时间戳（秒）</li>
|
|
|
+ <li><code>sign</code> (string, 必填): 签名（使用 App Secret 计算）</li>
|
|
|
+ </ul>
|
|
|
+ </li>
|
|
|
+ <li><strong>签名算法：</strong> HMAC-SHA256，详细说明请查看 <a href="#" @click.prevent="switchToFastIntegration" class="help-link">快速对接指南</a></li>
|
|
|
+ </ul>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <h4>4.3 配置用户映射信息</h4>
|
|
|
+ <p>为了让用户在快捷导航中看到您的应用，需要为该用户配置映射关系。有两种方式：</p>
|
|
|
+
|
|
|
+ <div class="feature-card">
|
|
|
+ <h4>方式一：通过账号同步接口（推荐）</h4>
|
|
|
+ <p>使用 M2M 账号同步接口批量配置用户映射关系，详见 <a href="#" @click.prevent="switchToAccountSync" class="help-link">账号同步 (M2M) 使用说明</a>。</p>
|
|
|
+ <p><strong>接口地址：</strong> <code>POST /api/v1/apps/mapping/sync</code></p>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <div class="feature-card">
|
|
|
+ <h4>方式二：通过管理后台手动配置</h4>
|
|
|
+ <ol>
|
|
|
+ <li>登录 UAP 管理后台，进入「应用管理」</li>
|
|
|
+ <li>选择您的应用，进入「账号映射」页面</li>
|
|
|
+ <li>点击「创建映射」，填写用户手机号和映射信息（<code>mapped_key</code>、<code>mapped_email</code>）</li>
|
|
|
+ <li>保存后，该用户即可在快捷导航中看到该应用</li>
|
|
|
+ </ol>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <h4>4.4 快捷导航显示规则</h4>
|
|
|
+ <ul>
|
|
|
+ <li>用户登录统一认证平台后，在「快捷导航」页面可以看到所有已配置映射关系的应用</li>
|
|
|
+ <li>只有 <code>is_active = true</code> 的映射关系才会显示</li>
|
|
|
+ <li>点击应用图标后，系统会自动跳转到统一登录页面，完成 SSO 登录</li>
|
|
|
+ </ul>
|
|
|
+
|
|
|
+ <el-alert title="提示" type="info" :closable="false" show-icon style="margin-top: 20px;">
|
|
|
+ <div>
|
|
|
+ <strong>完整对接流程：</strong>
|
|
|
+ <ol style="margin-top: 10px; padding-left: 20px;">
|
|
|
+ <li>创建应用并配置回调地址</li>
|
|
|
+ <li>实现回调接口，验证 ticket 并获取用户信息（详见 <a href="#" @click.prevent="switchToFastIntegration" class="help-link">快速对接指南</a>）</li>
|
|
|
+ <li>配置用户映射关系（通过同步接口或管理后台）</li>
|
|
|
+ <li>用户在快捷导航中点击应用，完成 SSO 登录</li>
|
|
|
+ </ol>
|
|
|
+ </div>
|
|
|
+ </el-alert>
|
|
|
+ </div>
|
|
|
</div>
|
|
|
</template>
|
|
|
|
|
|
<script setup lang="ts">
|
|
|
+import { inject } from 'vue'
|
|
|
+import { Link } from '@element-plus/icons-vue'
|
|
|
+
|
|
|
+// 从父组件注入切换tab的方法
|
|
|
+const switchHelpTab = inject<(value: string) => void>('switchHelpTab')
|
|
|
+
|
|
|
+const switchToFastIntegration = () => {
|
|
|
+ if (switchHelpTab) {
|
|
|
+ switchHelpTab('fast-integration')
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+const switchToAccountSync = () => {
|
|
|
+ if (switchHelpTab) {
|
|
|
+ switchHelpTab('account-sync')
|
|
|
+ }
|
|
|
+}
|
|
|
</script>
|
|
|
|
|
|
<style scoped>
|
|
|
@import './help.css';
|
|
|
+
|
|
|
+.help-link {
|
|
|
+ color: #409eff;
|
|
|
+ text-decoration: none;
|
|
|
+ display: inline-flex;
|
|
|
+ align-items: center;
|
|
|
+ font-weight: 500;
|
|
|
+ transition: color 0.3s;
|
|
|
+ cursor: pointer;
|
|
|
+}
|
|
|
+
|
|
|
+.help-link:hover {
|
|
|
+ color: #66b1ff;
|
|
|
+ text-decoration: underline;
|
|
|
+}
|
|
|
</style>
|
liuq