mirror of
https://github.com/router-for-me/Cli-Proxy-API-Management-Center.git
synced 2026-02-03 11:20:50 +08:00
108 lines
5.0 KiB
Markdown
108 lines
5.0 KiB
Markdown
# Cli-Proxy-API-Management-Center
|
|
This is the modern WebUI for managing the CLI Proxy API.
|
|
|
|
[中文文档](README_CN.md)
|
|
|
|
Main Project: https://github.com/router-for-me/CLIProxyAPI
|
|
Example URL: https://remote.router-for.me/
|
|
Minimum required version: ≥ 6.3.0 (recommended ≥ 6.5.0)
|
|
|
|
Since 6.0.19 the WebUI ships with the main program; access it via `/management.html` on the API port once the service is running.
|
|
|
|
## Features
|
|
|
|
### Capabilities
|
|
- **Login & UX**: Auto-detects the current address (manual override/reset supported), encrypted auto-login, language/theme toggles, responsive layout with mobile sidebar.
|
|
- **Basic Settings**: Debug, proxy URL, request retries, quota fallback (auto-switch project/preview models), usage-statistics toggle, request logging & logging-to-file switches, WebSocket `/ws/*` auth switch.
|
|
- **Keys & Providers**: Manage proxy auth keys, Gemini/Codex/Claude configs, OpenAI-compatible providers (custom base URLs/headers/proxy/model aliases), Vertex AI credential import from service-account JSON with optional location.
|
|
- **Auth Files & OAuth**: Upload/download/search/paginate JSON credentials; type filters (Qwen/Gemini/GeminiCLI/AIStudio/Claude/Codex/Antigravity/iFlow/Vertex/Empty); delete-all; OAuth/Device flows for Codex, Anthropic (Claude), Antigravity (Google), Gemini CLI (optional project), Qwen; iFlow OAuth and cookie login.
|
|
- **Logs**: Live viewer with auto-refresh/incremental updates, download and clear; section appears when logging-to-file is enabled.
|
|
- **Usage Analytics**: Overview cards, hourly/daily toggles, up to three model lines per chart, per-API stats table (Chart.js).
|
|
- **Config Management**: In-browser CodeMirror YAML editor for `/config.yaml` with reload/save, syntax highlighting, and status feedback.
|
|
- **System Info & Versioning**: Connection/config cache status, last refresh time, server version/build date, and UI version in the footer.
|
|
- **Security & Preferences**: Masked secrets, secure local storage, persistent theme/language/sidebar state, real-time status feedback.
|
|
|
|
## How to Use
|
|
|
|
1) **After CLI Proxy API is running (recommended)**
|
|
Visit `http://your-server:8317/management.html`.
|
|
|
|
2) **Direct static use after build**
|
|
The single file `dist/index.html` generated by `npm run build`
|
|
|
|
3) **Local server**
|
|
```bash
|
|
npm install
|
|
npm start # http://localhost:3000
|
|
npm run dev # optional dev port: 3090
|
|
# or
|
|
python -m http.server 8000
|
|
```
|
|
Then open the corresponding localhost URL.
|
|
|
|
4) **Configure connection**
|
|
The login page shows the detected address; you can override it, enter the management key, and click Connect. Saved credentials use encrypted local storage for auto-login.
|
|
|
|
Tip: The Logs navigation item appears after enabling "Logging to file" in Basic Settings.
|
|
|
|
## Tech Stack
|
|
|
|
- **Frontend**: Plain HTML, CSS, JavaScript (ES6+)
|
|
- **Styling**: CSS3 + Flexbox/Grid with CSS Variables
|
|
- **Icons**: Font Awesome 6.4.0
|
|
- **Charts**: Chart.js for interactive data visualization
|
|
- **Editor/Parsing**: CodeMirror + js-yaml
|
|
- **Fonts**: Segoe UI system font
|
|
- **Internationalization**: Custom i18n (EN/CN) and theme system (light/dark)
|
|
- **API**: RESTful management endpoints with automatic authentication
|
|
- **Storage**: LocalStorage with lightweight encryption for preferences/credentials
|
|
|
|
## Build & Development
|
|
|
|
- `npm run build` bundles everything into `dist/index.html` via webpack (`build.cjs`, `bundle-entry.js`, `build-scripts/prepare-html.js`).
|
|
- External CDNs remain for Font Awesome, Chart.js, and CodeMirror to keep the bundle lean.
|
|
- Development servers: `npm start` (3000) or `npm run dev` (3090); Python `http.server` also works for static hosting.
|
|
|
|
## Troubleshooting
|
|
|
|
### Connection Issues
|
|
1. Confirm that the CLI Proxy API service is running.
|
|
2. Check if the API address is correct.
|
|
3. Verify that the management key is valid.
|
|
4. Ensure your firewall settings allow the connection.
|
|
|
|
### Data Not Updating
|
|
1. Click the "Refresh All" button.
|
|
2. Check your network connection.
|
|
3. Check the browser's console for any error messages.
|
|
|
|
### Logs & Config Editor
|
|
- Logs: Requires server-side logging-to-file; 404 indicates the server build is too old or logging is disabled.
|
|
- Config editor: Requires `/config.yaml` endpoint; keep YAML valid before saving.
|
|
|
|
### Usage Stats
|
|
- Enable "Usage statistics" if charts stay empty; data resets on server restart.
|
|
|
|
## Project Structure
|
|
```
|
|
├── index.html
|
|
├── styles.css
|
|
├── app.js
|
|
├── i18n.js
|
|
├── src/ # Core/modules/utils source code
|
|
├── build.cjs # Webpack build script
|
|
├── bundle-entry.js # Bundling entry
|
|
├── build-scripts/ # Build utilities
|
|
│ └── prepare-html.js
|
|
├── dist/ # Bundled single-file output
|
|
├── BUILD_RELEASE.md
|
|
├── LICENSE
|
|
├── README.md
|
|
└── README_CN.md
|
|
```
|
|
|
|
## Contributing
|
|
We welcome Issues and Pull Requests to improve this project! We encourage more developers to contribute to the enhancement of this WebUI!
|
|
|
|
This project is licensed under the MIT License.
|