mirror of
https://github.com/praveentcom/openproxy.git
synced 2026-07-24 21:01:03 +02:00
feat: update configuration for OpenAI and Anthropic endpoints
- Created a new .env.example file with default environment variables for PORT, OPENAI_UPSTREAM_URL, ANTHROPIC_UPSTREAM_URL, and DATABASE_URL. - Updated .npmignore to exclude all .env files except .env.example. - Revised CONTRIBUTING.md to simplify the contribution process and provide clearer setup instructions. - Enhanced cost.ts with detailed type definitions and improved cost calculation logic. - Updated proxy.ts to include new environment variables and improved logging functionality. - Modified README.md to reflect new configuration instructions and usage examples. - Removed unnecessary dashboard files and streamlined the project structure.
This commit is contained in:
@@ -1,5 +0,0 @@
|
||||
# PostgreSQL connection string (same as proxy server)
|
||||
DATABASE_URL=postgresql://user:password@localhost:5432/database
|
||||
|
||||
# Database table name (default: llm_proxy)
|
||||
DATABASE_TABLE=llm_proxy
|
||||
@@ -1,195 +0,0 @@
|
||||
# OpenProxy Metrics Dashboard
|
||||
|
||||
A lightweight Next.js dashboard for visualizing OpenProxy LLM request metrics in real-time.
|
||||
|
||||
## Features
|
||||
|
||||
- **Real-time Metrics Overview**: Total requests, tokens, costs, and response times
|
||||
- **Model Breakdown**: Usage statistics grouped by LLM model
|
||||
- **Hourly Trends**: Visual charts showing request patterns over time
|
||||
- **Recent Requests**: Detailed table of recent API calls
|
||||
- **Auto-refresh**: Automatic updates every 30 seconds
|
||||
- **Time Range Selection**: View metrics for the last hour, 6 hours, 24 hours, or 7 days
|
||||
|
||||
## Prerequisites
|
||||
|
||||
- Node.js 18 or higher
|
||||
- PostgreSQL database (same as the proxy server)
|
||||
- OpenProxy proxy server running
|
||||
|
||||
## Installation
|
||||
|
||||
1. Navigate to the dashboard directory:
|
||||
```bash
|
||||
cd dashboard
|
||||
```
|
||||
|
||||
2. Install dependencies:
|
||||
```bash
|
||||
npm install
|
||||
```
|
||||
|
||||
3. Create a `.env` file (copy from `.env.example`):
|
||||
```bash
|
||||
cp .env.example .env
|
||||
```
|
||||
|
||||
4. Configure your `.env` file:
|
||||
```env
|
||||
DATABASE_URL=postgresql://user:password@localhost:5432/database
|
||||
DATABASE_TABLE=llm_proxy
|
||||
```
|
||||
|
||||
## Running the Dashboard
|
||||
|
||||
### Development Mode
|
||||
|
||||
```bash
|
||||
npm run dev
|
||||
```
|
||||
|
||||
The dashboard will be available at `http://localhost:3008`
|
||||
|
||||
### Production Mode
|
||||
|
||||
1. Build the application:
|
||||
```bash
|
||||
npm run build
|
||||
```
|
||||
|
||||
2. Start the production server:
|
||||
```bash
|
||||
npm start
|
||||
```
|
||||
|
||||
## Dashboard Sections
|
||||
|
||||
### 1. Overview Cards
|
||||
Displays key metrics at a glance:
|
||||
- Total requests processed
|
||||
- Total tokens consumed
|
||||
- Total cost incurred
|
||||
- Average response time
|
||||
- Number of unique models used
|
||||
- Number of unique client IPs
|
||||
|
||||
### 2. Hourly Trends
|
||||
Two charts showing:
|
||||
- Requests count and average response time over time
|
||||
- Token usage and costs over time
|
||||
|
||||
### 3. Model Breakdown
|
||||
Table showing per-model statistics:
|
||||
- Request count
|
||||
- Total tokens used
|
||||
- Total cost
|
||||
- Average response time
|
||||
|
||||
### 4. Recent Requests
|
||||
Detailed table of recent API calls showing:
|
||||
- Timestamp
|
||||
- Model used
|
||||
- Token breakdown (prompt + completion = total)
|
||||
- Cost
|
||||
- Response time
|
||||
- HTTP status code
|
||||
- Client IP address
|
||||
- Whether the request was streamed
|
||||
|
||||
## Configuration
|
||||
|
||||
### Port
|
||||
The dashboard runs on port 3008 by default. To change this, modify the `dev` and `start` scripts in `package.json`:
|
||||
|
||||
```json
|
||||
"dev": "next dev -p YOUR_PORT",
|
||||
"start": "next start -p YOUR_PORT"
|
||||
```
|
||||
|
||||
### Database Connection
|
||||
Ensure the `DATABASE_URL` in your `.env` file matches the PostgreSQL connection string used by the proxy server.
|
||||
|
||||
### Time Ranges
|
||||
Available time ranges:
|
||||
- Last Hour (1 hour)
|
||||
- Last 6 Hours
|
||||
- Last 24 Hours (default)
|
||||
- Last 7 Days (168 hours)
|
||||
|
||||
## Troubleshooting
|
||||
|
||||
### "Failed to fetch metrics" Error
|
||||
- Verify that the `DATABASE_URL` in `.env` is correct
|
||||
- Ensure PostgreSQL is running and accessible
|
||||
- Check that the `llm_proxy` table exists in your database
|
||||
- Verify network connectivity to the database
|
||||
|
||||
### Empty Dashboard
|
||||
- Ensure the proxy server is running and processing requests
|
||||
- Verify that requests are being logged to the database
|
||||
- Check that the `DATABASE_TABLE` name matches your configuration
|
||||
|
||||
### Port Conflicts
|
||||
If port 3008 is already in use, change the port in `package.json` scripts.
|
||||
|
||||
## Technology Stack
|
||||
|
||||
- **Framework**: Next.js 14 (React 18)
|
||||
- **Charts**: Recharts
|
||||
- **Database**: PostgreSQL (via `pg` driver)
|
||||
- **Language**: TypeScript
|
||||
- **Styling**: Inline CSS (no external dependencies)
|
||||
|
||||
## Architecture
|
||||
|
||||
```
|
||||
dashboard/
|
||||
├── app/
|
||||
│ ├── api/
|
||||
│ │ └── metrics/
|
||||
│ │ └── route.ts # API endpoint for fetching metrics
|
||||
│ ├── layout.tsx # Root layout
|
||||
│ └── page.tsx # Main dashboard page
|
||||
├── components/
|
||||
│ ├── MetricsOverview.tsx # Overview cards component
|
||||
│ ├── ModelBreakdown.tsx # Model statistics table
|
||||
│ ├── RecentRequests.tsx # Recent requests table
|
||||
│ └── TrendsChart.tsx # Hourly trends charts
|
||||
├── package.json
|
||||
├── tsconfig.json
|
||||
├── next.config.js
|
||||
└── README.md
|
||||
```
|
||||
|
||||
## API Endpoints
|
||||
|
||||
### GET `/api/metrics`
|
||||
|
||||
Query parameters:
|
||||
- `hours` (optional): Number of hours to look back (default: 24)
|
||||
- `limit` (optional): Maximum number of recent requests to return (default: 100)
|
||||
|
||||
Response:
|
||||
```json
|
||||
{
|
||||
"success": true,
|
||||
"data": {
|
||||
"summary": {
|
||||
"totalRequests": 1234,
|
||||
"totalTokens": 567890,
|
||||
"totalCost": 12.34,
|
||||
"avgResponseTime": 450.5,
|
||||
"uniqueModels": 3,
|
||||
"uniqueClients": 15
|
||||
},
|
||||
"recentRequests": [...],
|
||||
"modelBreakdown": [...],
|
||||
"hourlyTrends": [...]
|
||||
},
|
||||
"timeRange": "24 hours"
|
||||
}
|
||||
```
|
||||
|
||||
## License
|
||||
|
||||
Same as OpenProxy parent project.
|
||||
@@ -5,11 +5,7 @@ const pool = new Pool({
|
||||
connectionString: process.env.DATABASE_URL,
|
||||
});
|
||||
|
||||
const TABLE_NAME = process.env.DATABASE_TABLE || 'llm_proxy';
|
||||
|
||||
// Validate table name against whitelist to prevent SQL injection
|
||||
const ALLOWED_TABLES = ['llm_proxy', 'llm_proxy_dev', 'llm_proxy_test'];
|
||||
const validatedTableName = ALLOWED_TABLES.includes(TABLE_NAME) ? TABLE_NAME : 'llm_proxy';
|
||||
const TABLE_NAME = 'llm_proxy';
|
||||
|
||||
export async function GET(request: NextRequest) {
|
||||
const { searchParams } = new URL(request.url);
|
||||
@@ -35,7 +31,7 @@ export async function GET(request: NextRequest) {
|
||||
AVG(response_time) as avg_response_time,
|
||||
COUNT(DISTINCT model) as unique_models,
|
||||
COUNT(DISTINCT client_ip) as unique_clients
|
||||
FROM ${validatedTableName}
|
||||
FROM ${TABLE_NAME}
|
||||
WHERE timestamp >= NOW() - INTERVAL '1 hour' * $1
|
||||
`;
|
||||
const summaryResult = await client.query(summaryQuery, [hours]);
|
||||
@@ -55,7 +51,7 @@ export async function GET(request: NextRequest) {
|
||||
response_status,
|
||||
client_ip,
|
||||
stream
|
||||
FROM ${validatedTableName}
|
||||
FROM ${TABLE_NAME}
|
||||
WHERE timestamp >= NOW() - INTERVAL '1 hour' * $1
|
||||
ORDER BY timestamp DESC
|
||||
LIMIT $2
|
||||
@@ -71,7 +67,7 @@ export async function GET(request: NextRequest) {
|
||||
SUM(total_tokens) as total_tokens,
|
||||
SUM(total_cost) as total_cost,
|
||||
AVG(response_time) as avg_response_time
|
||||
FROM ${validatedTableName}
|
||||
FROM ${TABLE_NAME}
|
||||
WHERE timestamp >= NOW() - INTERVAL '1 hour' * $1
|
||||
GROUP BY model
|
||||
ORDER BY request_count DESC
|
||||
@@ -87,7 +83,7 @@ export async function GET(request: NextRequest) {
|
||||
SUM(total_tokens) as tokens,
|
||||
SUM(total_cost) as cost,
|
||||
AVG(response_time) as avg_response_time
|
||||
FROM ${validatedTableName}
|
||||
FROM ${TABLE_NAME}
|
||||
WHERE timestamp >= NOW() - INTERVAL '1 hour' * $1
|
||||
GROUP BY hour
|
||||
ORDER BY hour ASC
|
||||
|
||||
@@ -1,3 +1,7 @@
|
||||
const path = require('path');
|
||||
|
||||
require('dotenv').config({ path: path.resolve(__dirname, '../.env') });
|
||||
|
||||
/** @type {import('next').NextConfig} */
|
||||
const nextConfig = {
|
||||
reactStrictMode: true,
|
||||
|
||||
Generated
-1033
File diff suppressed because it is too large
Load Diff
@@ -10,6 +10,7 @@
|
||||
"lint": "next lint"
|
||||
},
|
||||
"dependencies": {
|
||||
"dotenv": "^17.2.3",
|
||||
"next": "^14.2.35",
|
||||
"react": "^18.3.0",
|
||||
"react-dom": "^18.3.0",
|
||||
|
||||
Reference in New Issue
Block a user