From 66183123600d47befd6c572712fd86c258352d19 Mon Sep 17 00:00:00 2001 From: Supra4E8C <69194597+LTbinglingfeng@users.noreply.github.com> Date: Wed, 24 Sep 2025 19:19:30 +0800 Subject: [PATCH] =?UTF-8?q?=E6=9B=B4=E6=96=B0=20README=5FEN.md?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- README_EN.md | 235 +++++++++++++++++++-------------------------------- 1 file changed, 89 insertions(+), 146 deletions(-) diff --git a/README_EN.md b/README_EN.md index 4ef49ec..a20aadc 100644 --- a/README_EN.md +++ b/README_EN.md @@ -1,5 +1,4 @@ -Cli-Proxy-API-Management-Center - +# Cli-Proxy-API-Management-Center This is a modern web interface for managing the CLI Proxy API. Main Project: @@ -8,161 +7,111 @@ https://github.com/router-for-me/CLIProxyAPI Minimum required version: ≥ 5.0.0 Recommended version: ≥ 5.1.1 -Features -Authentication Management +## Features -Supports management key authentication +### Authentication Management +- Supports management key authentication +- Configurable API base address +- Real-time connection status detection -Configurable API base address +### Basic Settings +- **Debug Mode**: Enable/disable debugging +- **Proxy Settings**: Configure proxy server URL +- **Request Retries**: Set the number of request retries +- **Quota Management**: Configure behavior when the quota is exceeded +- **Local Access**: Manage local unauthenticated access -Real-time connection status detection +### API Key Management +- **Proxy Service Authentication Key**: Manage API keys for the proxy service +- **Gemini API**: Manage Google Gemini generative language API keys +- **Codex API**: Manage OpenAI Codex API configuration +- **Claude API**: Manage Anthropic Claude API configuration +- **OpenAI-Compatible Providers**: Manage OpenAI-compatible third-party providers -Basic Settings +### Authentication File Management +- Upload authentication JSON files +- Download existing authentication files +- Delete single or all authentication files +- Display file details -Debug Mode: Enable/disable debugging -Proxy Settings: Configure proxy server URL +## How to Use -Request Retries: Set the number of request retries +### 1. Direct Use (Recommended) +Simply open the `index.html` file directly in your browser to use it. -Quota Management: Configure behavior when the quota is exceeded - -Local Access: Manage local unauthenticated access - -API Key Management - -Proxy Service Authentication Key: Manage API keys for the proxy service - -Gemini API: Manage Google Gemini generative language API keys - -Codex API: Manage OpenAI Codex API configuration - -Claude API: Manage Anthropic Claude API configuration - -OpenAI-Compatible Providers: Manage OpenAI-compatible third-party providers - -Authentication File Management - -Upload authentication JSON files - -Download existing authentication files - -Delete single or all authentication files - -Display file details - -How to Use -1. Direct Use (Recommended) - -Simply open the index.html file directly in your browser to use it. - -2. Use a Local Server -code -Bash -download -content_copy -expand_less +### 2. Use a Local Server +```bash # Install dependencies npm install # Start the server on the default port (3000) npm start -3. Configure API Connection +``` -Open the management interface. +### 3. Configure API Connection +1. Open the management interface. +2. On the login screen, enter: + - **Remote Address**: `http://localhost:8317` (`/v0/management` will be auto-completed for you) + - **Management Key**: Your management key +3. Click the "Connect" button. +4. Once connected successfully, all features will be available. -On the login screen, enter: +## Interface Description -Remote Address: http://localhost:8317 (/v0/management will be auto-completed for you) +### Navigation Menu +- **Basic Settings**: Basic configurations like debugging, proxy, retries, etc. +- **API Keys**: Management of keys for various API services. +- **AI Providers**: Configuration for AI service providers. +- **Auth Files**: Upload and download management for authentication files. +- **System Info**: Connection status and system information. -Management Key: Your management key +## Feature Highlights -Click the "Connect" button. +### Modern UI +- Responsive design, supports all screen sizes +- Beautiful gradient colors and shadow effects +- Smooth animations and transition effects +- Intuitive icons and status indicators -Once connected successfully, all features will be available. +### Real-time Updates +- Configuration changes take effect immediately +- Real-time status feedback +- Automatic data refresh -Interface Description -Navigation Menu +### Security Features +- Masked display for keys -Basic Settings: Basic configurations like debugging, proxy, retries, etc. +### Responsive Design +- Perfectly adapts to desktop and mobile devices +- Adaptive layout +- Touch-friendly interactions -API Keys: Management of keys for various API services. +## Tech Stack -AI Providers: Configuration for AI service providers. +- **Frontend**: Plain HTML, CSS, JavaScript +- **Styling**: CSS3 + Flexbox/Grid +- **Icons**: Font Awesome 6.4.0 +- **Fonts**: Segoe UI system font +- **API**: RESTful API calls -Auth Files: Upload and download management for authentication files. +## Troubleshooting -System Info: Connection status and system information. +### 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. -Feature Highlights -Modern UI +### Data Not Updating +1. Click the "Refresh All" button. +2. Check your network connection. +3. Check the browser's console for any error messages. -Responsive design, supports all screen sizes +## Development Information -Beautiful gradient colors and shadow effects - -Smooth animations and transition effects - -Intuitive icons and status indicators - -Real-time Updates - -Configuration changes take effect immediately - -Real-time status feedback - -Automatic data refresh - -Security Features - -Masked display for keys - -Responsive Design - -Perfectly adapts to desktop and mobile devices - -Adaptive layout - -Touch-friendly interactions - -Tech Stack - -Frontend: Plain HTML, CSS, JavaScript - -Styling: CSS3 + Flexbox/Grid - -Icons: Font Awesome 6.4.0 - -Fonts: Segoe UI system font - -API: RESTful API calls - -Troubleshooting -Connection Issues - -Confirm that the CLI Proxy API service is running. - -Check if the API address is correct. - -Verify that the management key is valid. - -Ensure your firewall settings allow the connection. - -Data Not Updating - -Click the "Refresh All" button. - -Check your network connection. - -Check the browser's console for any error messages. - -Development Information -File Structure -code -Code -download -content_copy -expand_less +### File Structure +``` webui/ ├── index.html # Main page ├── styles.css # Stylesheet @@ -170,26 +119,20 @@ webui/ ├── package.json # Project configuration ├── i18n.js # Internationalization support └── README.md # README document -API Calls +``` -All API calls are handled through the makeRequest method of the ManagerAPI class, which includes: +### API Calls +All API calls are handled through the `makeRequest` method of the `ManagerAPI` class, which includes: +- Automatic addition of authentication headers +- Error handling +- JSON response parsing -Automatic addition of authentication headers - -Error handling - -JSON response parsing - -State Management - -API address and key are saved in local storage - -Connection status is maintained in memory - -Real-time data refresh mechanism - -Contributing +### State Management +- API address and key are saved in local storage +- Connection status is maintained in memory +- Real-time data refresh mechanism +## 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. \ No newline at end of file