feat: 重构模型配置存储与 API Key 加密管理

主要修改点:

1. 遗留密码格式兼容 (server/src/app/core/admin_secret.py)
   - 新增 legacy_admin_secret_to_password_hash(): 将旧版 admin secret 记录转换为标准 scrypt 哈希格式

2. Scrypt 密码验证增强 (server/src/app/core/security.py)
   - verify_password(): 新增 scrypt$ 前缀检测,分流到专用验证函数
   - 新增 verify_scrypt_password(): 解析 scrypt$ 格式哈希并验证

3. 模型配置存储重构 (server/src/app/models/system_model_setting.py)
   - 新增 SystemModelSetting 模型(slot 为 PK)
   - 字段: slot, provider, model_name, endpoint, capability, priority, enabled, api_key_encrypted, created_at, updated_at

4. Settings Repository 扩展 (server/src/app/repositories/settings.py)
   - 新增 get_model_settings(): 获取所有模型配置
   - 新增 get_model_setting(slot): 按 slot 获取单个模型配置

5. Settings Service 重构 (server/src/app/services/settings.py)
   - 新增 ModelSlotConfig dataclass: 封装单个模型槽位的配置属性
   - 新增 MODEL_SLOT_CONFIGS 字典: main/backup/vlm/embedding 四个槽位配置
   - 重构 save_model_settings(): 批量保存模型配置到 SystemModelSetting 表
   - 新增 load_model_settings(): 从 SystemModelSetting 表加载所有模型配置
   - read_settings(): 整合 legacy secrets 与新的 SystemModelSetting 表数据
   - write_settings(): 拆分 model secrets 到 SystemModelSetting 表
   - decrypt_model_secret(): 新增从数据库读取加密的 API Key

6. 数据库模型注册 (server/src/app/db/base.py)
   - 注册 SystemModelSetting 模型

7. 前端 API URL 智能解析 (web/src/services/api.js)
   - 新增 isLoopbackHost(): 判断是否为回环地址
   - 新增 resolveBrowserReachableApiBaseUrl(): 当后端配置为回环地址但浏览器非回环时,自动替换为浏览器 host
   - 改进错误信息: "无法连接 FastAPI 后端服务,请确认后端已启动且浏览器可访问后端端口。"

8. 前端 Session 导航增强 (web/src/composables/useSystemState.js)
   - installSessionNavigation(): 调用 fetchBootstrapState 后设置运行时 API Base URL

9. Settings 视图增强 (web/src/views/SettingsView.vue)
   - API Key 输入框: 新增 @focus="clearModelSecretMask('xxx')" 清除遮罩
   - 新增 .secret-bound-state 提示: 显示"已从数据库加密加载,测试会使用已保存密钥"

10. Settings 脚本增强 (web/src/views/scripts/SettingsView.js)
    - 新增 clearModelSecretMask(slot): 清除指定槽位的 API Key 遮罩状态

11. CSS 样式 (web/src/assets/styles/views/settings-view.css)
    - 新增 .secret-bound-state 样式: 显示数据库已加载密钥的提示样式
This commit is contained in:
2026-05-08 11:14:04 +08:00
parent c5486dd3d3
commit 86568660a4
15 changed files with 532 additions and 68 deletions

View File

@@ -349,6 +349,21 @@
box-shadow: 0 0 0 4px rgba(16, 185, 129, 0.12);
}
.secret-bound-state {
min-height: 24px;
display: inline-flex;
align-items: center;
gap: 7px;
color: #047857;
font-size: 12px;
font-weight: 750;
line-height: 1.45;
}
.secret-bound-state i {
font-size: 15px;
}
.test-feedback {
display: flex;
align-items: flex-start;

View File

@@ -331,6 +331,7 @@ export function installSessionNavigation(router) {
fetchBootstrapState()
.then((state) => {
applyBootstrapState(state)
setRuntimeApiBaseUrl(resolveBrowserApiBaseUrl(state))
router.isReady().then(() => reconcileEntryRoute(router))
})
.catch(() => {

View File

@@ -4,18 +4,47 @@ function normalizeApiBaseUrl(value) {
return String(value || '/api/v1').replace(/\/$/, '')
}
function isLoopbackHost(hostname) {
const normalized = String(hostname || '').trim().toLowerCase()
return normalized === '127.0.0.1' || normalized === 'localhost' || normalized === '0.0.0.0' || normalized === '::1'
}
function resolveBrowserReachableApiBaseUrl(value) {
const normalized = normalizeApiBaseUrl(value)
if (typeof window === 'undefined') {
return normalized
}
try {
const apiUrl = new URL(normalized)
const browserHost = window.location.hostname
if (isLoopbackHost(apiUrl.hostname) && browserHost && !isLoopbackHost(browserHost)) {
apiUrl.hostname = browserHost
return normalizeApiBaseUrl(apiUrl.toString())
}
} catch {
return normalized
}
return normalized
}
function readStoredApiBaseUrl() {
if (typeof window === 'undefined') {
return ''
}
return window.localStorage.getItem(API_BASE_STORAGE_KEY) || ''
return resolveBrowserReachableApiBaseUrl(window.localStorage.getItem(API_BASE_STORAGE_KEY) || '')
}
let runtimeApiBaseUrl = normalizeApiBaseUrl(readStoredApiBaseUrl() || import.meta.env.VITE_API_BASE_URL || '/api/v1')
let runtimeApiBaseUrl = resolveBrowserReachableApiBaseUrl(
readStoredApiBaseUrl() || import.meta.env.VITE_API_BASE_URL || '/api/v1'
)
export function setRuntimeApiBaseUrl(value) {
runtimeApiBaseUrl = normalizeApiBaseUrl(value)
runtimeApiBaseUrl = resolveBrowserReachableApiBaseUrl(value)
if (typeof window !== 'undefined') {
window.localStorage.setItem(API_BASE_STORAGE_KEY, runtimeApiBaseUrl)
@@ -46,7 +75,7 @@ export async function apiRequest(path, options = {}) {
...options
})
} catch {
throw new Error('无法连接后端员工服务,请确认 FastAPI 已启动。')
throw new Error('无法连接 FastAPI 后端服务,请确认后端已启动且浏览器可访问后端端口。')
}
let payload = null

View File

@@ -223,8 +223,13 @@
v-model="pageState.llmForm.mainApiKey"
type="password"
autocomplete="off"
@focus="clearModelSecretMask('main')"
:placeholder="pageState.llmForm.mainApiKeyConfigured ? '已配置,如需修改请重新输入' : '保存后不会保留在草稿中'"
/>
<small v-if="pageState.llmForm.mainApiKeyConfigured" class="secret-bound-state">
<i class="mdi mdi-database-lock"></i>
<span>已从数据库加密加载测试会使用已保存密钥</span>
</small>
</label>
</div>
<div v-if="getModelTestState('main').message" class="test-feedback" :class="`is-${getModelTestState('main').status}`">
@@ -271,8 +276,13 @@
v-model="pageState.llmForm.backupApiKey"
type="password"
autocomplete="off"
@focus="clearModelSecretMask('backup')"
:placeholder="pageState.llmForm.backupApiKeyConfigured ? '已配置,如需修改请重新输入' : '保存后不会保留在草稿中'"
/>
<small v-if="pageState.llmForm.backupApiKeyConfigured" class="secret-bound-state">
<i class="mdi mdi-database-lock"></i>
<span>已从数据库加密加载测试会使用已保存密钥</span>
</small>
</label>
</div>
<div v-if="getModelTestState('backup').message" class="test-feedback" :class="`is-${getModelTestState('backup').status}`">
@@ -319,8 +329,13 @@
v-model="pageState.llmForm.vlmApiKey"
type="password"
autocomplete="off"
@focus="clearModelSecretMask('vlm')"
:placeholder="pageState.llmForm.vlmApiKeyConfigured ? '已配置,如需修改请重新输入' : '保存后不会保留在草稿中'"
/>
<small v-if="pageState.llmForm.vlmApiKeyConfigured" class="secret-bound-state">
<i class="mdi mdi-database-lock"></i>
<span>已从数据库加密加载测试会使用已保存密钥</span>
</small>
</label>
</div>
<div v-if="getModelTestState('vlm').message" class="test-feedback" :class="`is-${getModelTestState('vlm').status}`">
@@ -367,8 +382,13 @@
v-model="pageState.llmForm.embeddingApiKey"
type="password"
autocomplete="off"
@focus="clearModelSecretMask('embedding')"
:placeholder="pageState.llmForm.embeddingApiKeyConfigured ? '已配置,如需修改请重新输入' : '保存后不会保留在草稿中'"
/>
<small v-if="pageState.llmForm.embeddingApiKeyConfigured" class="secret-bound-state">
<i class="mdi mdi-database-lock"></i>
<span>已从数据库加密加载测试会使用已保存密钥</span>
</small>
</label>
</div>
<div

View File

@@ -42,9 +42,13 @@
<div v-if="canSubmit" class="setup-complete">
<p>所有必要步骤已通过检测可以写入配置并进入登录界面</p>
<button class="primary-btn setup-complete-btn" type="button" :disabled="submitting" @click="submitForm">
<i class="pi pi-check"></i>
<i :class="['pi', submitting ? 'pi-spin pi-spinner' : 'pi-check']"></i>
<span>{{ submitting ? '写入配置中...' : '完成初始化并进入登录' }}</span>
</button>
<p v-if="progressMessage" class="setup-complete-progress">
<i class="pi pi-spin pi-spinner"></i>
<span>{{ progressMessage }}</span>
</p>
</div>
</aside>
@@ -132,7 +136,7 @@
<div class="field-grid field-grid-2">
<label class="field">
<span>Server Host</span>
<input v-model.trim="form.server_host" type="text" placeholder="127.0.0.1" required />
<input v-model.trim="form.server_host" type="text" placeholder="0.0.0.0" required />
</label>
<label class="field">
@@ -226,6 +230,46 @@
</div>
</section>
</main>
<div v-if="startupVisible" class="setup-modal-backdrop" role="alertdialog" aria-modal="true">
<section class="setup-startup-modal" aria-label="后端启动进度">
<header class="setup-startup-head">
<div>
<p class="setup-kicker setup-kicker-light">BACKEND STARTUP</p>
<h2>正在完成系统启动</h2>
<span>{{ progressMessage || '正在准备后端服务...' }}</span>
</div>
<div class="setup-startup-spinner" aria-hidden="true">
<i v-if="!startupCountdownSeconds" class="pi pi-spin pi-spinner"></i>
<strong v-else>{{ startupCountdownSeconds }}</strong>
</div>
</header>
<div class="setup-startup-body">
<ol class="setup-startup-steps">
<li
v-for="step in startupSteps"
:key="step.id"
:class="['setup-startup-step', `is-${step.status || 'pending'}`]"
>
<i :class="startupStepIcon(step.status)"></i>
<div>
<strong>{{ step.label }}</strong>
<span>{{ step.detail }}</span>
</div>
</li>
</ol>
<section class="setup-startup-console" aria-label="后端启动日志">
<div class="setup-startup-console-head">
<strong>执行日志</strong>
<span>server/logs/bootstrap-backend.log</span>
</div>
<pre class="setup-startup-log">{{ startupLog || '等待后端启动输出...' }}</pre>
</section>
</div>
</section>
</div>
</template>
<script setup>
@@ -267,6 +311,26 @@ const props = defineProps({
errorMessage: {
type: String,
default: ''
},
progressMessage: {
type: String,
default: ''
},
startupCountdownSeconds: {
type: Number,
default: 0
},
startupLog: {
type: String,
default: ''
},
startupSteps: {
type: Array,
default: () => []
},
startupVisible: {
type: Boolean,
default: false
}
})
@@ -291,6 +355,22 @@ const {
testButtonLabel,
testSetup
} = useSetupView(props, emit)
function startupStepIcon(status) {
if (status === 'success') {
return 'pi pi-check-circle'
}
if (status === 'error') {
return 'pi pi-times-circle'
}
if (status === 'running') {
return 'pi pi-spin pi-spinner'
}
return 'pi pi-circle'
}
</script>
<style scoped src="../assets/styles/views/setup-view.css"></style>

View File

@@ -7,6 +7,7 @@ import { useToast } from '../../composables/useToast.js'
const SETTINGS_STORAGE_KEY = 'x-financial-settings-draft'
const CURRENT_YEAR = new Date().getFullYear()
const CUSTOM_OPENAI_PROVIDER = 'Custom OpenAI Compatible'
const MODEL_SECRET_MASK = '********'
const SECTION_DEFINITIONS = [
{
@@ -117,6 +118,8 @@ const MODEL_TEST_CONFIGS = {
}
}
const MODEL_API_KEY_CONFIGS = Object.values(MODEL_TEST_CONFIGS)
function normalizeValue(value) {
return String(value ?? '').trim()
}
@@ -277,6 +280,38 @@ function sanitizeForStorage(state) {
}
}
function getModelConfiguredKey(apiKeyKey) {
return `${apiKeyKey}Configured`
}
function isModelSecretMask(value) {
return value === MODEL_SECRET_MASK
}
function maskConfiguredModelSecrets(state) {
for (const config of MODEL_API_KEY_CONFIGS) {
const configuredKey = getModelConfiguredKey(config.apiKeyKey)
if (state.llmForm[configuredKey] && !normalizeValue(state.llmForm[config.apiKeyKey])) {
state.llmForm[config.apiKeyKey] = MODEL_SECRET_MASK
}
}
return state
}
function buildLlmPayload(llmForm) {
const payload = { ...llmForm }
for (const config of MODEL_API_KEY_CONFIGS) {
if (isModelSecretMask(payload[config.apiKeyKey])) {
payload[config.apiKeyKey] = ''
}
}
return payload
}
function persistSettings(state) {
if (typeof window === 'undefined') {
return
@@ -390,7 +425,7 @@ export default {
nextState.mailForm.password = currentState.mailForm.password
}
pageState.value = nextState
pageState.value = maskConfiguredModelSecrets(nextState)
persistSettings(pageState.value)
updateBrandPreviewFromState(pageState.value)
}
@@ -410,7 +445,7 @@ export default {
return {
companyForm: { ...pageState.value.companyForm },
adminForm: { ...pageState.value.adminForm },
llmForm: { ...pageState.value.llmForm },
llmForm: buildLlmPayload(pageState.value.llmForm),
logForm: { ...pageState.value.logForm },
mailForm: { ...pageState.value.mailForm }
}
@@ -456,17 +491,26 @@ export default {
function buildModelTestPayload(testKey) {
const config = MODEL_TEST_CONFIGS[testKey]
const llmForm = pageState.value.llmForm
const apiKey = llmForm[config.apiKeyKey]
return {
provider: llmForm[config.providerKey],
model: llmForm[config.modelKey],
endpoint: llmForm[config.endpointKey],
api_key: llmForm[config.apiKeyKey],
api_key: isModelSecretMask(apiKey) ? '' : apiKey,
capability: config.capability,
slot: testKey
}
}
function clearModelSecretMask(testKey) {
const config = MODEL_TEST_CONFIGS[testKey]
if (isModelSecretMask(pageState.value.llmForm[config.apiKeyKey])) {
pageState.value.llmForm[config.apiKeyKey] = ''
}
}
async function testModelConnection(testKey) {
const config = MODEL_TEST_CONFIGS[testKey]
const payload = buildModelTestPayload(testKey)
@@ -655,6 +699,7 @@ export default {
activeSectionConfig,
activateSection,
applyProviderPreset,
clearModelSecretMask,
completedSectionCount,
getModelTestState,
isModelTesting,