Supra4E8C d82d95465b feat(logs): enhance log viewer with line wrapping and improved filter options
- Added a toggle for wrapping long log lines in the LogsPage component.
- Updated the structured filters panel to open in a modal for better accessibility.
- Improved accessibility features with appropriate ARIA attributes.
- Refactored log rendering logic to support new wrapping functionality.
- Updated translations for filter and display settings in multiple languages.
- Enhanced styles for better layout and responsiveness in log viewer.
- Added tests to ensure layout integrity and functionality of new features.
2026-09-29 13:46:16 +08:00
2026-02-13 20:41:10 +08:00
2026-07-11 03:26:14 +08:00

CLI Proxy API Management Center

A single-file Web UI (React + TypeScript) for operating and troubleshooting the CLI Proxy API via its Management API (config, credentials, and logs).

中文文档

Main Project: https://github.com/router-for-me/CLIProxyAPI
Minimum Required Version: ≥ 8.0.0 (latest v8 release recommended)

Since version 6.0.19, the Web UI ships with the main program; access it via /management.html on the API port once the service is running.

Sponsor

https://go.apimart.ai/gh-cli-proxy-api-management-center

Thanks to APIMart for sponsoring this project!

APIMart is a low-cost API platform for AI image & video generation — GPT-Image-2 from $0.006/image, 160+ images per dollar. One async API covers both image and video: submit a task, get an ID, fetch results via polling or callback. Batch tens of thousands of images without timeouts, switch models without changing code. Pay-as-you-go with no monthly fee — sign up here to get started.

What this is (and isn’t)

  • This repository is the Web UI only. It exclusively uses the CLI Proxy API v8 Management API (/v8/management) and v8 configuration layout to read/update config, upload credentials, and view logs. There is no v0 fallback. Plugin resources and custom extensions retain their backend-declared paths.
  • It is not a proxy and does not forward traffic.

Upgrading from v7

Upgrade the backend before deploying this UI and back up config.yaml. The backend renders existing configuration in the v8 layout on reads; a successful v8 configuration write migrates the stored file. The editor only writes v8 fields. Client keys live in access.api-keys; top-level api-keys contains upstream provider groups.

Quick start

  1. Start your CLI Proxy API service.
  2. Open: http://<host>:<api_port>/management.html
  3. Enter your management key and connect.

The address is auto-detected from the current page URL; manual override is supported.

Option B: Run the dev server

bun install --frozen-lockfile
bun run dev

Open http://localhost:5173, then connect to your CLI Proxy API backend instance.

Option C: Build a single HTML file

bun install --frozen-lockfile
bun run build
  • Output: dist/index.html (all assets are inlined).
  • For CLI Proxy API bundling, the release workflow renames it to management.html.
  • To preview locally: bun run preview

Tip: opening dist/index.html via file:// may be blocked by browser CORS; serving it (preview/static server) is more reliable.

Connecting to the server

API address

You can enter any of the following; the UI will normalize it:

  • localhost:8317
  • http://192.168.1.10:8317
  • https://example.com:8317
  • http://example.com:8317/v8/management (also accepted; the suffix is removed internally)

Management key (not the same as API keys)

The management key is sent with every request as:

  • Authorization: Bearer <MANAGEMENT_KEY> (default)

This is different from the proxy access.api-keys you manage inside the UI (those are for client requests to the proxy endpoints).

Remote management

If you connect from a non-localhost browser, the server must allow remote management (e.g. management.allow-remote: true). Check the CLI Proxy API server documentation/config comments for the full authentication rules, server-side limits, and edge cases.

What you can manage (mapped to the UI pages)

  • Dashboard: connection status, server version/build date, quick counts, model availability snapshot.
  • Config Panel: visual editor for common config.yaml fields, basic settings, client access.api-keys, and source editing with YAML highlighting/search plus a save diff preview.
  • AI Providers:
    • Gemini/Codex/Claude/Vertex key entries (base URL, headers, proxy, model aliases, excluded models, prefix).
    • OpenAI-compatible providers (multiple API keys, custom headers, model alias import via /v1/models, optional browser-side "chat/completions" test).
  • Auth Files: upload/download/delete JSON credentials, filter/search/pagination, runtime-only indicators, view supported models per credential (when the server supports it), manage OAuth excluded models (supports * wildcards), configure OAuth model alias mappings.
  • OAuth: start OAuth/device flows for Codex, Anthropic/Claude, Antigravity, Kimi, and xAI/Grok; poll status; submit callback URLs or xAI/Grok displayed codes; import Vertex JSON credentials and iFlow cookies.
  • Quota Management: manage quota limits and usage for Claude, Antigravity, Codex, Kimi, xAI/Grok, and other providers.
  • Logs: tail logs with incremental polling, auto-refresh, search, hide management traffic, clear logs; download request error log files.
  • System: quick links, update check, request logging toggle, local login data cleanup, and fetch /v1/models (grouped view). Requires at least one proxy API key to query models.

Tech Stack

  • React 19 + TypeScript 6.0
  • Vite 8 (single-file build)
  • Zustand (state management)
  • Axios (HTTP client)
  • react-router-dom v7 (HashRouter)
  • Motion (animations)
  • CodeMirror 6 (YAML editor)
  • SCSS Modules (styling)
  • i18next (internationalization)

Internationalization

Currently supports four languages:

  • English (en)
  • Simplified Chinese (zh-CN)
  • Traditional Chinese (zh-TW)
  • Russian (ru)

The UI language is automatically detected from browser settings and can be manually switched from the login page or header language menu.

Browser Compatibility

  • Build target: ES2020
  • Supports modern browsers (Chrome, Firefox, Safari, Edge)
  • Responsive layout for mobile and tablet access

Build & release notes

  • Vite produces a single HTML output (dist/index.html) with all assets inlined (via vite-plugin-singlefile).
  • Tagging vX.Y.Z triggers .github/workflows/release.yml to publish dist/management.html.
  • The UI version shown on the System page is injected at build time (env VERSION, git tag, or package.json fallback).

Security notes

  • The management key is stored in browser localStorage using a lightweight obfuscation format (enc::v1::...) to avoid plaintext storage; treat it as sensitive.
  • Use a dedicated browser profile/device for management. Be cautious when enabling remote management and evaluate its exposure surface.

Troubleshooting

  • Can’t connect / 401: confirm the API address and management key; remote access may require enabling remote management in the server config.
  • Repeated auth failures: the server may temporarily block remote IPs.
  • Logs page missing: enable “Logging to file” in Basic Settings; the navigation item is shown only when file logging is enabled.
  • Some features show “unsupported”: the backend may be too old or the endpoint is disabled/absent (common for model lists per auth file, excluded models, logs).
  • OpenAI provider test fails: the test runs in the browser and depends on network/CORS of the provider endpoint; a failure here does not always mean the server cannot reach it.

Development

bun run dev        # Vite dev server
bun run build      # tsc + Vite build
bun run preview    # serve dist locally
bun run test       # Bun test suite
bun run lint       # ESLint (fails on warnings)
bun run verify     # test + lint + build
bun run format     # Prettier
bun run type-check # tsc --noEmit

Contributing

Issues and PRs are welcome. Please include:

  • Reproduction steps (server version + UI version)
  • Screenshots for UI changes
  • Verification notes (bun run verify, plus bun run type-check when run separately)

License

MIT

S
Description
This is a WebUI interface based on CLI-Proxy-API, designed to simplify configuration modifications and runtime status monitoring.
Readme MIT
28 MiB
Languages
TypeScript 88.1%
SCSS 11.8%