From 0e58d0e8b7fd07004990e99fbdc6a080380c0304 Mon Sep 17 00:00:00 2001 From: kaitranntt Date: Fri, 2 Jan 2026 22:31:28 -0500 Subject: [PATCH] fix(cliproxy): add management_key support for remote proxy auth separation - Add management_key field to CliproxyServerConfig for separate management API auth - Update proxy-target-resolver with buildManagementHeaders() for /v0/management/* endpoints - Update stats-fetcher and remote-auth-fetcher to use management headers - Add management_key input field to dashboard remote proxy settings - Disable quota UI in remote mode (tokens on remote server) - Fix preset application to use dynamic API key from config instead of hardcoded placeholder --- src/cliproxy/proxy-target-resolver.ts | 31 +++++++++++++++++- src/cliproxy/remote-auth-fetcher.ts | 5 +-- src/cliproxy/stats-fetcher.ts | 19 +++++++---- src/config/unified-config-loader.ts | 2 ++ src/config/unified-config-types.ts | 9 +++++- .../cliproxy/provider-editor/index.tsx | 18 +++++++++-- .../provider-editor/model-config-tab.tsx | 5 ++- ui/src/lib/api-client.ts | 6 +++- ui/src/lib/preset-utils.ts | 23 ++++++++++++- .../pages/settings/hooks/use-proxy-config.ts | 3 ++ .../pages/settings/sections/proxy/index.tsx | 15 +++++++++ .../sections/proxy/remote-proxy-card.tsx | 32 +++++++++++++++++-- 12 files changed, 149 insertions(+), 19 deletions(-) diff --git a/src/cliproxy/proxy-target-resolver.ts b/src/cliproxy/proxy-target-resolver.ts index 7124c7a1..c9d5cd83 100644 --- a/src/cliproxy/proxy-target-resolver.ts +++ b/src/cliproxy/proxy-target-resolver.ts @@ -22,8 +22,10 @@ export interface ProxyTarget { port: number; /** Protocol (http/https) */ protocol: 'http' | 'https'; - /** Optional auth token - only send header if defined and non-empty */ + /** Optional auth token for API endpoints - only send header if defined and non-empty */ authToken?: string; + /** Optional management key for management API endpoints (/v0/management/*) */ + managementKey?: string; /** True if targeting remote server, false if local */ isRemote: boolean; } @@ -56,6 +58,7 @@ export function getProxyTarget(): ProxyTarget { port, protocol, authToken: config.remote.auth_token || undefined, // Empty string -> undefined + managementKey: config.remote.management_key || undefined, // Empty string -> undefined isRemote: true, }; } @@ -102,3 +105,29 @@ export function buildProxyHeaders( return headers; } + +/** + * Build request headers for management API endpoints (/v0/management/*). + * Uses management_key if configured, otherwise falls back to authToken. + * + * @param target Resolved proxy target + * @param additionalHeaders Extra headers to merge + */ +export function buildManagementHeaders( + target: ProxyTarget, + additionalHeaders: Record = {} +): Record { + const headers: Record = { + Accept: 'application/json', + ...additionalHeaders, + }; + + // Use management key for management API, fallback to authToken + const authKey = target.managementKey ?? target.authToken; + + if (authKey) { + headers['Authorization'] = `Bearer ${authKey}`; + } + + return headers; +} diff --git a/src/cliproxy/remote-auth-fetcher.ts b/src/cliproxy/remote-auth-fetcher.ts index 358ee42a..5de9218e 100644 --- a/src/cliproxy/remote-auth-fetcher.ts +++ b/src/cliproxy/remote-auth-fetcher.ts @@ -6,7 +6,7 @@ import { getProxyTarget, buildProxyUrl, - buildProxyHeaders, + buildManagementHeaders, ProxyTarget, } from './proxy-target-resolver'; @@ -81,6 +81,7 @@ export async function fetchRemoteAuthStatus(target?: ProxyTarget): Promise controller.abort(), REMOTE_FETCH_TIMEOUT_MS); @@ -88,7 +89,7 @@ export async function fetchRemoteAuthStatus(target?: ProxyTarget): Promise): UnifiedConfig { auth_token: partial.cliproxy_server?.remote?.auth_token ?? DEFAULT_CLIPROXY_SERVER_CONFIG.remote.auth_token, + // management_key is optional - falls back to auth_token when not set + management_key: partial.cliproxy_server?.remote?.management_key, }, fallback: { enabled: diff --git a/src/config/unified-config-types.ts b/src/config/unified-config-types.ts index 18d5e3d5..166349cb 100644 --- a/src/config/unified-config-types.ts +++ b/src/config/unified-config-types.ts @@ -225,8 +225,15 @@ export interface ProxyRemoteConfig { port?: number; /** Protocol for remote connection */ protocol: 'http' | 'https'; - /** Auth token for remote proxy (optional, sent as header) */ + /** Auth token for remote proxy API endpoints (optional, sent as header) */ auth_token: string; + /** + * Management key for remote proxy management API endpoints. + * CLIProxyAPI uses separate authentication for management endpoints + * (/v0/management/*) via 'secret-key' config. + * If not set, falls back to auth_token for backwards compatibility. + */ + management_key?: string; /** Connection timeout in milliseconds (default: 2000) */ timeout?: number; } diff --git a/ui/src/components/cliproxy/provider-editor/index.tsx b/ui/src/components/cliproxy/provider-editor/index.tsx index 7e79ffaf..53338e3c 100644 --- a/ui/src/components/cliproxy/provider-editor/index.tsx +++ b/ui/src/components/cliproxy/provider-editor/index.tsx @@ -5,6 +5,7 @@ /* eslint-disable react-refresh/only-export-components */ import { useMemo, useState } from 'react'; +import { useQuery } from '@tanstack/react-query'; import { ConfirmDialog } from '@/components/shared/confirm-dialog'; import { Tabs, TabsList, TabsTrigger, TabsContent } from '@/components/ui/tabs'; import { Loader2, Code2 } from 'lucide-react'; @@ -93,11 +94,23 @@ export function ProviderEditor({ const accounts = authStatus.accounts || []; + // Fetch effective API key for presets (uses configured value, not hardcoded) + const { data: authTokens } = useQuery<{ apiKey: { value: string } }>({ + queryKey: ['auth-tokens-raw'], + queryFn: async () => { + const response = await fetch('/api/settings/auth/tokens/raw'); + if (!response.ok) return { apiKey: { value: 'ccs-internal-managed' } }; + return response.json(); + }, + staleTime: 60000, // Cache for 1 minute + }); + const effectiveApiKey = authTokens?.apiKey?.value ?? 'ccs-internal-managed'; + const handleApplyPreset = (updates: Record) => { const effectivePort = port ?? CLIPROXY_PORT; updateEnvValues({ ANTHROPIC_BASE_URL: `http://127.0.0.1:${effectivePort}/api/provider/${provider}`, - ANTHROPIC_AUTH_TOKEN: 'ccs-internal-managed', + ANTHROPIC_AUTH_TOKEN: effectiveApiKey, ...updates, }); toast.success(`Applied "${updates.ANTHROPIC_MODEL?.split('/').pop() || 'preset'}" preset`); @@ -107,7 +120,7 @@ export function ProviderEditor({ const effectivePort = port ?? CLIPROXY_PORT; updateEnvValues({ ANTHROPIC_BASE_URL: `http://127.0.0.1:${effectivePort}/api/provider/${provider}`, - ANTHROPIC_AUTH_TOKEN: 'ccs-internal-managed', + ANTHROPIC_AUTH_TOKEN: effectiveApiKey, ANTHROPIC_MODEL: values.default, ANTHROPIC_DEFAULT_OPUS_MODEL: values.opus, ANTHROPIC_DEFAULT_SONNET_MODEL: values.sonnet, @@ -189,6 +202,7 @@ export function ProviderEditor({ onRemoveAccount={onRemoveAccount} isRemovingAccount={isRemovingAccount} privacyMode={privacyMode} + isRemoteMode={isRemoteMode} /> void; isRemovingAccount?: boolean; privacyMode?: boolean; + /** True if connected to remote CLIProxy (quota not available) */ + isRemoteMode?: boolean; } export function ModelConfigTab({ @@ -60,6 +62,7 @@ export function ModelConfigTab({ onRemoveAccount, isRemovingAccount, privacyMode, + isRemoteMode, }: ModelConfigTabProps) { // Kiro-specific: no-incognito setting (defaults to true = normal browser) const isKiro = provider === 'kiro'; @@ -133,7 +136,7 @@ export function ModelConfigTab({ onRemoveAccount={onRemoveAccount} isRemovingAccount={isRemovingAccount} privacyMode={privacyMode} - showQuota={provider === 'agy'} + showQuota={provider === 'agy' && !isRemoteMode} isKiro={isKiro} kiroNoIncognito={kiroNoIncognito} onKiroNoIncognitoChange={saveKiroNoIncognito} diff --git a/ui/src/lib/api-client.ts b/ui/src/lib/api-client.ts index 60e3ec02..a2cf98a5 100644 --- a/ui/src/lib/api-client.ts +++ b/ui/src/lib/api-client.ts @@ -193,6 +193,8 @@ export interface ProxyRemoteConfig { port?: number; protocol: 'http' | 'https'; auth_token: string; + /** Management key for /v0/management/* endpoints (optional, falls back to auth_token) */ + management_key?: string; } /** Fallback configuration */ @@ -278,7 +280,9 @@ export const api = { cliproxy: { list: () => request<{ variants: Variant[] }>('/cliproxy'), getAuthStatus: () => - request<{ authStatus: AuthStatus[]; source?: 'remote' | 'local' }>('/cliproxy/auth'), + request<{ authStatus: AuthStatus[]; source?: 'remote' | 'local'; error?: string }>( + '/cliproxy/auth' + ), create: (data: CreateVariant) => request('/cliproxy', { method: 'POST', diff --git a/ui/src/lib/preset-utils.ts b/ui/src/lib/preset-utils.ts index 80ce9673..ebdb724d 100644 --- a/ui/src/lib/preset-utils.ts +++ b/ui/src/lib/preset-utils.ts @@ -8,6 +8,24 @@ import { MODEL_CATALOGS } from './model-catalogs'; /** CLIProxy port - should match the backend configuration */ export const CLIPROXY_PORT = 8317; +/** Default fallback API key if fetch fails */ +const DEFAULT_API_KEY = 'ccs-internal-managed'; + +/** + * Fetch effective API key from backend + * Falls back to default if fetch fails + */ +async function fetchEffectiveApiKey(): Promise { + try { + const response = await fetch('/api/settings/auth/tokens/raw'); + if (!response.ok) return DEFAULT_API_KEY; + const data = await response.json(); + return data?.apiKey?.value ?? DEFAULT_API_KEY; + } catch { + return DEFAULT_API_KEY; + } +} + /** * Apply default preset for a provider to its settings * Uses the first model's presetMapping or falls back to using defaultModel for all tiers @@ -32,11 +50,14 @@ export async function applyDefaultPreset( haiku: catalog.defaultModel, }; + // Fetch effective API key (respects user customization) + const effectiveApiKey = await fetchEffectiveApiKey(); + const effectivePort = port ?? CLIPROXY_PORT; const settings = { env: { ANTHROPIC_BASE_URL: `http://127.0.0.1:${effectivePort}/api/provider/${provider}`, - ANTHROPIC_AUTH_TOKEN: 'ccs-internal-managed', + ANTHROPIC_AUTH_TOKEN: effectiveApiKey, ANTHROPIC_MODEL: mapping.default, ANTHROPIC_DEFAULT_OPUS_MODEL: mapping.opus, ANTHROPIC_DEFAULT_SONNET_MODEL: mapping.sonnet, diff --git a/ui/src/pages/settings/hooks/use-proxy-config.ts b/ui/src/pages/settings/hooks/use-proxy-config.ts index b9e9cb50..eae80880 100644 --- a/ui/src/pages/settings/hooks/use-proxy-config.ts +++ b/ui/src/pages/settings/hooks/use-proxy-config.ts @@ -13,6 +13,7 @@ export function useProxyConfig() { const [editedHost, setEditedHost] = useState(null); const [editedPort, setEditedPort] = useState(null); const [editedAuthToken, setEditedAuthToken] = useState(null); + const [editedManagementKey, setEditedManagementKey] = useState(null); const [editedLocalPort, setEditedLocalPort] = useState(null); const fetchConfig = useCallback(async () => { @@ -108,6 +109,8 @@ export function useProxyConfig() { setEditedPort, editedAuthToken, setEditedAuthToken, + editedManagementKey, + setEditedManagementKey, editedLocalPort, setEditedLocalPort, fetchConfig, diff --git a/ui/src/pages/settings/sections/proxy/index.tsx b/ui/src/pages/settings/sections/proxy/index.tsx index 14a8b666..a9807ec8 100644 --- a/ui/src/pages/settings/sections/proxy/index.tsx +++ b/ui/src/pages/settings/sections/proxy/index.tsx @@ -28,6 +28,8 @@ export default function ProxySection() { setEditedPort, editedAuthToken, setEditedAuthToken, + editedManagementKey, + setEditedManagementKey, editedLocalPort, setEditedLocalPort, fetchConfig, @@ -62,11 +64,13 @@ export default function ProxySection() { const hostInput = config.remote.host ?? ''; const portInput = config.remote.port !== undefined ? config.remote.port.toString() : ''; const authTokenInput = config.remote.auth_token ?? ''; + const managementKeyInput = config.remote.management_key ?? ''; const localPortInput = (config.local.port ?? 8317).toString(); const displayHost = editedHost ?? hostInput; const displayPort = editedPort ?? portInput; const displayAuthToken = editedAuthToken ?? authTokenInput; + const displayManagementKey = editedManagementKey ?? managementKeyInput; const displayLocalPort = editedLocalPort ?? localPortInput; // Save functions for blur events @@ -97,6 +101,14 @@ export default function ProxySection() { setEditedAuthToken(null); }; + const saveManagementKey = () => { + const value = editedManagementKey ?? displayManagementKey; + if (value !== config.remote.management_key) { + saveConfig({ remote: { ...remoteConfig, management_key: value || undefined } }); + } + setEditedManagementKey(null); + }; + const saveLocalPort = () => { const port = parseInt(editedLocalPort ?? displayLocalPort, 10); if (!isNaN(port) && port !== config.local.port) { @@ -203,12 +215,15 @@ export default function ProxySection() { displayHost={displayHost} displayPort={displayPort} displayAuthToken={displayAuthToken} + displayManagementKey={displayManagementKey} setEditedHost={setEditedHost} setEditedPort={setEditedPort} setEditedAuthToken={setEditedAuthToken} + setEditedManagementKey={setEditedManagementKey} onSaveHost={saveHost} onSavePort={savePort} onSaveAuthToken={saveAuthToken} + onSaveManagementKey={saveManagementKey} onSaveConfig={saveConfig} onTestConnection={handleTestConnection} /> diff --git a/ui/src/pages/settings/sections/proxy/remote-proxy-card.tsx b/ui/src/pages/settings/sections/proxy/remote-proxy-card.tsx index 29e26413..ad03b65d 100644 --- a/ui/src/pages/settings/sections/proxy/remote-proxy-card.tsx +++ b/ui/src/pages/settings/sections/proxy/remote-proxy-card.tsx @@ -23,12 +23,15 @@ interface RemoteProxyCardProps { displayHost: string; displayPort: string; displayAuthToken: string; + displayManagementKey: string; setEditedHost: (value: string | null) => void; setEditedPort: (value: string | null) => void; setEditedAuthToken: (value: string | null) => void; + setEditedManagementKey: (value: string | null) => void; onSaveHost: () => void; onSavePort: () => void; onSaveAuthToken: () => void; + onSaveManagementKey: () => void; onSaveConfig: (updates: Partial) => void; onTestConnection: () => void; } @@ -41,12 +44,15 @@ export function RemoteProxyCard({ displayHost, displayPort, displayAuthToken, + displayManagementKey, setEditedHost, setEditedPort, setEditedAuthToken, + setEditedManagementKey, onSaveHost, onSavePort, onSaveAuthToken, + onSaveManagementKey, onSaveConfig, onTestConnection, }: RemoteProxyCardProps) { @@ -115,18 +121,38 @@ export function RemoteProxyCard({ - {/* Auth Token */} + {/* Auth Token (API Key) */}
- + setEditedAuthToken(e.target.value)} onBlur={onSaveAuthToken} - placeholder="Bearer token for authentication" + placeholder="For /v1/* API endpoints" className="font-mono" disabled={saving} /> +

+ Used for API requests to /v1/chat/completions +

+
+ + {/* Management Key */} +
+ + setEditedManagementKey(e.target.value)} + onBlur={onSaveManagementKey} + placeholder="For /v0/management/* endpoints" + className="font-mono" + disabled={saving} + /> +

+ Used for dashboard management APIs. Falls back to API Key if not set. +

{/* Test Connection */}