Compare commits
25 Commits
main
...
01-2025-06
Author | SHA1 | Date | |
---|---|---|---|
b5f2b53262 | |||
bcbac5c8b3 | |||
e5333d8410 | |||
77f31cd694 | |||
92fd390866 | |||
1b9ad03400 | |||
92b7c41f61 | |||
aec2d3b0aa | |||
30edf8d272 | |||
eb4f5752ee | |||
9170198c6c | |||
a4ef775731 | |||
d010ae9b74 | |||
17e0f2f03d | |||
b08574efe5 | |||
dc3e67e17b | |||
343bfbf1de | |||
fed54259ca | |||
aedface2a9 | |||
3804897e2b | |||
0c9186e57e | |||
829e8c3978 | |||
08791d2fed | |||
05ad940079 | |||
80e724cf86 |
71
.dockerignore
Normal file
71
.dockerignore
Normal file
@ -0,0 +1,71 @@
|
|||||||
|
# Git
|
||||||
|
.git
|
||||||
|
.gitignore
|
||||||
|
|
||||||
|
# Python
|
||||||
|
__pycache__
|
||||||
|
*.pyc
|
||||||
|
*.pyo
|
||||||
|
*.pyd
|
||||||
|
.Python
|
||||||
|
venv/
|
||||||
|
env/
|
||||||
|
.venv
|
||||||
|
pip-log.txt
|
||||||
|
pip-delete-this-directory.txt
|
||||||
|
.tox/
|
||||||
|
.coverage
|
||||||
|
.coverage.*
|
||||||
|
.cache
|
||||||
|
*.egg-info/
|
||||||
|
.pytest_cache/
|
||||||
|
|
||||||
|
# Node
|
||||||
|
node_modules/
|
||||||
|
npm-debug.log*
|
||||||
|
yarn-debug.log*
|
||||||
|
yarn-error.log*
|
||||||
|
|
||||||
|
# IDE
|
||||||
|
.vscode/
|
||||||
|
.idea/
|
||||||
|
*.swp
|
||||||
|
*.swo
|
||||||
|
*~
|
||||||
|
|
||||||
|
# OS
|
||||||
|
.DS_Store
|
||||||
|
.DS_Store?
|
||||||
|
._*
|
||||||
|
.Spotlight-V100
|
||||||
|
.Trashes
|
||||||
|
ehthumbs.db
|
||||||
|
Thumbs.db
|
||||||
|
|
||||||
|
# Project specific
|
||||||
|
logs/
|
||||||
|
*.log
|
||||||
|
.env
|
||||||
|
.env.*
|
||||||
|
!.env.production
|
||||||
|
*.db
|
||||||
|
*.sqlite
|
||||||
|
/tmp
|
||||||
|
/temp
|
||||||
|
test_*.py
|
||||||
|
tests/
|
||||||
|
|
||||||
|
# Documentation
|
||||||
|
*.md
|
||||||
|
!README.md
|
||||||
|
docs/
|
||||||
|
|
||||||
|
# CI/CD
|
||||||
|
.github/
|
||||||
|
.gitlab-ci.yml
|
||||||
|
.travis.yml
|
||||||
|
|
||||||
|
# Development files
|
||||||
|
deploy.sh
|
||||||
|
Makefile
|
||||||
|
docker-compose.override.yml
|
22
.env.example
Normal file
22
.env.example
Normal file
@ -0,0 +1,22 @@
|
|||||||
|
# Example environment configuration for Talk2Me
|
||||||
|
# Copy this file to .env and update with your actual values
|
||||||
|
|
||||||
|
# Flask Configuration
|
||||||
|
SECRET_KEY=your-secret-key-here-change-this
|
||||||
|
|
||||||
|
# Upload Configuration
|
||||||
|
UPLOAD_FOLDER=/path/to/secure/upload/folder
|
||||||
|
|
||||||
|
# TTS Server Configuration
|
||||||
|
TTS_SERVER_URL=http://localhost:5050/v1/audio/speech
|
||||||
|
TTS_API_KEY=your-tts-api-key-here
|
||||||
|
|
||||||
|
# CORS Configuration (for production)
|
||||||
|
CORS_ORIGINS=https://yourdomain.com,https://app.yourdomain.com
|
||||||
|
ADMIN_CORS_ORIGINS=https://admin.yourdomain.com
|
||||||
|
|
||||||
|
# Admin Token (for admin endpoints)
|
||||||
|
ADMIN_TOKEN=your-secure-admin-token-here
|
||||||
|
|
||||||
|
# Optional: GPU Configuration
|
||||||
|
# CUDA_VISIBLE_DEVICES=0
|
80
.gitignore
vendored
80
.gitignore
vendored
@ -1 +1,81 @@
|
|||||||
|
# Python
|
||||||
|
__pycache__/
|
||||||
|
*.py[cod]
|
||||||
|
*$py.class
|
||||||
|
*.so
|
||||||
|
.Python
|
||||||
venv/
|
venv/
|
||||||
|
env/
|
||||||
|
ENV/
|
||||||
|
.venv
|
||||||
|
.env
|
||||||
|
|
||||||
|
# Flask
|
||||||
|
instance/
|
||||||
|
.webassets-cache
|
||||||
|
|
||||||
|
# IDE
|
||||||
|
.vscode/
|
||||||
|
.idea/
|
||||||
|
*.swp
|
||||||
|
*.swo
|
||||||
|
*~
|
||||||
|
|
||||||
|
# OS
|
||||||
|
.DS_Store
|
||||||
|
.DS_Store?
|
||||||
|
._*
|
||||||
|
.Spotlight-V100
|
||||||
|
.Trashes
|
||||||
|
ehthumbs.db
|
||||||
|
Thumbs.db
|
||||||
|
|
||||||
|
# Node.js
|
||||||
|
node_modules/
|
||||||
|
npm-debug.log*
|
||||||
|
yarn-debug.log*
|
||||||
|
yarn-error.log*
|
||||||
|
|
||||||
|
# TypeScript
|
||||||
|
static/js/dist/
|
||||||
|
*.tsbuildinfo
|
||||||
|
|
||||||
|
# Temporary files
|
||||||
|
*.log
|
||||||
|
*.tmp
|
||||||
|
temp/
|
||||||
|
tmp/
|
||||||
|
|
||||||
|
# Audio files (for testing)
|
||||||
|
*.mp3
|
||||||
|
*.wav
|
||||||
|
*.ogg
|
||||||
|
|
||||||
|
# Local environment
|
||||||
|
.env.local
|
||||||
|
.env.*.local
|
||||||
|
.env.production
|
||||||
|
.env.development
|
||||||
|
.env.staging
|
||||||
|
|
||||||
|
# VAPID keys
|
||||||
|
vapid_private.pem
|
||||||
|
vapid_public.pem
|
||||||
|
|
||||||
|
# Secrets management
|
||||||
|
.secrets.json
|
||||||
|
.master_key
|
||||||
|
secrets.db
|
||||||
|
*.key
|
||||||
|
|
||||||
|
# Test files
|
||||||
|
test_*.py
|
||||||
|
*_test_output.*
|
||||||
|
test-*.html
|
||||||
|
*-debug-script.py
|
||||||
|
|
||||||
|
# Claude IDE
|
||||||
|
.claude/
|
||||||
|
|
||||||
|
# Standalone compiled JS (use dist/ instead)
|
||||||
|
static/js/app.js
|
||||||
|
46
Dockerfile
Normal file
46
Dockerfile
Normal file
@ -0,0 +1,46 @@
|
|||||||
|
# Production Dockerfile for Talk2Me
|
||||||
|
FROM python:3.10-slim
|
||||||
|
|
||||||
|
# Install system dependencies
|
||||||
|
RUN apt-get update && apt-get install -y \
|
||||||
|
build-essential \
|
||||||
|
curl \
|
||||||
|
ffmpeg \
|
||||||
|
git \
|
||||||
|
&& rm -rf /var/lib/apt/lists/*
|
||||||
|
|
||||||
|
# Create non-root user
|
||||||
|
RUN useradd -m -u 1000 talk2me
|
||||||
|
|
||||||
|
# Set working directory
|
||||||
|
WORKDIR /app
|
||||||
|
|
||||||
|
# Copy requirements first for better caching
|
||||||
|
COPY requirements.txt requirements-prod.txt ./
|
||||||
|
RUN pip install --no-cache-dir -r requirements-prod.txt
|
||||||
|
|
||||||
|
# Copy application code
|
||||||
|
COPY --chown=talk2me:talk2me . .
|
||||||
|
|
||||||
|
# Create necessary directories
|
||||||
|
RUN mkdir -p logs /tmp/talk2me_uploads && \
|
||||||
|
chown -R talk2me:talk2me logs /tmp/talk2me_uploads
|
||||||
|
|
||||||
|
# Switch to non-root user
|
||||||
|
USER talk2me
|
||||||
|
|
||||||
|
# Set environment variables
|
||||||
|
ENV FLASK_ENV=production \
|
||||||
|
PYTHONUNBUFFERED=1 \
|
||||||
|
UPLOAD_FOLDER=/tmp/talk2me_uploads \
|
||||||
|
LOGS_DIR=/app/logs
|
||||||
|
|
||||||
|
# Health check
|
||||||
|
HEALTHCHECK --interval=30s --timeout=10s --start-period=40s --retries=3 \
|
||||||
|
CMD curl -f http://localhost:5005/health || exit 1
|
||||||
|
|
||||||
|
# Expose port
|
||||||
|
EXPOSE 5005
|
||||||
|
|
||||||
|
# Run with gunicorn
|
||||||
|
CMD ["gunicorn", "--config", "gunicorn_config.py", "wsgi:application"]
|
819
README.md
819
README.md
@ -1,9 +1,30 @@
|
|||||||
# Voice Language Translator
|
# Talk2Me - Real-Time Voice Language Translator
|
||||||
|
|
||||||
A mobile-friendly web application that translates spoken language between multiple languages using:
|
A production-ready, mobile-friendly web application that provides real-time translation of spoken language between multiple languages.
|
||||||
- Gemma 3 open-source LLM via Ollama for translation
|
|
||||||
- OpenAI Whisper for speech-to-text
|
## Features
|
||||||
- OpenAI Edge TTS for text-to-speech
|
|
||||||
|
- **Real-time Speech Recognition**: Powered by OpenAI Whisper with GPU acceleration
|
||||||
|
- **Advanced Translation**: Using Gemma 3 open-source LLM via Ollama
|
||||||
|
- **Natural Text-to-Speech**: OpenAI Edge TTS for lifelike voice output
|
||||||
|
- **Progressive Web App**: Full offline support with service workers
|
||||||
|
- **Multi-Speaker Support**: Track and translate conversations with multiple participants
|
||||||
|
- **Enterprise Security**: Comprehensive rate limiting, session management, and encrypted secrets
|
||||||
|
- **Production Ready**: Docker support, load balancing, and extensive monitoring
|
||||||
|
|
||||||
|
## Table of Contents
|
||||||
|
|
||||||
|
- [Supported Languages](#supported-languages)
|
||||||
|
- [Quick Start](#quick-start)
|
||||||
|
- [Installation](#installation)
|
||||||
|
- [Configuration](#configuration)
|
||||||
|
- [Security Features](#security-features)
|
||||||
|
- [Production Deployment](#production-deployment)
|
||||||
|
- [API Documentation](#api-documentation)
|
||||||
|
- [Development](#development)
|
||||||
|
- [Monitoring & Operations](#monitoring--operations)
|
||||||
|
- [Troubleshooting](#troubleshooting)
|
||||||
|
- [Contributing](#contributing)
|
||||||
|
|
||||||
## Supported Languages
|
## Supported Languages
|
||||||
|
|
||||||
@ -22,48 +43,776 @@ A mobile-friendly web application that translates spoken language between multip
|
|||||||
- Turkish
|
- Turkish
|
||||||
- Uzbek
|
- Uzbek
|
||||||
|
|
||||||
## Setup Instructions
|
## Quick Start
|
||||||
|
|
||||||
1. Install the required Python packages:
|
```bash
|
||||||
```
|
# Clone the repository
|
||||||
|
git clone https://github.com/yourusername/talk2me.git
|
||||||
|
cd talk2me
|
||||||
|
|
||||||
|
# Install dependencies
|
||||||
pip install -r requirements.txt
|
pip install -r requirements.txt
|
||||||
```
|
npm install
|
||||||
|
|
||||||
2. Make sure you have Ollama installed and the Gemma 3 model loaded:
|
# Initialize secure configuration
|
||||||
```
|
python manage_secrets.py init
|
||||||
ollama pull gemma3
|
python manage_secrets.py set TTS_API_KEY your-api-key-here
|
||||||
```
|
|
||||||
|
|
||||||
3. Ensure your OpenAI Edge TTS server is running on port 5050.
|
# Ensure Ollama is running with Gemma
|
||||||
|
ollama pull gemma2:9b
|
||||||
|
ollama pull gemma3:27b
|
||||||
|
|
||||||
4. Run the application:
|
# Start the application
|
||||||
```
|
|
||||||
python app.py
|
python app.py
|
||||||
```
|
```
|
||||||
|
|
||||||
5. Open your browser and navigate to:
|
Open your browser and navigate to `http://localhost:5005`
|
||||||
```
|
|
||||||
http://localhost:8000
|
## Installation
|
||||||
|
|
||||||
|
### Prerequisites
|
||||||
|
|
||||||
|
- Python 3.8+
|
||||||
|
- Node.js 14+
|
||||||
|
- Ollama (for LLM translation)
|
||||||
|
- OpenAI Edge TTS server
|
||||||
|
- Optional: NVIDIA GPU with CUDA, AMD GPU with ROCm, or Apple Silicon
|
||||||
|
|
||||||
|
### Detailed Setup
|
||||||
|
|
||||||
|
1. **Install Python dependencies**:
|
||||||
|
```bash
|
||||||
|
python -m venv venv
|
||||||
|
source venv/bin/activate # On Windows: venv\Scripts\activate
|
||||||
|
pip install -r requirements.txt
|
||||||
```
|
```
|
||||||
|
|
||||||
## Usage
|
2. **Install Node.js dependencies**:
|
||||||
|
```bash
|
||||||
|
npm install
|
||||||
|
npm run build # Build TypeScript files
|
||||||
|
```
|
||||||
|
|
||||||
1. Select your source language from the dropdown menu
|
3. **Configure GPU Support** (Optional):
|
||||||
2. Press the microphone button and speak
|
```bash
|
||||||
3. Press the button again to stop recording
|
# For NVIDIA GPUs
|
||||||
4. Wait for the transcription to complete
|
pip install torch torchvision torchaudio --index-url https://download.pytorch.org/whl/cu118
|
||||||
5. Select your target language
|
|
||||||
6. Press the "Translate" button
|
|
||||||
7. Use the play buttons to hear the original or translated text
|
|
||||||
|
|
||||||
## Technical Details
|
# For AMD GPUs (ROCm)
|
||||||
|
pip install torch torchvision torchaudio --index-url https://download.pytorch.org/whl/rocm5.4.2
|
||||||
|
|
||||||
- The app uses Flask for the web server
|
# For Apple Silicon
|
||||||
- Audio is processed client-side using the MediaRecorder API
|
pip install torch torchvision torchaudio
|
||||||
- Whisper for speech recognition with language hints
|
```
|
||||||
- Ollama provides access to the Gemma 3 model for translation
|
|
||||||
- OpenAI Edge TTS delivers natural-sounding speech output
|
|
||||||
|
|
||||||
## Mobile Support
|
4. **Set up Ollama**:
|
||||||
|
```bash
|
||||||
|
# Install Ollama (https://ollama.ai)
|
||||||
|
curl -fsSL https://ollama.ai/install.sh | sh
|
||||||
|
|
||||||
The interface is fully responsive and designed to work well on mobile devices.
|
# Pull required models
|
||||||
|
ollama pull gemma2:9b # Faster, for streaming
|
||||||
|
ollama pull gemma3:27b # Better quality
|
||||||
|
```
|
||||||
|
|
||||||
|
5. **Configure TTS Server**:
|
||||||
|
Ensure your OpenAI Edge TTS server is running. Default expected at `http://localhost:5050`
|
||||||
|
|
||||||
|
## Configuration
|
||||||
|
|
||||||
|
### Environment Variables
|
||||||
|
|
||||||
|
Talk2Me uses encrypted secrets management for sensitive configuration. You can use either the secure secrets system or traditional environment variables.
|
||||||
|
|
||||||
|
#### Using Secure Secrets Management (Recommended)
|
||||||
|
|
||||||
|
```bash
|
||||||
|
# Initialize the secrets system
|
||||||
|
python manage_secrets.py init
|
||||||
|
|
||||||
|
# Set required secrets
|
||||||
|
python manage_secrets.py set TTS_API_KEY
|
||||||
|
python manage_secrets.py set TTS_SERVER_URL
|
||||||
|
python manage_secrets.py set ADMIN_TOKEN
|
||||||
|
|
||||||
|
# List all secrets
|
||||||
|
python manage_secrets.py list
|
||||||
|
|
||||||
|
# Rotate encryption keys
|
||||||
|
python manage_secrets.py rotate
|
||||||
|
```
|
||||||
|
|
||||||
|
#### Using Environment Variables
|
||||||
|
|
||||||
|
Create a `.env` file:
|
||||||
|
|
||||||
|
```env
|
||||||
|
# Core Configuration
|
||||||
|
TTS_API_KEY=your-api-key-here
|
||||||
|
TTS_SERVER_URL=http://localhost:5050/v1/audio/speech
|
||||||
|
ADMIN_TOKEN=your-secure-admin-token
|
||||||
|
|
||||||
|
# CORS Configuration
|
||||||
|
CORS_ORIGINS=https://yourdomain.com,https://app.yourdomain.com
|
||||||
|
ADMIN_CORS_ORIGINS=https://admin.yourdomain.com
|
||||||
|
|
||||||
|
# Security Settings
|
||||||
|
SECRET_KEY=your-secret-key-here
|
||||||
|
MAX_CONTENT_LENGTH=52428800 # 50MB
|
||||||
|
SESSION_LIFETIME=3600 # 1 hour
|
||||||
|
RATE_LIMIT_STORAGE_URL=redis://localhost:6379/0
|
||||||
|
|
||||||
|
# Performance Tuning
|
||||||
|
WHISPER_MODEL_SIZE=base
|
||||||
|
GPU_MEMORY_THRESHOLD_MB=2048
|
||||||
|
MEMORY_CLEANUP_INTERVAL=30
|
||||||
|
```
|
||||||
|
|
||||||
|
### Advanced Configuration
|
||||||
|
|
||||||
|
#### CORS Settings
|
||||||
|
|
||||||
|
```bash
|
||||||
|
# Development (allow all origins)
|
||||||
|
export CORS_ORIGINS="*"
|
||||||
|
|
||||||
|
# Production (restrict to specific domains)
|
||||||
|
export CORS_ORIGINS="https://yourdomain.com,https://app.yourdomain.com"
|
||||||
|
export ADMIN_CORS_ORIGINS="https://admin.yourdomain.com"
|
||||||
|
```
|
||||||
|
|
||||||
|
#### Rate Limiting
|
||||||
|
|
||||||
|
Configure per-endpoint rate limits:
|
||||||
|
|
||||||
|
```python
|
||||||
|
# In your config or via admin API
|
||||||
|
RATE_LIMITS = {
|
||||||
|
'default': {'requests_per_minute': 30, 'requests_per_hour': 500},
|
||||||
|
'transcribe': {'requests_per_minute': 10, 'requests_per_hour': 100},
|
||||||
|
'translate': {'requests_per_minute': 20, 'requests_per_hour': 300}
|
||||||
|
}
|
||||||
|
```
|
||||||
|
|
||||||
|
#### Session Management
|
||||||
|
|
||||||
|
```python
|
||||||
|
SESSION_CONFIG = {
|
||||||
|
'max_file_size_mb': 100,
|
||||||
|
'max_files_per_session': 100,
|
||||||
|
'idle_timeout_minutes': 15,
|
||||||
|
'max_lifetime_minutes': 60
|
||||||
|
}
|
||||||
|
```
|
||||||
|
|
||||||
|
## Security Features
|
||||||
|
|
||||||
|
### 1. Rate Limiting
|
||||||
|
|
||||||
|
Comprehensive DoS protection with:
|
||||||
|
- Token bucket algorithm with sliding window
|
||||||
|
- Per-endpoint configurable limits
|
||||||
|
- Automatic IP blocking for abusive clients
|
||||||
|
- Request size validation
|
||||||
|
|
||||||
|
```bash
|
||||||
|
# Check rate limit status
|
||||||
|
curl -H "X-Admin-Token: $ADMIN_TOKEN" http://localhost:5005/admin/rate-limits
|
||||||
|
|
||||||
|
# Block an IP
|
||||||
|
curl -X POST -H "X-Admin-Token: $ADMIN_TOKEN" \
|
||||||
|
-H "Content-Type: application/json" \
|
||||||
|
-d '{"ip": "192.168.1.100", "duration": 3600}' \
|
||||||
|
http://localhost:5005/admin/block-ip
|
||||||
|
```
|
||||||
|
|
||||||
|
### 2. Secrets Management
|
||||||
|
|
||||||
|
- AES-128 encryption for sensitive data
|
||||||
|
- Automatic key rotation
|
||||||
|
- Audit logging
|
||||||
|
- Platform-specific secure storage
|
||||||
|
|
||||||
|
```bash
|
||||||
|
# View audit log
|
||||||
|
python manage_secrets.py audit
|
||||||
|
|
||||||
|
# Backup secrets
|
||||||
|
python manage_secrets.py export --output backup.enc
|
||||||
|
|
||||||
|
# Restore from backup
|
||||||
|
python manage_secrets.py import --input backup.enc
|
||||||
|
```
|
||||||
|
|
||||||
|
### 3. Session Management
|
||||||
|
|
||||||
|
- Automatic resource tracking
|
||||||
|
- Per-session limits (100 files, 100MB)
|
||||||
|
- Idle session cleanup (15 minutes)
|
||||||
|
- Real-time monitoring
|
||||||
|
|
||||||
|
```bash
|
||||||
|
# View active sessions
|
||||||
|
curl -H "X-Admin-Token: $ADMIN_TOKEN" http://localhost:5005/admin/sessions
|
||||||
|
|
||||||
|
# Clean up specific session
|
||||||
|
curl -X POST -H "X-Admin-Token: $ADMIN_TOKEN" \
|
||||||
|
http://localhost:5005/admin/sessions/SESSION_ID/cleanup
|
||||||
|
```
|
||||||
|
|
||||||
|
### 4. Request Size Limits
|
||||||
|
|
||||||
|
- Global limit: 50MB
|
||||||
|
- Audio files: 25MB
|
||||||
|
- JSON payloads: 1MB
|
||||||
|
- Dynamic configuration
|
||||||
|
|
||||||
|
```bash
|
||||||
|
# Update size limits
|
||||||
|
curl -X POST -H "X-Admin-Token: $ADMIN_TOKEN" \
|
||||||
|
-H "Content-Type: application/json" \
|
||||||
|
-d '{"max_audio_size": "30MB"}' \
|
||||||
|
http://localhost:5005/admin/size-limits
|
||||||
|
```
|
||||||
|
|
||||||
|
## Production Deployment
|
||||||
|
|
||||||
|
### Docker Deployment
|
||||||
|
|
||||||
|
```bash
|
||||||
|
# Build and run with Docker Compose (CPU only)
|
||||||
|
docker-compose up -d
|
||||||
|
|
||||||
|
# With NVIDIA GPU support
|
||||||
|
docker-compose -f docker-compose.yml -f docker-compose.nvidia.yml up -d
|
||||||
|
|
||||||
|
# With AMD GPU support (ROCm)
|
||||||
|
docker-compose -f docker-compose.yml -f docker-compose.amd.yml up -d
|
||||||
|
|
||||||
|
# With Apple Silicon support
|
||||||
|
docker-compose -f docker-compose.yml -f docker-compose.apple.yml up -d
|
||||||
|
|
||||||
|
# Scale web workers
|
||||||
|
docker-compose up -d --scale talk2me=4
|
||||||
|
|
||||||
|
# View logs
|
||||||
|
docker-compose logs -f talk2me
|
||||||
|
```
|
||||||
|
|
||||||
|
### Docker Compose Configuration
|
||||||
|
|
||||||
|
Choose the appropriate configuration based on your GPU:
|
||||||
|
|
||||||
|
#### NVIDIA GPU Configuration
|
||||||
|
|
||||||
|
```yaml
|
||||||
|
version: '3.8'
|
||||||
|
services:
|
||||||
|
web:
|
||||||
|
build: .
|
||||||
|
ports:
|
||||||
|
- "5005:5005"
|
||||||
|
environment:
|
||||||
|
- GUNICORN_WORKERS=4
|
||||||
|
- GUNICORN_THREADS=2
|
||||||
|
volumes:
|
||||||
|
- ./logs:/app/logs
|
||||||
|
- whisper-cache:/root/.cache/whisper
|
||||||
|
deploy:
|
||||||
|
resources:
|
||||||
|
limits:
|
||||||
|
memory: 4G
|
||||||
|
reservations:
|
||||||
|
devices:
|
||||||
|
- driver: nvidia
|
||||||
|
count: 1
|
||||||
|
capabilities: [gpu]
|
||||||
|
```
|
||||||
|
|
||||||
|
#### AMD GPU Configuration (ROCm)
|
||||||
|
|
||||||
|
```yaml
|
||||||
|
version: '3.8'
|
||||||
|
services:
|
||||||
|
web:
|
||||||
|
build: .
|
||||||
|
ports:
|
||||||
|
- "5005:5005"
|
||||||
|
environment:
|
||||||
|
- GUNICORN_WORKERS=4
|
||||||
|
- GUNICORN_THREADS=2
|
||||||
|
- HSA_OVERRIDE_GFX_VERSION=10.3.0 # Adjust for your GPU
|
||||||
|
volumes:
|
||||||
|
- ./logs:/app/logs
|
||||||
|
- whisper-cache:/root/.cache/whisper
|
||||||
|
- /dev/kfd:/dev/kfd # ROCm KFD interface
|
||||||
|
- /dev/dri:/dev/dri # Direct Rendering Interface
|
||||||
|
devices:
|
||||||
|
- /dev/kfd
|
||||||
|
- /dev/dri
|
||||||
|
group_add:
|
||||||
|
- video
|
||||||
|
- render
|
||||||
|
deploy:
|
||||||
|
resources:
|
||||||
|
limits:
|
||||||
|
memory: 4G
|
||||||
|
```
|
||||||
|
|
||||||
|
#### Apple Silicon Configuration
|
||||||
|
|
||||||
|
```yaml
|
||||||
|
version: '3.8'
|
||||||
|
services:
|
||||||
|
web:
|
||||||
|
build: .
|
||||||
|
platform: linux/arm64/v8 # For M1/M2 Macs
|
||||||
|
ports:
|
||||||
|
- "5005:5005"
|
||||||
|
environment:
|
||||||
|
- GUNICORN_WORKERS=4
|
||||||
|
- GUNICORN_THREADS=2
|
||||||
|
- PYTORCH_ENABLE_MPS_FALLBACK=1 # Enable MPS fallback
|
||||||
|
volumes:
|
||||||
|
- ./logs:/app/logs
|
||||||
|
- whisper-cache:/root/.cache/whisper
|
||||||
|
deploy:
|
||||||
|
resources:
|
||||||
|
limits:
|
||||||
|
memory: 4G
|
||||||
|
```
|
||||||
|
|
||||||
|
#### CPU-Only Configuration
|
||||||
|
|
||||||
|
```yaml
|
||||||
|
version: '3.8'
|
||||||
|
services:
|
||||||
|
web:
|
||||||
|
build: .
|
||||||
|
ports:
|
||||||
|
- "5005:5005"
|
||||||
|
environment:
|
||||||
|
- GUNICORN_WORKERS=4
|
||||||
|
- GUNICORN_THREADS=2
|
||||||
|
- OMP_NUM_THREADS=4 # OpenMP threads for CPU
|
||||||
|
volumes:
|
||||||
|
- ./logs:/app/logs
|
||||||
|
- whisper-cache:/root/.cache/whisper
|
||||||
|
deploy:
|
||||||
|
resources:
|
||||||
|
limits:
|
||||||
|
memory: 4G
|
||||||
|
cpus: '4.0'
|
||||||
|
```
|
||||||
|
|
||||||
|
### Nginx Configuration
|
||||||
|
|
||||||
|
```nginx
|
||||||
|
upstream talk2me {
|
||||||
|
least_conn;
|
||||||
|
server web1:5005 weight=1 max_fails=3 fail_timeout=30s;
|
||||||
|
server web2:5005 weight=1 max_fails=3 fail_timeout=30s;
|
||||||
|
}
|
||||||
|
|
||||||
|
server {
|
||||||
|
listen 443 ssl http2;
|
||||||
|
server_name talk2me.yourdomain.com;
|
||||||
|
|
||||||
|
ssl_certificate /etc/ssl/certs/talk2me.crt;
|
||||||
|
ssl_certificate_key /etc/ssl/private/talk2me.key;
|
||||||
|
|
||||||
|
client_max_body_size 50M;
|
||||||
|
|
||||||
|
location / {
|
||||||
|
proxy_pass http://talk2me;
|
||||||
|
proxy_set_header X-Real-IP $remote_addr;
|
||||||
|
proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
|
||||||
|
proxy_set_header Host $host;
|
||||||
|
|
||||||
|
# WebSocket support
|
||||||
|
proxy_http_version 1.1;
|
||||||
|
proxy_set_header Upgrade $http_upgrade;
|
||||||
|
proxy_set_header Connection "upgrade";
|
||||||
|
}
|
||||||
|
|
||||||
|
# Cache static assets
|
||||||
|
location /static/ {
|
||||||
|
alias /app/static/;
|
||||||
|
expires 30d;
|
||||||
|
add_header Cache-Control "public, immutable";
|
||||||
|
}
|
||||||
|
}
|
||||||
|
```
|
||||||
|
|
||||||
|
### Systemd Service
|
||||||
|
|
||||||
|
```ini
|
||||||
|
[Unit]
|
||||||
|
Description=Talk2Me Translation Service
|
||||||
|
After=network.target
|
||||||
|
|
||||||
|
[Service]
|
||||||
|
Type=notify
|
||||||
|
User=talk2me
|
||||||
|
Group=talk2me
|
||||||
|
WorkingDirectory=/opt/talk2me
|
||||||
|
Environment="PATH=/opt/talk2me/venv/bin"
|
||||||
|
ExecStart=/opt/talk2me/venv/bin/gunicorn \
|
||||||
|
--config gunicorn_config.py \
|
||||||
|
--bind 0.0.0.0:5005 \
|
||||||
|
app:app
|
||||||
|
Restart=always
|
||||||
|
RestartSec=10
|
||||||
|
|
||||||
|
[Install]
|
||||||
|
WantedBy=multi-user.target
|
||||||
|
```
|
||||||
|
|
||||||
|
## API Documentation
|
||||||
|
|
||||||
|
### Core Endpoints
|
||||||
|
|
||||||
|
#### Transcribe Audio
|
||||||
|
```http
|
||||||
|
POST /transcribe
|
||||||
|
Content-Type: multipart/form-data
|
||||||
|
|
||||||
|
audio: (binary)
|
||||||
|
source_lang: auto|language_code
|
||||||
|
```
|
||||||
|
|
||||||
|
#### Translate Text
|
||||||
|
```http
|
||||||
|
POST /translate
|
||||||
|
Content-Type: application/json
|
||||||
|
|
||||||
|
{
|
||||||
|
"text": "Hello world",
|
||||||
|
"source_lang": "English",
|
||||||
|
"target_lang": "Spanish"
|
||||||
|
}
|
||||||
|
```
|
||||||
|
|
||||||
|
#### Streaming Translation
|
||||||
|
```http
|
||||||
|
POST /translate/stream
|
||||||
|
Content-Type: application/json
|
||||||
|
|
||||||
|
{
|
||||||
|
"text": "Long text to translate",
|
||||||
|
"source_lang": "auto",
|
||||||
|
"target_lang": "French"
|
||||||
|
}
|
||||||
|
|
||||||
|
Response: Server-Sent Events stream
|
||||||
|
```
|
||||||
|
|
||||||
|
#### Text-to-Speech
|
||||||
|
```http
|
||||||
|
POST /speak
|
||||||
|
Content-Type: application/json
|
||||||
|
|
||||||
|
{
|
||||||
|
"text": "Hola mundo",
|
||||||
|
"language": "Spanish"
|
||||||
|
}
|
||||||
|
```
|
||||||
|
|
||||||
|
### Admin Endpoints
|
||||||
|
|
||||||
|
All admin endpoints require `X-Admin-Token` header.
|
||||||
|
|
||||||
|
#### Health & Monitoring
|
||||||
|
- `GET /health` - Basic health check
|
||||||
|
- `GET /health/detailed` - Component status
|
||||||
|
- `GET /metrics` - Prometheus metrics
|
||||||
|
- `GET /admin/memory` - Memory usage stats
|
||||||
|
|
||||||
|
#### Session Management
|
||||||
|
- `GET /admin/sessions` - List active sessions
|
||||||
|
- `GET /admin/sessions/:id` - Session details
|
||||||
|
- `POST /admin/sessions/:id/cleanup` - Manual cleanup
|
||||||
|
|
||||||
|
#### Security Controls
|
||||||
|
- `GET /admin/rate-limits` - View rate limits
|
||||||
|
- `POST /admin/block-ip` - Block IP address
|
||||||
|
- `GET /admin/logs/security` - Security events
|
||||||
|
|
||||||
|
## Development
|
||||||
|
|
||||||
|
### TypeScript Development
|
||||||
|
|
||||||
|
```bash
|
||||||
|
# Install dependencies
|
||||||
|
npm install
|
||||||
|
|
||||||
|
# Development mode with auto-compilation
|
||||||
|
npm run dev
|
||||||
|
|
||||||
|
# Build for production
|
||||||
|
npm run build
|
||||||
|
|
||||||
|
# Type checking
|
||||||
|
npm run typecheck
|
||||||
|
```
|
||||||
|
|
||||||
|
### Project Structure
|
||||||
|
|
||||||
|
```
|
||||||
|
talk2me/
|
||||||
|
├── app.py # Main Flask application
|
||||||
|
├── config.py # Configuration management
|
||||||
|
├── requirements.txt # Python dependencies
|
||||||
|
├── package.json # Node.js dependencies
|
||||||
|
├── tsconfig.json # TypeScript configuration
|
||||||
|
├── gunicorn_config.py # Production server config
|
||||||
|
├── docker-compose.yml # Container orchestration
|
||||||
|
├── static/
|
||||||
|
│ ├── js/
|
||||||
|
│ │ ├── src/ # TypeScript source files
|
||||||
|
│ │ └── dist/ # Compiled JavaScript
|
||||||
|
│ ├── css/ # Stylesheets
|
||||||
|
│ └── icons/ # PWA icons
|
||||||
|
├── templates/ # HTML templates
|
||||||
|
├── logs/ # Application logs
|
||||||
|
└── tests/ # Test suite
|
||||||
|
```
|
||||||
|
|
||||||
|
### Key Components
|
||||||
|
|
||||||
|
1. **Connection Management** (`connectionManager.ts`)
|
||||||
|
- Automatic retry with exponential backoff
|
||||||
|
- Request queuing during offline periods
|
||||||
|
- Connection status monitoring
|
||||||
|
|
||||||
|
2. **Translation Cache** (`translationCache.ts`)
|
||||||
|
- IndexedDB for offline support
|
||||||
|
- LRU eviction policy
|
||||||
|
- Automatic cache size management
|
||||||
|
|
||||||
|
3. **Speaker Management** (`speakerManager.ts`)
|
||||||
|
- Multi-speaker conversation tracking
|
||||||
|
- Speaker-specific audio handling
|
||||||
|
- Conversation export functionality
|
||||||
|
|
||||||
|
4. **Error Handling** (`errorBoundary.ts`)
|
||||||
|
- Global error catching
|
||||||
|
- Automatic error reporting
|
||||||
|
- User-friendly error messages
|
||||||
|
|
||||||
|
### Running Tests
|
||||||
|
|
||||||
|
```bash
|
||||||
|
# Python tests
|
||||||
|
pytest tests/ -v
|
||||||
|
|
||||||
|
# TypeScript tests
|
||||||
|
npm test
|
||||||
|
|
||||||
|
# Integration tests
|
||||||
|
python test_integration.py
|
||||||
|
```
|
||||||
|
|
||||||
|
## Monitoring & Operations
|
||||||
|
|
||||||
|
### Logging System
|
||||||
|
|
||||||
|
Talk2Me uses structured JSON logging with multiple streams:
|
||||||
|
|
||||||
|
```bash
|
||||||
|
logs/
|
||||||
|
├── talk2me.log # General application log
|
||||||
|
├── errors.log # Error-specific log
|
||||||
|
├── access.log # HTTP access log
|
||||||
|
├── security.log # Security events
|
||||||
|
└── performance.log # Performance metrics
|
||||||
|
```
|
||||||
|
|
||||||
|
View logs:
|
||||||
|
```bash
|
||||||
|
# Recent errors
|
||||||
|
tail -f logs/errors.log | jq '.'
|
||||||
|
|
||||||
|
# Security events
|
||||||
|
grep "rate_limit_exceeded" logs/security.log | jq '.'
|
||||||
|
|
||||||
|
# Slow requests
|
||||||
|
jq 'select(.extra_fields.duration_ms > 1000)' logs/performance.log
|
||||||
|
```
|
||||||
|
|
||||||
|
### Memory Management
|
||||||
|
|
||||||
|
Talk2Me includes comprehensive memory leak prevention:
|
||||||
|
|
||||||
|
1. **Backend Memory Management**
|
||||||
|
- GPU memory monitoring
|
||||||
|
- Automatic model reloading
|
||||||
|
- Temporary file cleanup
|
||||||
|
|
||||||
|
2. **Frontend Memory Management**
|
||||||
|
- Audio blob cleanup
|
||||||
|
- WebRTC resource management
|
||||||
|
- Event listener cleanup
|
||||||
|
|
||||||
|
Monitor memory:
|
||||||
|
```bash
|
||||||
|
# Check memory stats
|
||||||
|
curl -H "X-Admin-Token: $ADMIN_TOKEN" http://localhost:5005/admin/memory
|
||||||
|
|
||||||
|
# Trigger manual cleanup
|
||||||
|
curl -X POST -H "X-Admin-Token: $ADMIN_TOKEN" \
|
||||||
|
http://localhost:5005/admin/memory/cleanup
|
||||||
|
```
|
||||||
|
|
||||||
|
### Performance Tuning
|
||||||
|
|
||||||
|
#### GPU Optimization
|
||||||
|
|
||||||
|
```python
|
||||||
|
# config.py or environment
|
||||||
|
GPU_OPTIMIZATIONS = {
|
||||||
|
'enabled': True,
|
||||||
|
'fp16': True, # Half precision for 2x speedup
|
||||||
|
'batch_size': 1, # Adjust based on GPU memory
|
||||||
|
'num_workers': 2, # Parallel data loading
|
||||||
|
'pin_memory': True # Faster GPU transfer
|
||||||
|
}
|
||||||
|
```
|
||||||
|
|
||||||
|
#### Whisper Optimization
|
||||||
|
|
||||||
|
```python
|
||||||
|
TRANSCRIBE_OPTIONS = {
|
||||||
|
'beam_size': 1, # Faster inference
|
||||||
|
'best_of': 1, # Disable multiple attempts
|
||||||
|
'temperature': 0, # Deterministic output
|
||||||
|
'compression_ratio_threshold': 2.4,
|
||||||
|
'logprob_threshold': -1.0,
|
||||||
|
'no_speech_threshold': 0.6
|
||||||
|
}
|
||||||
|
```
|
||||||
|
|
||||||
|
### Scaling Considerations
|
||||||
|
|
||||||
|
1. **Horizontal Scaling**
|
||||||
|
- Use Redis for shared rate limiting
|
||||||
|
- Configure sticky sessions for WebSocket
|
||||||
|
- Share audio files via object storage
|
||||||
|
|
||||||
|
2. **Vertical Scaling**
|
||||||
|
- Increase worker processes
|
||||||
|
- Tune thread pool size
|
||||||
|
- Allocate more GPU memory
|
||||||
|
|
||||||
|
3. **Caching Strategy**
|
||||||
|
- Cache translations in Redis
|
||||||
|
- Use CDN for static assets
|
||||||
|
- Enable HTTP caching headers
|
||||||
|
|
||||||
|
## Troubleshooting
|
||||||
|
|
||||||
|
### Common Issues
|
||||||
|
|
||||||
|
#### GPU Not Detected
|
||||||
|
|
||||||
|
```bash
|
||||||
|
# Check CUDA availability
|
||||||
|
python -c "import torch; print(torch.cuda.is_available())"
|
||||||
|
|
||||||
|
# Check GPU memory
|
||||||
|
nvidia-smi
|
||||||
|
|
||||||
|
# For AMD GPUs
|
||||||
|
rocm-smi
|
||||||
|
|
||||||
|
# For Apple Silicon
|
||||||
|
python -c "import torch; print(torch.backends.mps.is_available())"
|
||||||
|
```
|
||||||
|
|
||||||
|
#### High Memory Usage
|
||||||
|
|
||||||
|
```bash
|
||||||
|
# Check for memory leaks
|
||||||
|
curl -H "X-Admin-Token: $ADMIN_TOKEN" http://localhost:5005/health/storage
|
||||||
|
|
||||||
|
# Manual cleanup
|
||||||
|
curl -X POST -H "X-Admin-Token: $ADMIN_TOKEN" \
|
||||||
|
http://localhost:5005/admin/cleanup
|
||||||
|
```
|
||||||
|
|
||||||
|
#### CORS Issues
|
||||||
|
|
||||||
|
```bash
|
||||||
|
# Test CORS configuration
|
||||||
|
curl -X OPTIONS http://localhost:5005/api/transcribe \
|
||||||
|
-H "Origin: https://yourdomain.com" \
|
||||||
|
-H "Access-Control-Request-Method: POST"
|
||||||
|
```
|
||||||
|
|
||||||
|
#### TTS Server Connection
|
||||||
|
|
||||||
|
```bash
|
||||||
|
# Check TTS server status
|
||||||
|
curl http://localhost:5005/check_tts_server
|
||||||
|
|
||||||
|
# Update TTS configuration
|
||||||
|
curl -X POST http://localhost:5005/update_tts_config \
|
||||||
|
-H "Content-Type: application/json" \
|
||||||
|
-d '{"server_url": "http://localhost:5050/v1/audio/speech", "api_key": "new-key"}'
|
||||||
|
```
|
||||||
|
|
||||||
|
### Debug Mode
|
||||||
|
|
||||||
|
Enable debug logging:
|
||||||
|
```bash
|
||||||
|
export FLASK_ENV=development
|
||||||
|
export LOG_LEVEL=DEBUG
|
||||||
|
python app.py
|
||||||
|
```
|
||||||
|
|
||||||
|
### Performance Profiling
|
||||||
|
|
||||||
|
```bash
|
||||||
|
# Enable performance logging
|
||||||
|
export ENABLE_PROFILING=true
|
||||||
|
|
||||||
|
# View slow requests
|
||||||
|
jq 'select(.duration_ms > 1000)' logs/performance.log
|
||||||
|
```
|
||||||
|
|
||||||
|
## Contributing
|
||||||
|
|
||||||
|
We welcome contributions! Please see our [Contributing Guidelines](CONTRIBUTING.md) for details.
|
||||||
|
|
||||||
|
### Development Setup
|
||||||
|
|
||||||
|
1. Fork the repository
|
||||||
|
2. Create a feature branch (`git checkout -b feature/amazing-feature`)
|
||||||
|
3. Make your changes
|
||||||
|
4. Run tests (`pytest && npm test`)
|
||||||
|
5. Commit your changes (`git commit -m 'Add amazing feature'`)
|
||||||
|
6. Push to the branch (`git push origin feature/amazing-feature`)
|
||||||
|
7. Open a Pull Request
|
||||||
|
|
||||||
|
### Code Style
|
||||||
|
|
||||||
|
- Python: Follow PEP 8
|
||||||
|
- TypeScript: Use ESLint configuration
|
||||||
|
- Commit messages: Use conventional commits
|
||||||
|
|
||||||
|
## License
|
||||||
|
|
||||||
|
This project is licensed under the MIT License - see the [LICENSE](LICENSE) file for details.
|
||||||
|
|
||||||
|
## Acknowledgments
|
||||||
|
|
||||||
|
- OpenAI Whisper team for the amazing speech recognition model
|
||||||
|
- Ollama team for making LLMs accessible
|
||||||
|
- All contributors who have helped improve Talk2Me
|
||||||
|
|
||||||
|
## Support
|
||||||
|
|
||||||
|
- **Documentation**: Full docs at [docs.talk2me.app](https://docs.talk2me.app)
|
||||||
|
- **Issues**: [GitHub Issues](https://github.com/yourusername/talk2me/issues)
|
||||||
|
- **Discussions**: [GitHub Discussions](https://github.com/yourusername/talk2me/discussions)
|
||||||
|
- **Security**: Please report security vulnerabilities to security@talk2me.app
|
203
config.py
Normal file
203
config.py
Normal file
@ -0,0 +1,203 @@
|
|||||||
|
# Configuration management with secrets integration
|
||||||
|
import os
|
||||||
|
import logging
|
||||||
|
from datetime import timedelta
|
||||||
|
from secrets_manager import get_secret, get_secrets_manager
|
||||||
|
|
||||||
|
logger = logging.getLogger(__name__)
|
||||||
|
|
||||||
|
class Config:
|
||||||
|
"""Base configuration with secrets management"""
|
||||||
|
|
||||||
|
def __init__(self):
|
||||||
|
self.secrets_manager = get_secrets_manager()
|
||||||
|
self._load_config()
|
||||||
|
|
||||||
|
def _load_config(self):
|
||||||
|
"""Load configuration from environment and secrets"""
|
||||||
|
# Flask configuration
|
||||||
|
self.SECRET_KEY = self._get_secret('FLASK_SECRET_KEY',
|
||||||
|
os.environ.get('SECRET_KEY', 'dev-key-change-this'))
|
||||||
|
|
||||||
|
# Security
|
||||||
|
self.SESSION_COOKIE_SECURE = self._get_bool('SESSION_COOKIE_SECURE', True)
|
||||||
|
self.SESSION_COOKIE_HTTPONLY = True
|
||||||
|
self.SESSION_COOKIE_SAMESITE = 'Lax'
|
||||||
|
self.PERMANENT_SESSION_LIFETIME = timedelta(hours=24)
|
||||||
|
|
||||||
|
# TTS Configuration
|
||||||
|
self.TTS_SERVER_URL = os.environ.get('TTS_SERVER_URL', 'http://localhost:5050/v1/audio/speech')
|
||||||
|
self.TTS_API_KEY = self._get_secret('TTS_API_KEY', os.environ.get('TTS_API_KEY', ''))
|
||||||
|
|
||||||
|
# Upload configuration
|
||||||
|
self.UPLOAD_FOLDER = os.environ.get('UPLOAD_FOLDER', None)
|
||||||
|
|
||||||
|
# Request size limits (in bytes)
|
||||||
|
self.MAX_CONTENT_LENGTH = int(os.environ.get('MAX_CONTENT_LENGTH', 50 * 1024 * 1024)) # 50MB
|
||||||
|
self.MAX_AUDIO_SIZE = int(os.environ.get('MAX_AUDIO_SIZE', 25 * 1024 * 1024)) # 25MB
|
||||||
|
self.MAX_JSON_SIZE = int(os.environ.get('MAX_JSON_SIZE', 1 * 1024 * 1024)) # 1MB
|
||||||
|
self.MAX_IMAGE_SIZE = int(os.environ.get('MAX_IMAGE_SIZE', 10 * 1024 * 1024)) # 10MB
|
||||||
|
|
||||||
|
# CORS configuration
|
||||||
|
self.CORS_ORIGINS = os.environ.get('CORS_ORIGINS', '*').split(',')
|
||||||
|
self.ADMIN_CORS_ORIGINS = os.environ.get('ADMIN_CORS_ORIGINS', 'http://localhost:*').split(',')
|
||||||
|
|
||||||
|
# Admin configuration
|
||||||
|
self.ADMIN_TOKEN = self._get_secret('ADMIN_TOKEN',
|
||||||
|
os.environ.get('ADMIN_TOKEN', 'default-admin-token'))
|
||||||
|
|
||||||
|
# Database configuration (for future use)
|
||||||
|
self.DATABASE_URL = self._get_secret('DATABASE_URL',
|
||||||
|
os.environ.get('DATABASE_URL', 'sqlite:///talk2me.db'))
|
||||||
|
|
||||||
|
# Redis configuration (for future use)
|
||||||
|
self.REDIS_URL = self._get_secret('REDIS_URL',
|
||||||
|
os.environ.get('REDIS_URL', 'redis://localhost:6379/0'))
|
||||||
|
|
||||||
|
# Whisper configuration
|
||||||
|
self.WHISPER_MODEL_SIZE = os.environ.get('WHISPER_MODEL_SIZE', 'base')
|
||||||
|
self.WHISPER_DEVICE = os.environ.get('WHISPER_DEVICE', 'auto')
|
||||||
|
|
||||||
|
# Ollama configuration
|
||||||
|
self.OLLAMA_HOST = os.environ.get('OLLAMA_HOST', 'http://localhost:11434')
|
||||||
|
self.OLLAMA_MODEL = os.environ.get('OLLAMA_MODEL', 'gemma3:27b')
|
||||||
|
|
||||||
|
# Rate limiting configuration
|
||||||
|
self.RATE_LIMIT_ENABLED = self._get_bool('RATE_LIMIT_ENABLED', True)
|
||||||
|
self.RATE_LIMIT_STORAGE_URL = self._get_secret('RATE_LIMIT_STORAGE_URL',
|
||||||
|
os.environ.get('RATE_LIMIT_STORAGE_URL', 'memory://'))
|
||||||
|
|
||||||
|
# Logging configuration
|
||||||
|
self.LOG_LEVEL = os.environ.get('LOG_LEVEL', 'INFO')
|
||||||
|
self.LOG_FILE = os.environ.get('LOG_FILE', 'talk2me.log')
|
||||||
|
|
||||||
|
# Feature flags
|
||||||
|
self.ENABLE_PUSH_NOTIFICATIONS = self._get_bool('ENABLE_PUSH_NOTIFICATIONS', True)
|
||||||
|
self.ENABLE_OFFLINE_MODE = self._get_bool('ENABLE_OFFLINE_MODE', True)
|
||||||
|
self.ENABLE_STREAMING = self._get_bool('ENABLE_STREAMING', True)
|
||||||
|
self.ENABLE_MULTI_SPEAKER = self._get_bool('ENABLE_MULTI_SPEAKER', True)
|
||||||
|
|
||||||
|
# Performance tuning
|
||||||
|
self.WORKER_CONNECTIONS = int(os.environ.get('WORKER_CONNECTIONS', '1000'))
|
||||||
|
self.WORKER_TIMEOUT = int(os.environ.get('WORKER_TIMEOUT', '120'))
|
||||||
|
|
||||||
|
# Validate configuration
|
||||||
|
self._validate_config()
|
||||||
|
|
||||||
|
def _get_secret(self, key: str, default: str = None) -> str:
|
||||||
|
"""Get secret from secrets manager or environment"""
|
||||||
|
value = self.secrets_manager.get(key)
|
||||||
|
if value is None:
|
||||||
|
value = default
|
||||||
|
|
||||||
|
if value is None:
|
||||||
|
logger.warning(f"Configuration {key} not set")
|
||||||
|
|
||||||
|
return value
|
||||||
|
|
||||||
|
def _get_bool(self, key: str, default: bool = False) -> bool:
|
||||||
|
"""Get boolean configuration value"""
|
||||||
|
value = os.environ.get(key, '').lower()
|
||||||
|
if value in ('true', '1', 'yes', 'on'):
|
||||||
|
return True
|
||||||
|
elif value in ('false', '0', 'no', 'off'):
|
||||||
|
return False
|
||||||
|
return default
|
||||||
|
|
||||||
|
def _validate_config(self):
|
||||||
|
"""Validate configuration values"""
|
||||||
|
# Check required secrets
|
||||||
|
if not self.SECRET_KEY or self.SECRET_KEY == 'dev-key-change-this':
|
||||||
|
logger.warning("Using default SECRET_KEY - this is insecure for production!")
|
||||||
|
|
||||||
|
if not self.TTS_API_KEY:
|
||||||
|
logger.warning("TTS_API_KEY not configured - TTS functionality may not work")
|
||||||
|
|
||||||
|
if self.ADMIN_TOKEN == 'default-admin-token':
|
||||||
|
logger.warning("Using default ADMIN_TOKEN - this is insecure for production!")
|
||||||
|
|
||||||
|
# Validate URLs
|
||||||
|
if not self._is_valid_url(self.TTS_SERVER_URL):
|
||||||
|
logger.error(f"Invalid TTS_SERVER_URL: {self.TTS_SERVER_URL}")
|
||||||
|
|
||||||
|
# Check file permissions
|
||||||
|
if self.UPLOAD_FOLDER and not os.access(self.UPLOAD_FOLDER, os.W_OK):
|
||||||
|
logger.warning(f"Upload folder {self.UPLOAD_FOLDER} is not writable")
|
||||||
|
|
||||||
|
def _is_valid_url(self, url: str) -> bool:
|
||||||
|
"""Check if URL is valid"""
|
||||||
|
return url.startswith(('http://', 'https://'))
|
||||||
|
|
||||||
|
def to_dict(self) -> dict:
|
||||||
|
"""Export configuration as dictionary (excluding secrets)"""
|
||||||
|
config = {}
|
||||||
|
for key in dir(self):
|
||||||
|
if key.isupper() and not key.startswith('_'):
|
||||||
|
value = getattr(self, key)
|
||||||
|
# Mask sensitive values
|
||||||
|
if any(sensitive in key for sensitive in ['KEY', 'TOKEN', 'PASSWORD', 'SECRET']):
|
||||||
|
config[key] = '***MASKED***'
|
||||||
|
else:
|
||||||
|
config[key] = value
|
||||||
|
return config
|
||||||
|
|
||||||
|
class DevelopmentConfig(Config):
|
||||||
|
"""Development configuration"""
|
||||||
|
def _load_config(self):
|
||||||
|
super()._load_config()
|
||||||
|
self.DEBUG = True
|
||||||
|
self.TESTING = False
|
||||||
|
self.SESSION_COOKIE_SECURE = False # Allow HTTP in development
|
||||||
|
|
||||||
|
class ProductionConfig(Config):
|
||||||
|
"""Production configuration"""
|
||||||
|
def _load_config(self):
|
||||||
|
super()._load_config()
|
||||||
|
self.DEBUG = False
|
||||||
|
self.TESTING = False
|
||||||
|
|
||||||
|
# Enforce security in production
|
||||||
|
if not self.SECRET_KEY or self.SECRET_KEY == 'dev-key-change-this':
|
||||||
|
raise ValueError("SECRET_KEY must be set in production")
|
||||||
|
|
||||||
|
if self.ADMIN_TOKEN == 'default-admin-token':
|
||||||
|
raise ValueError("ADMIN_TOKEN must be changed in production")
|
||||||
|
|
||||||
|
class TestingConfig(Config):
|
||||||
|
"""Testing configuration"""
|
||||||
|
def _load_config(self):
|
||||||
|
super()._load_config()
|
||||||
|
self.DEBUG = True
|
||||||
|
self.TESTING = True
|
||||||
|
self.WTF_CSRF_ENABLED = False
|
||||||
|
self.RATE_LIMIT_ENABLED = False
|
||||||
|
|
||||||
|
# Configuration factory
|
||||||
|
def get_config(env: str = None) -> Config:
|
||||||
|
"""Get configuration based on environment"""
|
||||||
|
if env is None:
|
||||||
|
env = os.environ.get('FLASK_ENV', 'development')
|
||||||
|
|
||||||
|
configs = {
|
||||||
|
'development': DevelopmentConfig,
|
||||||
|
'production': ProductionConfig,
|
||||||
|
'testing': TestingConfig
|
||||||
|
}
|
||||||
|
|
||||||
|
config_class = configs.get(env, DevelopmentConfig)
|
||||||
|
return config_class()
|
||||||
|
|
||||||
|
# Convenience function for Flask app
|
||||||
|
def init_app(app):
|
||||||
|
"""Initialize Flask app with configuration"""
|
||||||
|
config = get_config()
|
||||||
|
|
||||||
|
# Apply configuration to app
|
||||||
|
for key in dir(config):
|
||||||
|
if key.isupper():
|
||||||
|
app.config[key] = getattr(config, key)
|
||||||
|
|
||||||
|
# Store config object
|
||||||
|
app.app_config = config
|
||||||
|
|
||||||
|
logger.info(f"Configuration loaded for environment: {os.environ.get('FLASK_ENV', 'development')}")
|
208
deploy.sh
Executable file
208
deploy.sh
Executable file
@ -0,0 +1,208 @@
|
|||||||
|
#!/bin/bash
|
||||||
|
# Production deployment script for Talk2Me
|
||||||
|
|
||||||
|
set -e # Exit on error
|
||||||
|
|
||||||
|
# Colors for output
|
||||||
|
RED='\033[0;31m'
|
||||||
|
GREEN='\033[0;32m'
|
||||||
|
YELLOW='\033[1;33m'
|
||||||
|
NC='\033[0m' # No Color
|
||||||
|
|
||||||
|
# Configuration
|
||||||
|
APP_NAME="talk2me"
|
||||||
|
APP_USER="talk2me"
|
||||||
|
APP_DIR="/opt/talk2me"
|
||||||
|
VENV_DIR="$APP_DIR/venv"
|
||||||
|
LOG_DIR="/var/log/talk2me"
|
||||||
|
PID_FILE="/var/run/talk2me.pid"
|
||||||
|
WORKERS=${WORKERS:-4}
|
||||||
|
|
||||||
|
# Functions
|
||||||
|
print_status() {
|
||||||
|
echo -e "${GREEN}[INFO]${NC} $1"
|
||||||
|
}
|
||||||
|
|
||||||
|
print_error() {
|
||||||
|
echo -e "${RED}[ERROR]${NC} $1"
|
||||||
|
}
|
||||||
|
|
||||||
|
print_warning() {
|
||||||
|
echo -e "${YELLOW}[WARNING]${NC} $1"
|
||||||
|
}
|
||||||
|
|
||||||
|
# Check if running as root
|
||||||
|
if [[ $EUID -ne 0 ]]; then
|
||||||
|
print_error "This script must be run as root"
|
||||||
|
exit 1
|
||||||
|
fi
|
||||||
|
|
||||||
|
# Create application user if doesn't exist
|
||||||
|
if ! id "$APP_USER" &>/dev/null; then
|
||||||
|
print_status "Creating application user: $APP_USER"
|
||||||
|
useradd -m -s /bin/bash $APP_USER
|
||||||
|
fi
|
||||||
|
|
||||||
|
# Create directories
|
||||||
|
print_status "Creating application directories"
|
||||||
|
mkdir -p $APP_DIR $LOG_DIR
|
||||||
|
chown -R $APP_USER:$APP_USER $APP_DIR $LOG_DIR
|
||||||
|
|
||||||
|
# Copy application files
|
||||||
|
print_status "Copying application files"
|
||||||
|
rsync -av --exclude='venv' --exclude='__pycache__' --exclude='*.pyc' \
|
||||||
|
--exclude='logs' --exclude='.git' --exclude='node_modules' \
|
||||||
|
./ $APP_DIR/
|
||||||
|
|
||||||
|
# Create virtual environment
|
||||||
|
print_status "Setting up Python virtual environment"
|
||||||
|
su - $APP_USER -c "cd $APP_DIR && python3 -m venv $VENV_DIR"
|
||||||
|
|
||||||
|
# Install dependencies
|
||||||
|
print_status "Installing Python dependencies"
|
||||||
|
su - $APP_USER -c "cd $APP_DIR && $VENV_DIR/bin/pip install --upgrade pip"
|
||||||
|
su - $APP_USER -c "cd $APP_DIR && $VENV_DIR/bin/pip install -r requirements-prod.txt"
|
||||||
|
|
||||||
|
# Install Whisper model
|
||||||
|
print_status "Downloading Whisper model (this may take a while)"
|
||||||
|
su - $APP_USER -c "cd $APP_DIR && $VENV_DIR/bin/python -c 'import whisper; whisper.load_model(\"base\")'"
|
||||||
|
|
||||||
|
# Build frontend assets
|
||||||
|
if [ -f "package.json" ]; then
|
||||||
|
print_status "Building frontend assets"
|
||||||
|
cd $APP_DIR
|
||||||
|
npm install
|
||||||
|
npm run build
|
||||||
|
fi
|
||||||
|
|
||||||
|
# Create systemd service
|
||||||
|
print_status "Creating systemd service"
|
||||||
|
cat > /etc/systemd/system/talk2me.service <<EOF
|
||||||
|
[Unit]
|
||||||
|
Description=Talk2Me Translation Service
|
||||||
|
After=network.target
|
||||||
|
|
||||||
|
[Service]
|
||||||
|
Type=notify
|
||||||
|
User=$APP_USER
|
||||||
|
Group=$APP_USER
|
||||||
|
WorkingDirectory=$APP_DIR
|
||||||
|
Environment="PATH=$VENV_DIR/bin"
|
||||||
|
Environment="FLASK_ENV=production"
|
||||||
|
Environment="UPLOAD_FOLDER=/tmp/talk2me_uploads"
|
||||||
|
Environment="LOGS_DIR=$LOG_DIR"
|
||||||
|
ExecStart=$VENV_DIR/bin/gunicorn --config gunicorn_config.py wsgi:application
|
||||||
|
ExecReload=/bin/kill -s HUP \$MAINPID
|
||||||
|
KillMode=mixed
|
||||||
|
TimeoutStopSec=5
|
||||||
|
Restart=always
|
||||||
|
RestartSec=10
|
||||||
|
|
||||||
|
# Security settings
|
||||||
|
NoNewPrivileges=true
|
||||||
|
PrivateTmp=true
|
||||||
|
ProtectSystem=strict
|
||||||
|
ProtectHome=true
|
||||||
|
ReadWritePaths=$LOG_DIR /tmp
|
||||||
|
|
||||||
|
[Install]
|
||||||
|
WantedBy=multi-user.target
|
||||||
|
EOF
|
||||||
|
|
||||||
|
# Create nginx configuration
|
||||||
|
print_status "Creating nginx configuration"
|
||||||
|
cat > /etc/nginx/sites-available/talk2me <<EOF
|
||||||
|
server {
|
||||||
|
listen 80;
|
||||||
|
server_name _; # Replace with your domain
|
||||||
|
|
||||||
|
# Security headers
|
||||||
|
add_header X-Content-Type-Options nosniff;
|
||||||
|
add_header X-Frame-Options DENY;
|
||||||
|
add_header X-XSS-Protection "1; mode=block";
|
||||||
|
add_header Referrer-Policy "strict-origin-when-cross-origin";
|
||||||
|
|
||||||
|
# File upload size limit
|
||||||
|
client_max_body_size 50M;
|
||||||
|
client_body_buffer_size 1M;
|
||||||
|
|
||||||
|
# Timeouts for long audio processing
|
||||||
|
proxy_connect_timeout 120s;
|
||||||
|
proxy_send_timeout 120s;
|
||||||
|
proxy_read_timeout 120s;
|
||||||
|
|
||||||
|
location / {
|
||||||
|
proxy_pass http://127.0.0.1:5005;
|
||||||
|
proxy_http_version 1.1;
|
||||||
|
proxy_set_header Upgrade \$http_upgrade;
|
||||||
|
proxy_set_header Connection 'upgrade';
|
||||||
|
proxy_set_header Host \$host;
|
||||||
|
proxy_set_header X-Real-IP \$remote_addr;
|
||||||
|
proxy_set_header X-Forwarded-For \$proxy_add_x_forwarded_for;
|
||||||
|
proxy_set_header X-Forwarded-Proto \$scheme;
|
||||||
|
proxy_cache_bypass \$http_upgrade;
|
||||||
|
|
||||||
|
# Don't buffer responses
|
||||||
|
proxy_buffering off;
|
||||||
|
|
||||||
|
# WebSocket support
|
||||||
|
proxy_set_header Connection "upgrade";
|
||||||
|
}
|
||||||
|
|
||||||
|
location /static {
|
||||||
|
alias $APP_DIR/static;
|
||||||
|
expires 1y;
|
||||||
|
add_header Cache-Control "public, immutable";
|
||||||
|
}
|
||||||
|
|
||||||
|
# Health check endpoint
|
||||||
|
location /health {
|
||||||
|
proxy_pass http://127.0.0.1:5005/health;
|
||||||
|
access_log off;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
EOF
|
||||||
|
|
||||||
|
# Enable nginx site
|
||||||
|
if [ -f /etc/nginx/sites-enabled/default ]; then
|
||||||
|
rm /etc/nginx/sites-enabled/default
|
||||||
|
fi
|
||||||
|
ln -sf /etc/nginx/sites-available/talk2me /etc/nginx/sites-enabled/
|
||||||
|
|
||||||
|
# Set permissions
|
||||||
|
chown -R $APP_USER:$APP_USER $APP_DIR
|
||||||
|
|
||||||
|
# Reload systemd
|
||||||
|
print_status "Reloading systemd"
|
||||||
|
systemctl daemon-reload
|
||||||
|
|
||||||
|
# Start services
|
||||||
|
print_status "Starting services"
|
||||||
|
systemctl enable talk2me
|
||||||
|
systemctl restart talk2me
|
||||||
|
systemctl restart nginx
|
||||||
|
|
||||||
|
# Wait for service to start
|
||||||
|
sleep 5
|
||||||
|
|
||||||
|
# Check service status
|
||||||
|
if systemctl is-active --quiet talk2me; then
|
||||||
|
print_status "Talk2Me service is running"
|
||||||
|
else
|
||||||
|
print_error "Talk2Me service failed to start"
|
||||||
|
journalctl -u talk2me -n 50
|
||||||
|
exit 1
|
||||||
|
fi
|
||||||
|
|
||||||
|
# Test health endpoint
|
||||||
|
if curl -s http://localhost:5005/health | grep -q "healthy"; then
|
||||||
|
print_status "Health check passed"
|
||||||
|
else
|
||||||
|
print_error "Health check failed"
|
||||||
|
exit 1
|
||||||
|
fi
|
||||||
|
|
||||||
|
print_status "Deployment complete!"
|
||||||
|
print_status "Talk2Me is now running at http://$(hostname -I | awk '{print $1}')"
|
||||||
|
print_status "Check logs at: $LOG_DIR"
|
||||||
|
print_status "Service status: systemctl status talk2me"
|
19
docker-compose.amd.yml
Normal file
19
docker-compose.amd.yml
Normal file
@ -0,0 +1,19 @@
|
|||||||
|
version: '3.8'
|
||||||
|
|
||||||
|
# Docker Compose override for AMD GPU support (ROCm)
|
||||||
|
# Usage: docker-compose -f docker-compose.yml -f docker-compose.amd.yml up
|
||||||
|
|
||||||
|
services:
|
||||||
|
talk2me:
|
||||||
|
environment:
|
||||||
|
- HSA_OVERRIDE_GFX_VERSION=10.3.0 # Adjust based on your GPU model
|
||||||
|
- ROCR_VISIBLE_DEVICES=0 # Use first GPU
|
||||||
|
volumes:
|
||||||
|
- /dev/kfd:/dev/kfd # ROCm KFD interface
|
||||||
|
- /dev/dri:/dev/dri # Direct Rendering Interface
|
||||||
|
devices:
|
||||||
|
- /dev/kfd
|
||||||
|
- /dev/dri
|
||||||
|
group_add:
|
||||||
|
- video # Required for GPU access
|
||||||
|
- render # Required for GPU access
|
11
docker-compose.apple.yml
Normal file
11
docker-compose.apple.yml
Normal file
@ -0,0 +1,11 @@
|
|||||||
|
version: '3.8'
|
||||||
|
|
||||||
|
# Docker Compose override for Apple Silicon
|
||||||
|
# Usage: docker-compose -f docker-compose.yml -f docker-compose.apple.yml up
|
||||||
|
|
||||||
|
services:
|
||||||
|
talk2me:
|
||||||
|
platform: linux/arm64/v8 # For M1/M2/M3 Macs
|
||||||
|
environment:
|
||||||
|
- PYTORCH_ENABLE_MPS_FALLBACK=1 # Enable Metal Performance Shaders fallback
|
||||||
|
- PYTORCH_MPS_HIGH_WATERMARK_RATIO=0.7 # Memory management for MPS
|
16
docker-compose.nvidia.yml
Normal file
16
docker-compose.nvidia.yml
Normal file
@ -0,0 +1,16 @@
|
|||||||
|
version: '3.8'
|
||||||
|
|
||||||
|
# Docker Compose override for NVIDIA GPU support
|
||||||
|
# Usage: docker-compose -f docker-compose.yml -f docker-compose.nvidia.yml up
|
||||||
|
|
||||||
|
services:
|
||||||
|
talk2me:
|
||||||
|
environment:
|
||||||
|
- CUDA_VISIBLE_DEVICES=0 # Use first GPU
|
||||||
|
deploy:
|
||||||
|
resources:
|
||||||
|
reservations:
|
||||||
|
devices:
|
||||||
|
- driver: nvidia
|
||||||
|
count: 1
|
||||||
|
capabilities: [gpu]
|
92
docker-compose.yml
Normal file
92
docker-compose.yml
Normal file
@ -0,0 +1,92 @@
|
|||||||
|
version: '3.8'
|
||||||
|
|
||||||
|
services:
|
||||||
|
talk2me:
|
||||||
|
build: .
|
||||||
|
container_name: talk2me
|
||||||
|
restart: unless-stopped
|
||||||
|
ports:
|
||||||
|
- "5005:5005"
|
||||||
|
environment:
|
||||||
|
- FLASK_ENV=production
|
||||||
|
- UPLOAD_FOLDER=/tmp/talk2me_uploads
|
||||||
|
- LOGS_DIR=/app/logs
|
||||||
|
- TTS_SERVER_URL=${TTS_SERVER_URL:-http://localhost:5050/v1/audio/speech}
|
||||||
|
- TTS_API_KEY=${TTS_API_KEY}
|
||||||
|
- ADMIN_TOKEN=${ADMIN_TOKEN:-change-me-in-production}
|
||||||
|
- SECRET_KEY=${SECRET_KEY:-change-me-in-production}
|
||||||
|
- GUNICORN_WORKERS=${GUNICORN_WORKERS:-4}
|
||||||
|
- GUNICORN_THREADS=${GUNICORN_THREADS:-2}
|
||||||
|
- MEMORY_THRESHOLD_MB=${MEMORY_THRESHOLD_MB:-4096}
|
||||||
|
- GPU_MEMORY_THRESHOLD_MB=${GPU_MEMORY_THRESHOLD_MB:-2048}
|
||||||
|
volumes:
|
||||||
|
- ./logs:/app/logs
|
||||||
|
- talk2me_uploads:/tmp/talk2me_uploads
|
||||||
|
- talk2me_models:/root/.cache/whisper # Whisper models cache
|
||||||
|
deploy:
|
||||||
|
resources:
|
||||||
|
limits:
|
||||||
|
memory: 4G
|
||||||
|
reservations:
|
||||||
|
memory: 2G
|
||||||
|
healthcheck:
|
||||||
|
test: ["CMD", "curl", "-f", "http://localhost:5005/health"]
|
||||||
|
interval: 30s
|
||||||
|
timeout: 10s
|
||||||
|
retries: 3
|
||||||
|
start_period: 40s
|
||||||
|
networks:
|
||||||
|
- talk2me_network
|
||||||
|
|
||||||
|
# Nginx reverse proxy (optional, for production)
|
||||||
|
nginx:
|
||||||
|
image: nginx:alpine
|
||||||
|
container_name: talk2me_nginx
|
||||||
|
restart: unless-stopped
|
||||||
|
ports:
|
||||||
|
- "80:80"
|
||||||
|
- "443:443"
|
||||||
|
volumes:
|
||||||
|
- ./nginx.conf:/etc/nginx/conf.d/default.conf:ro
|
||||||
|
- ./static:/app/static:ro
|
||||||
|
- nginx_ssl:/etc/nginx/ssl
|
||||||
|
depends_on:
|
||||||
|
- talk2me
|
||||||
|
networks:
|
||||||
|
- talk2me_network
|
||||||
|
|
||||||
|
# Redis for session storage (optional)
|
||||||
|
redis:
|
||||||
|
image: redis:7-alpine
|
||||||
|
container_name: talk2me_redis
|
||||||
|
restart: unless-stopped
|
||||||
|
command: redis-server --maxmemory 256mb --maxmemory-policy allkeys-lru
|
||||||
|
volumes:
|
||||||
|
- redis_data:/data
|
||||||
|
networks:
|
||||||
|
- talk2me_network
|
||||||
|
|
||||||
|
# PostgreSQL for persistent storage (optional)
|
||||||
|
postgres:
|
||||||
|
image: postgres:15-alpine
|
||||||
|
container_name: talk2me_postgres
|
||||||
|
restart: unless-stopped
|
||||||
|
environment:
|
||||||
|
- POSTGRES_DB=talk2me
|
||||||
|
- POSTGRES_USER=talk2me
|
||||||
|
- POSTGRES_PASSWORD=${POSTGRES_PASSWORD:-change-me-in-production}
|
||||||
|
volumes:
|
||||||
|
- postgres_data:/var/lib/postgresql/data
|
||||||
|
networks:
|
||||||
|
- talk2me_network
|
||||||
|
|
||||||
|
volumes:
|
||||||
|
talk2me_uploads:
|
||||||
|
talk2me_models:
|
||||||
|
redis_data:
|
||||||
|
postgres_data:
|
||||||
|
nginx_ssl:
|
||||||
|
|
||||||
|
networks:
|
||||||
|
talk2me_network:
|
||||||
|
driver: bridge
|
564
error_logger.py
Normal file
564
error_logger.py
Normal file
@ -0,0 +1,564 @@
|
|||||||
|
# Comprehensive error logging system for production debugging
|
||||||
|
import logging
|
||||||
|
import logging.handlers
|
||||||
|
import os
|
||||||
|
import sys
|
||||||
|
import json
|
||||||
|
import traceback
|
||||||
|
import time
|
||||||
|
from datetime import datetime
|
||||||
|
from typing import Dict, Any, Optional, Union
|
||||||
|
from functools import wraps
|
||||||
|
import socket
|
||||||
|
import threading
|
||||||
|
from flask import request, g
|
||||||
|
from contextlib import contextmanager
|
||||||
|
import hashlib
|
||||||
|
|
||||||
|
# Create logs directory if it doesn't exist
|
||||||
|
LOGS_DIR = os.environ.get('LOGS_DIR', 'logs')
|
||||||
|
os.makedirs(LOGS_DIR, exist_ok=True)
|
||||||
|
|
||||||
|
class StructuredFormatter(logging.Formatter):
|
||||||
|
"""
|
||||||
|
Custom formatter that outputs structured JSON logs
|
||||||
|
"""
|
||||||
|
def __init__(self, app_name='talk2me', environment='development'):
|
||||||
|
super().__init__()
|
||||||
|
self.app_name = app_name
|
||||||
|
self.environment = environment
|
||||||
|
self.hostname = socket.gethostname()
|
||||||
|
|
||||||
|
def format(self, record):
|
||||||
|
# Base log structure
|
||||||
|
log_data = {
|
||||||
|
'timestamp': datetime.utcnow().isoformat() + 'Z',
|
||||||
|
'level': record.levelname,
|
||||||
|
'logger': record.name,
|
||||||
|
'message': record.getMessage(),
|
||||||
|
'app': self.app_name,
|
||||||
|
'environment': self.environment,
|
||||||
|
'hostname': self.hostname,
|
||||||
|
'thread': threading.current_thread().name,
|
||||||
|
'process': os.getpid()
|
||||||
|
}
|
||||||
|
|
||||||
|
# Add exception info if present
|
||||||
|
if record.exc_info:
|
||||||
|
log_data['exception'] = {
|
||||||
|
'type': record.exc_info[0].__name__,
|
||||||
|
'message': str(record.exc_info[1]),
|
||||||
|
'traceback': traceback.format_exception(*record.exc_info)
|
||||||
|
}
|
||||||
|
|
||||||
|
# Add extra fields
|
||||||
|
if hasattr(record, 'extra_fields'):
|
||||||
|
log_data.update(record.extra_fields)
|
||||||
|
|
||||||
|
# Add Flask request context if available
|
||||||
|
if hasattr(record, 'request_id'):
|
||||||
|
log_data['request_id'] = record.request_id
|
||||||
|
|
||||||
|
if hasattr(record, 'user_id'):
|
||||||
|
log_data['user_id'] = record.user_id
|
||||||
|
|
||||||
|
if hasattr(record, 'session_id'):
|
||||||
|
log_data['session_id'] = record.session_id
|
||||||
|
|
||||||
|
# Add performance metrics if available
|
||||||
|
if hasattr(record, 'duration'):
|
||||||
|
log_data['duration_ms'] = record.duration
|
||||||
|
|
||||||
|
if hasattr(record, 'memory_usage'):
|
||||||
|
log_data['memory_usage_mb'] = record.memory_usage
|
||||||
|
|
||||||
|
return json.dumps(log_data, default=str)
|
||||||
|
|
||||||
|
class ErrorLogger:
|
||||||
|
"""
|
||||||
|
Comprehensive error logging system with multiple handlers and features
|
||||||
|
"""
|
||||||
|
def __init__(self, app=None, config=None):
|
||||||
|
self.config = config or {}
|
||||||
|
self.loggers = {}
|
||||||
|
self.error_counts = {}
|
||||||
|
self.error_signatures = {}
|
||||||
|
|
||||||
|
if app:
|
||||||
|
self.init_app(app)
|
||||||
|
|
||||||
|
def init_app(self, app):
|
||||||
|
"""Initialize error logging for Flask app"""
|
||||||
|
self.app = app
|
||||||
|
|
||||||
|
# Get configuration
|
||||||
|
self.log_level = self.config.get('log_level',
|
||||||
|
app.config.get('LOG_LEVEL', 'INFO'))
|
||||||
|
self.log_file = self.config.get('log_file',
|
||||||
|
app.config.get('LOG_FILE',
|
||||||
|
os.path.join(LOGS_DIR, 'talk2me.log')))
|
||||||
|
self.error_log_file = self.config.get('error_log_file',
|
||||||
|
os.path.join(LOGS_DIR, 'errors.log'))
|
||||||
|
self.max_bytes = self.config.get('max_bytes', 50 * 1024 * 1024) # 50MB
|
||||||
|
self.backup_count = self.config.get('backup_count', 10)
|
||||||
|
self.environment = app.config.get('FLASK_ENV', 'development')
|
||||||
|
|
||||||
|
# Set up loggers
|
||||||
|
self._setup_app_logger()
|
||||||
|
self._setup_error_logger()
|
||||||
|
self._setup_access_logger()
|
||||||
|
self._setup_security_logger()
|
||||||
|
self._setup_performance_logger()
|
||||||
|
|
||||||
|
# Add Flask error handlers
|
||||||
|
self._setup_flask_handlers(app)
|
||||||
|
|
||||||
|
# Add request logging
|
||||||
|
app.before_request(self._before_request)
|
||||||
|
app.after_request(self._after_request)
|
||||||
|
|
||||||
|
# Store logger in app
|
||||||
|
app.error_logger = self
|
||||||
|
|
||||||
|
logging.info("Error logging system initialized")
|
||||||
|
|
||||||
|
def _setup_app_logger(self):
|
||||||
|
"""Set up main application logger"""
|
||||||
|
app_logger = logging.getLogger('talk2me')
|
||||||
|
app_logger.setLevel(getattr(logging, self.log_level.upper()))
|
||||||
|
|
||||||
|
# Remove existing handlers
|
||||||
|
app_logger.handlers = []
|
||||||
|
|
||||||
|
# Console handler with color support
|
||||||
|
console_handler = logging.StreamHandler(sys.stdout)
|
||||||
|
if sys.stdout.isatty():
|
||||||
|
# Use colored output for terminals
|
||||||
|
from colorlog import ColoredFormatter
|
||||||
|
console_formatter = ColoredFormatter(
|
||||||
|
'%(log_color)s%(asctime)s - %(name)s - %(levelname)s - %(message)s',
|
||||||
|
log_colors={
|
||||||
|
'DEBUG': 'cyan',
|
||||||
|
'INFO': 'green',
|
||||||
|
'WARNING': 'yellow',
|
||||||
|
'ERROR': 'red',
|
||||||
|
'CRITICAL': 'red,bg_white',
|
||||||
|
}
|
||||||
|
)
|
||||||
|
console_handler.setFormatter(console_formatter)
|
||||||
|
else:
|
||||||
|
console_handler.setFormatter(
|
||||||
|
StructuredFormatter('talk2me', self.environment)
|
||||||
|
)
|
||||||
|
app_logger.addHandler(console_handler)
|
||||||
|
|
||||||
|
# Rotating file handler
|
||||||
|
file_handler = logging.handlers.RotatingFileHandler(
|
||||||
|
self.log_file,
|
||||||
|
maxBytes=self.max_bytes,
|
||||||
|
backupCount=self.backup_count
|
||||||
|
)
|
||||||
|
file_handler.setFormatter(
|
||||||
|
StructuredFormatter('talk2me', self.environment)
|
||||||
|
)
|
||||||
|
app_logger.addHandler(file_handler)
|
||||||
|
|
||||||
|
self.loggers['app'] = app_logger
|
||||||
|
|
||||||
|
def _setup_error_logger(self):
|
||||||
|
"""Set up dedicated error logger"""
|
||||||
|
error_logger = logging.getLogger('talk2me.errors')
|
||||||
|
error_logger.setLevel(logging.ERROR)
|
||||||
|
|
||||||
|
# Error file handler
|
||||||
|
error_handler = logging.handlers.RotatingFileHandler(
|
||||||
|
self.error_log_file,
|
||||||
|
maxBytes=self.max_bytes,
|
||||||
|
backupCount=self.backup_count
|
||||||
|
)
|
||||||
|
error_handler.setFormatter(
|
||||||
|
StructuredFormatter('talk2me', self.environment)
|
||||||
|
)
|
||||||
|
error_logger.addHandler(error_handler)
|
||||||
|
|
||||||
|
# Also send errors to syslog if available
|
||||||
|
try:
|
||||||
|
syslog_handler = logging.handlers.SysLogHandler(
|
||||||
|
address='/dev/log' if os.path.exists('/dev/log') else ('localhost', 514)
|
||||||
|
)
|
||||||
|
syslog_handler.setFormatter(
|
||||||
|
logging.Formatter('talk2me[%(process)d]: %(levelname)s %(message)s')
|
||||||
|
)
|
||||||
|
error_logger.addHandler(syslog_handler)
|
||||||
|
except Exception:
|
||||||
|
pass # Syslog not available
|
||||||
|
|
||||||
|
self.loggers['error'] = error_logger
|
||||||
|
|
||||||
|
def _setup_access_logger(self):
|
||||||
|
"""Set up access logger for HTTP requests"""
|
||||||
|
access_logger = logging.getLogger('talk2me.access')
|
||||||
|
access_logger.setLevel(logging.INFO)
|
||||||
|
|
||||||
|
# Access log file
|
||||||
|
access_handler = logging.handlers.TimedRotatingFileHandler(
|
||||||
|
os.path.join(LOGS_DIR, 'access.log'),
|
||||||
|
when='midnight',
|
||||||
|
interval=1,
|
||||||
|
backupCount=30
|
||||||
|
)
|
||||||
|
access_handler.setFormatter(
|
||||||
|
StructuredFormatter('talk2me', self.environment)
|
||||||
|
)
|
||||||
|
access_logger.addHandler(access_handler)
|
||||||
|
|
||||||
|
self.loggers['access'] = access_logger
|
||||||
|
|
||||||
|
def _setup_security_logger(self):
|
||||||
|
"""Set up security event logger"""
|
||||||
|
security_logger = logging.getLogger('talk2me.security')
|
||||||
|
security_logger.setLevel(logging.WARNING)
|
||||||
|
|
||||||
|
# Security log file
|
||||||
|
security_handler = logging.handlers.RotatingFileHandler(
|
||||||
|
os.path.join(LOGS_DIR, 'security.log'),
|
||||||
|
maxBytes=self.max_bytes,
|
||||||
|
backupCount=self.backup_count
|
||||||
|
)
|
||||||
|
security_handler.setFormatter(
|
||||||
|
StructuredFormatter('talk2me', self.environment)
|
||||||
|
)
|
||||||
|
security_logger.addHandler(security_handler)
|
||||||
|
|
||||||
|
self.loggers['security'] = security_logger
|
||||||
|
|
||||||
|
def _setup_performance_logger(self):
|
||||||
|
"""Set up performance metrics logger"""
|
||||||
|
perf_logger = logging.getLogger('talk2me.performance')
|
||||||
|
perf_logger.setLevel(logging.INFO)
|
||||||
|
|
||||||
|
# Performance log file
|
||||||
|
perf_handler = logging.handlers.TimedRotatingFileHandler(
|
||||||
|
os.path.join(LOGS_DIR, 'performance.log'),
|
||||||
|
when='H', # Hourly rotation
|
||||||
|
interval=1,
|
||||||
|
backupCount=168 # 7 days
|
||||||
|
)
|
||||||
|
perf_handler.setFormatter(
|
||||||
|
StructuredFormatter('talk2me', self.environment)
|
||||||
|
)
|
||||||
|
perf_logger.addHandler(perf_handler)
|
||||||
|
|
||||||
|
self.loggers['performance'] = perf_logger
|
||||||
|
|
||||||
|
def _setup_flask_handlers(self, app):
|
||||||
|
"""Set up Flask error handlers"""
|
||||||
|
@app.errorhandler(Exception)
|
||||||
|
def handle_exception(error):
|
||||||
|
# Get request ID
|
||||||
|
request_id = getattr(g, 'request_id', 'unknown')
|
||||||
|
|
||||||
|
# Create error signature for deduplication
|
||||||
|
error_signature = self._get_error_signature(error)
|
||||||
|
|
||||||
|
# Log the error
|
||||||
|
self.log_error(
|
||||||
|
error,
|
||||||
|
request_id=request_id,
|
||||||
|
endpoint=request.endpoint,
|
||||||
|
method=request.method,
|
||||||
|
path=request.path,
|
||||||
|
ip=request.remote_addr,
|
||||||
|
user_agent=request.headers.get('User-Agent'),
|
||||||
|
signature=error_signature
|
||||||
|
)
|
||||||
|
|
||||||
|
# Track error frequency
|
||||||
|
self._track_error(error_signature)
|
||||||
|
|
||||||
|
# Return appropriate response
|
||||||
|
if hasattr(error, 'code'):
|
||||||
|
return {'error': str(error)}, error.code
|
||||||
|
else:
|
||||||
|
return {'error': 'Internal server error'}, 500
|
||||||
|
|
||||||
|
def _before_request(self):
|
||||||
|
"""Log request start"""
|
||||||
|
# Generate request ID
|
||||||
|
g.request_id = self._generate_request_id()
|
||||||
|
g.request_start_time = time.time()
|
||||||
|
|
||||||
|
# Log access
|
||||||
|
self.log_access(
|
||||||
|
'request_start',
|
||||||
|
request_id=g.request_id,
|
||||||
|
method=request.method,
|
||||||
|
path=request.path,
|
||||||
|
ip=request.remote_addr,
|
||||||
|
user_agent=request.headers.get('User-Agent')
|
||||||
|
)
|
||||||
|
|
||||||
|
def _after_request(self, response):
|
||||||
|
"""Log request completion"""
|
||||||
|
# Calculate duration
|
||||||
|
duration = None
|
||||||
|
if hasattr(g, 'request_start_time'):
|
||||||
|
duration = int((time.time() - g.request_start_time) * 1000)
|
||||||
|
|
||||||
|
# Log access
|
||||||
|
self.log_access(
|
||||||
|
'request_complete',
|
||||||
|
request_id=getattr(g, 'request_id', 'unknown'),
|
||||||
|
method=request.method,
|
||||||
|
path=request.path,
|
||||||
|
status=response.status_code,
|
||||||
|
duration_ms=duration,
|
||||||
|
content_length=response.content_length
|
||||||
|
)
|
||||||
|
|
||||||
|
# Log performance metrics for slow requests
|
||||||
|
if duration and duration > 1000: # Over 1 second
|
||||||
|
self.log_performance(
|
||||||
|
'slow_request',
|
||||||
|
request_id=getattr(g, 'request_id', 'unknown'),
|
||||||
|
endpoint=request.endpoint,
|
||||||
|
duration_ms=duration
|
||||||
|
)
|
||||||
|
|
||||||
|
return response
|
||||||
|
|
||||||
|
def log_error(self, error: Exception, **kwargs):
|
||||||
|
"""Log an error with context"""
|
||||||
|
error_logger = self.loggers.get('error', logging.getLogger())
|
||||||
|
|
||||||
|
# Create log record with extra fields
|
||||||
|
extra = {
|
||||||
|
'extra_fields': kwargs,
|
||||||
|
'request_id': kwargs.get('request_id'),
|
||||||
|
'user_id': kwargs.get('user_id'),
|
||||||
|
'session_id': kwargs.get('session_id')
|
||||||
|
}
|
||||||
|
|
||||||
|
# Log with full traceback
|
||||||
|
error_logger.error(
|
||||||
|
f"Error in {kwargs.get('endpoint', 'unknown')}: {str(error)}",
|
||||||
|
exc_info=sys.exc_info(),
|
||||||
|
extra=extra
|
||||||
|
)
|
||||||
|
|
||||||
|
def log_access(self, message: str, **kwargs):
|
||||||
|
"""Log access event"""
|
||||||
|
access_logger = self.loggers.get('access', logging.getLogger())
|
||||||
|
|
||||||
|
extra = {
|
||||||
|
'extra_fields': kwargs,
|
||||||
|
'request_id': kwargs.get('request_id')
|
||||||
|
}
|
||||||
|
|
||||||
|
access_logger.info(message, extra=extra)
|
||||||
|
|
||||||
|
def log_security(self, event: str, severity: str = 'warning', **kwargs):
|
||||||
|
"""Log security event"""
|
||||||
|
security_logger = self.loggers.get('security', logging.getLogger())
|
||||||
|
|
||||||
|
extra = {
|
||||||
|
'extra_fields': {
|
||||||
|
'event': event,
|
||||||
|
'severity': severity,
|
||||||
|
**kwargs
|
||||||
|
},
|
||||||
|
'request_id': kwargs.get('request_id')
|
||||||
|
}
|
||||||
|
|
||||||
|
log_method = getattr(security_logger, severity.lower(), security_logger.warning)
|
||||||
|
log_method(f"Security event: {event}", extra=extra)
|
||||||
|
|
||||||
|
def log_performance(self, metric: str, value: Union[int, float] = None, **kwargs):
|
||||||
|
"""Log performance metric"""
|
||||||
|
perf_logger = self.loggers.get('performance', logging.getLogger())
|
||||||
|
|
||||||
|
extra = {
|
||||||
|
'extra_fields': {
|
||||||
|
'metric': metric,
|
||||||
|
'value': value,
|
||||||
|
**kwargs
|
||||||
|
},
|
||||||
|
'request_id': kwargs.get('request_id')
|
||||||
|
}
|
||||||
|
|
||||||
|
perf_logger.info(f"Performance metric: {metric}", extra=extra)
|
||||||
|
|
||||||
|
def _generate_request_id(self):
|
||||||
|
"""Generate unique request ID"""
|
||||||
|
return f"{int(time.time() * 1000)}-{os.urandom(8).hex()}"
|
||||||
|
|
||||||
|
def _get_error_signature(self, error: Exception):
|
||||||
|
"""Generate signature for error deduplication"""
|
||||||
|
# Create signature from error type and key parts of traceback
|
||||||
|
tb_summary = traceback.format_exception_only(type(error), error)
|
||||||
|
signature_data = f"{type(error).__name__}:{tb_summary[0] if tb_summary else ''}"
|
||||||
|
return hashlib.md5(signature_data.encode()).hexdigest()
|
||||||
|
|
||||||
|
def _track_error(self, signature: str):
|
||||||
|
"""Track error frequency"""
|
||||||
|
now = time.time()
|
||||||
|
|
||||||
|
if signature not in self.error_counts:
|
||||||
|
self.error_counts[signature] = []
|
||||||
|
|
||||||
|
# Add current timestamp
|
||||||
|
self.error_counts[signature].append(now)
|
||||||
|
|
||||||
|
# Clean old entries (keep last hour)
|
||||||
|
self.error_counts[signature] = [
|
||||||
|
ts for ts in self.error_counts[signature]
|
||||||
|
if now - ts < 3600
|
||||||
|
]
|
||||||
|
|
||||||
|
# Alert if error rate is high
|
||||||
|
error_count = len(self.error_counts[signature])
|
||||||
|
if error_count > 10: # More than 10 in an hour
|
||||||
|
self.log_security(
|
||||||
|
'high_error_rate',
|
||||||
|
severity='error',
|
||||||
|
signature=signature,
|
||||||
|
count=error_count,
|
||||||
|
message="High error rate detected"
|
||||||
|
)
|
||||||
|
|
||||||
|
def get_error_summary(self):
|
||||||
|
"""Get summary of recent errors"""
|
||||||
|
summary = {}
|
||||||
|
now = time.time()
|
||||||
|
|
||||||
|
for signature, timestamps in self.error_counts.items():
|
||||||
|
recent_count = len([ts for ts in timestamps if now - ts < 3600])
|
||||||
|
if recent_count > 0:
|
||||||
|
summary[signature] = {
|
||||||
|
'count_last_hour': recent_count,
|
||||||
|
'last_seen': max(timestamps)
|
||||||
|
}
|
||||||
|
|
||||||
|
return summary
|
||||||
|
|
||||||
|
# Decorators for easy logging
|
||||||
|
def log_errors(logger_name='talk2me'):
|
||||||
|
"""Decorator to log function errors"""
|
||||||
|
def decorator(func):
|
||||||
|
@wraps(func)
|
||||||
|
def wrapper(*args, **kwargs):
|
||||||
|
try:
|
||||||
|
return func(*args, **kwargs)
|
||||||
|
except Exception as e:
|
||||||
|
logger = logging.getLogger(logger_name)
|
||||||
|
logger.error(
|
||||||
|
f"Error in {func.__name__}: {str(e)}",
|
||||||
|
exc_info=sys.exc_info(),
|
||||||
|
extra={
|
||||||
|
'extra_fields': {
|
||||||
|
'function': func.__name__,
|
||||||
|
'module': func.__module__
|
||||||
|
}
|
||||||
|
}
|
||||||
|
)
|
||||||
|
raise
|
||||||
|
return wrapper
|
||||||
|
return decorator
|
||||||
|
|
||||||
|
def log_performance(metric_name=None):
|
||||||
|
"""Decorator to log function performance"""
|
||||||
|
def decorator(func):
|
||||||
|
@wraps(func)
|
||||||
|
def wrapper(*args, **kwargs):
|
||||||
|
start_time = time.time()
|
||||||
|
|
||||||
|
try:
|
||||||
|
result = func(*args, **kwargs)
|
||||||
|
duration = int((time.time() - start_time) * 1000)
|
||||||
|
|
||||||
|
# Log performance
|
||||||
|
logger = logging.getLogger('talk2me.performance')
|
||||||
|
logger.info(
|
||||||
|
f"Performance: {metric_name or func.__name__}",
|
||||||
|
extra={
|
||||||
|
'extra_fields': {
|
||||||
|
'metric': metric_name or func.__name__,
|
||||||
|
'duration_ms': duration,
|
||||||
|
'function': func.__name__,
|
||||||
|
'module': func.__module__
|
||||||
|
}
|
||||||
|
}
|
||||||
|
)
|
||||||
|
|
||||||
|
return result
|
||||||
|
except Exception:
|
||||||
|
duration = int((time.time() - start_time) * 1000)
|
||||||
|
logger = logging.getLogger('talk2me.performance')
|
||||||
|
logger.warning(
|
||||||
|
f"Performance (failed): {metric_name or func.__name__}",
|
||||||
|
extra={
|
||||||
|
'extra_fields': {
|
||||||
|
'metric': metric_name or func.__name__,
|
||||||
|
'duration_ms': duration,
|
||||||
|
'function': func.__name__,
|
||||||
|
'module': func.__module__,
|
||||||
|
'status': 'failed'
|
||||||
|
}
|
||||||
|
}
|
||||||
|
)
|
||||||
|
raise
|
||||||
|
return wrapper
|
||||||
|
return decorator
|
||||||
|
|
||||||
|
@contextmanager
|
||||||
|
def log_context(**kwargs):
|
||||||
|
"""Context manager to add context to logs"""
|
||||||
|
# Store current context
|
||||||
|
old_context = {}
|
||||||
|
for key, value in kwargs.items():
|
||||||
|
if hasattr(g, key):
|
||||||
|
old_context[key] = getattr(g, key)
|
||||||
|
setattr(g, key, value)
|
||||||
|
|
||||||
|
try:
|
||||||
|
yield
|
||||||
|
finally:
|
||||||
|
# Restore old context
|
||||||
|
for key in kwargs:
|
||||||
|
if key in old_context:
|
||||||
|
setattr(g, key, old_context[key])
|
||||||
|
else:
|
||||||
|
delattr(g, key)
|
||||||
|
|
||||||
|
# Utility functions
|
||||||
|
def configure_logging(app, **kwargs):
|
||||||
|
"""Configure logging for the application"""
|
||||||
|
config = {
|
||||||
|
'log_level': kwargs.get('log_level', app.config.get('LOG_LEVEL', 'INFO')),
|
||||||
|
'log_file': kwargs.get('log_file', app.config.get('LOG_FILE')),
|
||||||
|
'error_log_file': kwargs.get('error_log_file'),
|
||||||
|
'max_bytes': kwargs.get('max_bytes', 50 * 1024 * 1024),
|
||||||
|
'backup_count': kwargs.get('backup_count', 10)
|
||||||
|
}
|
||||||
|
|
||||||
|
error_logger = ErrorLogger(app, config)
|
||||||
|
return error_logger
|
||||||
|
|
||||||
|
def get_logger(name='talk2me'):
|
||||||
|
"""Get a logger instance"""
|
||||||
|
return logging.getLogger(name)
|
||||||
|
|
||||||
|
def log_exception(error, message=None, **kwargs):
|
||||||
|
"""Log an exception with context"""
|
||||||
|
logger = logging.getLogger('talk2me.errors')
|
||||||
|
|
||||||
|
extra = {
|
||||||
|
'extra_fields': kwargs,
|
||||||
|
'request_id': getattr(g, 'request_id', None)
|
||||||
|
}
|
||||||
|
|
||||||
|
logger.error(
|
||||||
|
message or f"Exception: {str(error)}",
|
||||||
|
exc_info=(type(error), error, error.__traceback__),
|
||||||
|
extra=extra
|
||||||
|
)
|
86
gunicorn_config.py
Normal file
86
gunicorn_config.py
Normal file
@ -0,0 +1,86 @@
|
|||||||
|
"""
|
||||||
|
Gunicorn configuration for production deployment
|
||||||
|
"""
|
||||||
|
import multiprocessing
|
||||||
|
import os
|
||||||
|
|
||||||
|
# Server socket
|
||||||
|
bind = os.environ.get('GUNICORN_BIND', '0.0.0.0:5005')
|
||||||
|
backlog = 2048
|
||||||
|
|
||||||
|
# Worker processes
|
||||||
|
# Use 2-4 workers per CPU core
|
||||||
|
workers = int(os.environ.get('GUNICORN_WORKERS', multiprocessing.cpu_count() * 2 + 1))
|
||||||
|
worker_class = 'sync' # Use 'gevent' for async if needed
|
||||||
|
worker_connections = 1000
|
||||||
|
timeout = 120 # Increased for audio processing
|
||||||
|
keepalive = 5
|
||||||
|
|
||||||
|
# Restart workers after this many requests, to help prevent memory leaks
|
||||||
|
max_requests = 1000
|
||||||
|
max_requests_jitter = 50
|
||||||
|
|
||||||
|
# Preload the application
|
||||||
|
preload_app = True
|
||||||
|
|
||||||
|
# Server mechanics
|
||||||
|
daemon = False
|
||||||
|
pidfile = os.environ.get('GUNICORN_PID', '/tmp/talk2me.pid')
|
||||||
|
user = None
|
||||||
|
group = None
|
||||||
|
tmp_upload_dir = None
|
||||||
|
|
||||||
|
# Logging
|
||||||
|
accesslog = os.environ.get('GUNICORN_ACCESS_LOG', '-')
|
||||||
|
errorlog = os.environ.get('GUNICORN_ERROR_LOG', '-')
|
||||||
|
loglevel = os.environ.get('GUNICORN_LOG_LEVEL', 'info')
|
||||||
|
access_log_format = '%(h)s %(l)s %(u)s %(t)s "%(r)s" %(s)s %(b)s "%(f)s" "%(a)s" %(D)s'
|
||||||
|
|
||||||
|
# Process naming
|
||||||
|
proc_name = 'talk2me'
|
||||||
|
|
||||||
|
# Server hooks
|
||||||
|
def when_ready(server):
|
||||||
|
"""Called just after the server is started."""
|
||||||
|
server.log.info("Server is ready. Spawning workers")
|
||||||
|
|
||||||
|
def worker_int(worker):
|
||||||
|
"""Called just after a worker exited on SIGINT or SIGQUIT."""
|
||||||
|
worker.log.info("Worker received INT or QUIT signal")
|
||||||
|
|
||||||
|
def pre_fork(server, worker):
|
||||||
|
"""Called just before a worker is forked."""
|
||||||
|
server.log.info(f"Forking worker {worker}")
|
||||||
|
|
||||||
|
def post_fork(server, worker):
|
||||||
|
"""Called just after a worker has been forked."""
|
||||||
|
server.log.info(f"Worker spawned (pid: {worker.pid})")
|
||||||
|
|
||||||
|
def worker_exit(server, worker):
|
||||||
|
"""Called just after a worker has been killed."""
|
||||||
|
server.log.info(f"Worker exit (pid: {worker.pid})")
|
||||||
|
|
||||||
|
def pre_request(worker, req):
|
||||||
|
"""Called just before a worker processes the request."""
|
||||||
|
worker.log.debug(f"{req.method} {req.path}")
|
||||||
|
|
||||||
|
def post_request(worker, req, environ, resp):
|
||||||
|
"""Called after a worker processes the request."""
|
||||||
|
worker.log.debug(f"{req.method} {req.path} - {resp.status}")
|
||||||
|
|
||||||
|
# SSL/TLS (uncomment if using HTTPS directly)
|
||||||
|
# keyfile = '/path/to/keyfile'
|
||||||
|
# certfile = '/path/to/certfile'
|
||||||
|
# ssl_version = 'TLSv1_2'
|
||||||
|
# cert_reqs = 'required'
|
||||||
|
# ca_certs = '/path/to/ca_certs'
|
||||||
|
|
||||||
|
# Thread option (if using threaded workers)
|
||||||
|
threads = int(os.environ.get('GUNICORN_THREADS', 1))
|
||||||
|
|
||||||
|
# Silent health checks in logs
|
||||||
|
def pre_request(worker, req):
|
||||||
|
if req.path in ['/health', '/health/live']:
|
||||||
|
# Don't log health checks
|
||||||
|
return
|
||||||
|
worker.log.debug(f"{req.method} {req.path}")
|
91
health-monitor.py
Executable file
91
health-monitor.py
Executable file
@ -0,0 +1,91 @@
|
|||||||
|
#!/usr/bin/env python3
|
||||||
|
"""
|
||||||
|
Health monitoring script for Talk2Me application
|
||||||
|
Usage: python health-monitor.py [--detailed] [--interval SECONDS]
|
||||||
|
"""
|
||||||
|
|
||||||
|
import requests
|
||||||
|
import time
|
||||||
|
import argparse
|
||||||
|
import json
|
||||||
|
from datetime import datetime
|
||||||
|
|
||||||
|
def check_health(url, detailed=False):
|
||||||
|
"""Check health of the Talk2Me service"""
|
||||||
|
endpoint = f"{url}/health/detailed" if detailed else f"{url}/health"
|
||||||
|
|
||||||
|
try:
|
||||||
|
response = requests.get(endpoint, timeout=5)
|
||||||
|
data = response.json()
|
||||||
|
|
||||||
|
if detailed:
|
||||||
|
print(f"\n=== Health Check at {datetime.now().strftime('%Y-%m-%d %H:%M:%S')} ===")
|
||||||
|
print(f"Overall Status: {data['status'].upper()}")
|
||||||
|
print("\nComponent Status:")
|
||||||
|
for component, status in data['components'].items():
|
||||||
|
status_icon = "✅" if status.get('status') == 'healthy' else "❌"
|
||||||
|
print(f" {status_icon} {component}: {status.get('status', 'unknown')}")
|
||||||
|
if 'error' in status:
|
||||||
|
print(f" Error: {status['error']}")
|
||||||
|
if 'device' in status:
|
||||||
|
print(f" Device: {status['device']}")
|
||||||
|
if 'model_size' in status:
|
||||||
|
print(f" Model: {status['model_size']}")
|
||||||
|
|
||||||
|
if 'metrics' in data:
|
||||||
|
print("\nMetrics:")
|
||||||
|
uptime = data['metrics'].get('uptime', 0)
|
||||||
|
hours = int(uptime // 3600)
|
||||||
|
minutes = int((uptime % 3600) // 60)
|
||||||
|
print(f" Uptime: {hours}h {minutes}m")
|
||||||
|
print(f" Request Count: {data['metrics'].get('request_count', 0)}")
|
||||||
|
else:
|
||||||
|
status_icon = "✅" if response.status_code == 200 else "❌"
|
||||||
|
print(f"{status_icon} {datetime.now().strftime('%H:%M:%S')} - Status: {data.get('status', 'unknown')}")
|
||||||
|
|
||||||
|
return response.status_code == 200
|
||||||
|
|
||||||
|
except requests.exceptions.ConnectionError:
|
||||||
|
print(f"❌ {datetime.now().strftime('%H:%M:%S')} - Connection failed")
|
||||||
|
return False
|
||||||
|
except requests.exceptions.Timeout:
|
||||||
|
print(f"❌ {datetime.now().strftime('%H:%M:%S')} - Request timeout")
|
||||||
|
return False
|
||||||
|
except Exception as e:
|
||||||
|
print(f"❌ {datetime.now().strftime('%H:%M:%S')} - Error: {str(e)}")
|
||||||
|
return False
|
||||||
|
|
||||||
|
def main():
|
||||||
|
parser = argparse.ArgumentParser(description='Monitor Talk2Me service health')
|
||||||
|
parser.add_argument('--url', default='http://localhost:5005', help='Service URL')
|
||||||
|
parser.add_argument('--detailed', action='store_true', help='Show detailed health info')
|
||||||
|
parser.add_argument('--interval', type=int, default=30, help='Check interval in seconds')
|
||||||
|
parser.add_argument('--once', action='store_true', help='Run once and exit')
|
||||||
|
|
||||||
|
args = parser.parse_args()
|
||||||
|
|
||||||
|
print(f"Monitoring {args.url}")
|
||||||
|
print("Press Ctrl+C to stop\n")
|
||||||
|
|
||||||
|
consecutive_failures = 0
|
||||||
|
|
||||||
|
try:
|
||||||
|
while True:
|
||||||
|
success = check_health(args.url, args.detailed)
|
||||||
|
|
||||||
|
if not success:
|
||||||
|
consecutive_failures += 1
|
||||||
|
if consecutive_failures >= 3:
|
||||||
|
print(f"\n⚠️ ALERT: Service has been down for {consecutive_failures} consecutive checks!")
|
||||||
|
else:
|
||||||
|
consecutive_failures = 0
|
||||||
|
|
||||||
|
if args.once:
|
||||||
|
break
|
||||||
|
|
||||||
|
time.sleep(args.interval)
|
||||||
|
except KeyboardInterrupt:
|
||||||
|
print("\n\nMonitoring stopped.")
|
||||||
|
|
||||||
|
if __name__ == "__main__":
|
||||||
|
main()
|
117
maintenance.sh
Executable file
117
maintenance.sh
Executable file
@ -0,0 +1,117 @@
|
|||||||
|
#!/bin/bash
|
||||||
|
|
||||||
|
# Maintenance script for Talk2Me application
|
||||||
|
# This script helps manage temporary files and disk space
|
||||||
|
|
||||||
|
UPLOAD_FOLDER="${UPLOAD_FOLDER:-/tmp/talk2me_uploads}"
|
||||||
|
MAX_AGE_MINUTES=5
|
||||||
|
|
||||||
|
echo "Talk2Me Maintenance Script"
|
||||||
|
echo "========================="
|
||||||
|
|
||||||
|
# Function to check disk usage
|
||||||
|
check_disk_usage() {
|
||||||
|
echo -e "\nDisk Usage:"
|
||||||
|
df -h "$UPLOAD_FOLDER" 2>/dev/null || df -h /tmp
|
||||||
|
}
|
||||||
|
|
||||||
|
# Function to show temp file stats
|
||||||
|
show_temp_stats() {
|
||||||
|
echo -e "\nTemporary File Statistics:"
|
||||||
|
if [ -d "$UPLOAD_FOLDER" ]; then
|
||||||
|
file_count=$(find "$UPLOAD_FOLDER" -type f 2>/dev/null | wc -l)
|
||||||
|
total_size=$(du -sh "$UPLOAD_FOLDER" 2>/dev/null | cut -f1)
|
||||||
|
echo " Upload folder: $UPLOAD_FOLDER"
|
||||||
|
echo " File count: $file_count"
|
||||||
|
echo " Total size: ${total_size:-0}"
|
||||||
|
|
||||||
|
if [ $file_count -gt 0 ]; then
|
||||||
|
echo -e "\n Oldest files:"
|
||||||
|
find "$UPLOAD_FOLDER" -type f -printf '%T+ %p\n' 2>/dev/null | sort | head -5
|
||||||
|
fi
|
||||||
|
else
|
||||||
|
echo " Upload folder does not exist: $UPLOAD_FOLDER"
|
||||||
|
fi
|
||||||
|
}
|
||||||
|
|
||||||
|
# Function to clean old temp files
|
||||||
|
clean_temp_files() {
|
||||||
|
echo -e "\nCleaning temporary files older than $MAX_AGE_MINUTES minutes..."
|
||||||
|
if [ -d "$UPLOAD_FOLDER" ]; then
|
||||||
|
# Count files before cleanup
|
||||||
|
before_count=$(find "$UPLOAD_FOLDER" -type f 2>/dev/null | wc -l)
|
||||||
|
|
||||||
|
# Remove old files
|
||||||
|
find "$UPLOAD_FOLDER" -type f -mmin +$MAX_AGE_MINUTES -delete 2>/dev/null
|
||||||
|
|
||||||
|
# Count files after cleanup
|
||||||
|
after_count=$(find "$UPLOAD_FOLDER" -type f 2>/dev/null | wc -l)
|
||||||
|
removed=$((before_count - after_count))
|
||||||
|
|
||||||
|
echo " Removed $removed files"
|
||||||
|
else
|
||||||
|
echo " Upload folder does not exist: $UPLOAD_FOLDER"
|
||||||
|
fi
|
||||||
|
}
|
||||||
|
|
||||||
|
# Function to setup upload folder
|
||||||
|
setup_upload_folder() {
|
||||||
|
echo -e "\nSetting up upload folder..."
|
||||||
|
if [ ! -d "$UPLOAD_FOLDER" ]; then
|
||||||
|
mkdir -p "$UPLOAD_FOLDER"
|
||||||
|
chmod 755 "$UPLOAD_FOLDER"
|
||||||
|
echo " Created: $UPLOAD_FOLDER"
|
||||||
|
else
|
||||||
|
echo " Exists: $UPLOAD_FOLDER"
|
||||||
|
fi
|
||||||
|
}
|
||||||
|
|
||||||
|
# Function to monitor in real-time
|
||||||
|
monitor_realtime() {
|
||||||
|
echo -e "\nMonitoring temporary files (Press Ctrl+C to stop)..."
|
||||||
|
while true; do
|
||||||
|
clear
|
||||||
|
echo "Talk2Me File Monitor - $(date)"
|
||||||
|
echo "================================"
|
||||||
|
show_temp_stats
|
||||||
|
check_disk_usage
|
||||||
|
sleep 5
|
||||||
|
done
|
||||||
|
}
|
||||||
|
|
||||||
|
# Main menu
|
||||||
|
case "${1:-help}" in
|
||||||
|
status)
|
||||||
|
show_temp_stats
|
||||||
|
check_disk_usage
|
||||||
|
;;
|
||||||
|
clean)
|
||||||
|
clean_temp_files
|
||||||
|
show_temp_stats
|
||||||
|
;;
|
||||||
|
setup)
|
||||||
|
setup_upload_folder
|
||||||
|
;;
|
||||||
|
monitor)
|
||||||
|
monitor_realtime
|
||||||
|
;;
|
||||||
|
all)
|
||||||
|
setup_upload_folder
|
||||||
|
clean_temp_files
|
||||||
|
show_temp_stats
|
||||||
|
check_disk_usage
|
||||||
|
;;
|
||||||
|
*)
|
||||||
|
echo "Usage: $0 {status|clean|setup|monitor|all}"
|
||||||
|
echo ""
|
||||||
|
echo "Commands:"
|
||||||
|
echo " status - Show current temp file statistics"
|
||||||
|
echo " clean - Clean old temporary files"
|
||||||
|
echo " setup - Create upload folder if needed"
|
||||||
|
echo " monitor - Real-time monitoring"
|
||||||
|
echo " all - Run setup, clean, and show status"
|
||||||
|
echo ""
|
||||||
|
echo "Environment Variables:"
|
||||||
|
echo " UPLOAD_FOLDER - Set custom upload folder (default: /tmp/talk2me_uploads)"
|
||||||
|
;;
|
||||||
|
esac
|
271
manage_secrets.py
Executable file
271
manage_secrets.py
Executable file
@ -0,0 +1,271 @@
|
|||||||
|
#!/usr/bin/env python3
|
||||||
|
"""
|
||||||
|
Secret management CLI tool for Talk2Me
|
||||||
|
|
||||||
|
Usage:
|
||||||
|
python manage_secrets.py list
|
||||||
|
python manage_secrets.py get <key>
|
||||||
|
python manage_secrets.py set <key> <value>
|
||||||
|
python manage_secrets.py rotate <key>
|
||||||
|
python manage_secrets.py delete <key>
|
||||||
|
python manage_secrets.py check-rotation
|
||||||
|
python manage_secrets.py verify
|
||||||
|
python manage_secrets.py migrate
|
||||||
|
"""
|
||||||
|
|
||||||
|
import sys
|
||||||
|
import os
|
||||||
|
import click
|
||||||
|
import getpass
|
||||||
|
from datetime import datetime
|
||||||
|
from secrets_manager import get_secrets_manager, SecretsManager
|
||||||
|
import json
|
||||||
|
|
||||||
|
# Initialize secrets manager
|
||||||
|
manager = get_secrets_manager()
|
||||||
|
|
||||||
|
@click.group()
|
||||||
|
def cli():
|
||||||
|
"""Talk2Me Secrets Management Tool"""
|
||||||
|
pass
|
||||||
|
|
||||||
|
@cli.command()
|
||||||
|
def list():
|
||||||
|
"""List all secrets (without values)"""
|
||||||
|
secrets = manager.list_secrets()
|
||||||
|
|
||||||
|
if not secrets:
|
||||||
|
click.echo("No secrets found.")
|
||||||
|
return
|
||||||
|
|
||||||
|
click.echo(f"\nFound {len(secrets)} secrets:\n")
|
||||||
|
|
||||||
|
# Format as table
|
||||||
|
click.echo(f"{'Key':<30} {'Created':<20} {'Last Rotated':<20} {'Has Value'}")
|
||||||
|
click.echo("-" * 90)
|
||||||
|
|
||||||
|
for secret in secrets:
|
||||||
|
created = secret['created'][:10] if secret['created'] else 'Unknown'
|
||||||
|
rotated = secret['rotated'][:10] if secret['rotated'] else 'Never'
|
||||||
|
has_value = '✓' if secret['has_value'] else '✗'
|
||||||
|
|
||||||
|
click.echo(f"{secret['key']:<30} {created:<20} {rotated:<20} {has_value}")
|
||||||
|
|
||||||
|
@cli.command()
|
||||||
|
@click.argument('key')
|
||||||
|
def get(key):
|
||||||
|
"""Get a secret value (requires confirmation)"""
|
||||||
|
if not click.confirm(f"Are you sure you want to display the value of '{key}'?"):
|
||||||
|
return
|
||||||
|
|
||||||
|
value = manager.get(key)
|
||||||
|
|
||||||
|
if value is None:
|
||||||
|
click.echo(f"Secret '{key}' not found.")
|
||||||
|
else:
|
||||||
|
click.echo(f"\nSecret '{key}':")
|
||||||
|
click.echo(f"Value: {value}")
|
||||||
|
|
||||||
|
# Show metadata
|
||||||
|
secrets = manager.list_secrets()
|
||||||
|
for secret in secrets:
|
||||||
|
if secret['key'] == key:
|
||||||
|
if secret.get('metadata'):
|
||||||
|
click.echo(f"Metadata: {json.dumps(secret['metadata'], indent=2)}")
|
||||||
|
break
|
||||||
|
|
||||||
|
@cli.command()
|
||||||
|
@click.argument('key')
|
||||||
|
@click.option('--value', help='Secret value (will prompt if not provided)')
|
||||||
|
@click.option('--metadata', help='JSON metadata')
|
||||||
|
def set(key, value, metadata):
|
||||||
|
"""Set a secret value"""
|
||||||
|
if not value:
|
||||||
|
value = getpass.getpass(f"Enter value for '{key}': ")
|
||||||
|
confirm = getpass.getpass(f"Confirm value for '{key}': ")
|
||||||
|
|
||||||
|
if value != confirm:
|
||||||
|
click.echo("Values do not match. Aborted.")
|
||||||
|
return
|
||||||
|
|
||||||
|
# Parse metadata if provided
|
||||||
|
metadata_dict = None
|
||||||
|
if metadata:
|
||||||
|
try:
|
||||||
|
metadata_dict = json.loads(metadata)
|
||||||
|
except json.JSONDecodeError:
|
||||||
|
click.echo("Invalid JSON metadata")
|
||||||
|
return
|
||||||
|
|
||||||
|
# Validate the secret if validator exists
|
||||||
|
if not manager.validate(key, value):
|
||||||
|
click.echo(f"Validation failed for '{key}'")
|
||||||
|
return
|
||||||
|
|
||||||
|
manager.set(key, value, metadata_dict, user='cli')
|
||||||
|
click.echo(f"Secret '{key}' set successfully.")
|
||||||
|
|
||||||
|
@cli.command()
|
||||||
|
@click.argument('key')
|
||||||
|
@click.option('--new-value', help='New secret value (will auto-generate if not provided)')
|
||||||
|
def rotate(key):
|
||||||
|
"""Rotate a secret"""
|
||||||
|
try:
|
||||||
|
if not click.confirm(f"Are you sure you want to rotate '{key}'?"):
|
||||||
|
return
|
||||||
|
|
||||||
|
old_value, new_value = manager.rotate(key, new_value, user='cli')
|
||||||
|
|
||||||
|
click.echo(f"\nSecret '{key}' rotated successfully.")
|
||||||
|
click.echo(f"New value: {new_value}")
|
||||||
|
|
||||||
|
if click.confirm("Do you want to see the old value?"):
|
||||||
|
click.echo(f"Old value: {old_value}")
|
||||||
|
|
||||||
|
except KeyError:
|
||||||
|
click.echo(f"Secret '{key}' not found.")
|
||||||
|
except ValueError as e:
|
||||||
|
click.echo(f"Error: {e}")
|
||||||
|
|
||||||
|
@cli.command()
|
||||||
|
@click.argument('key')
|
||||||
|
def delete(key):
|
||||||
|
"""Delete a secret"""
|
||||||
|
if not click.confirm(f"Are you sure you want to delete '{key}'? This cannot be undone."):
|
||||||
|
return
|
||||||
|
|
||||||
|
if manager.delete(key, user='cli'):
|
||||||
|
click.echo(f"Secret '{key}' deleted successfully.")
|
||||||
|
else:
|
||||||
|
click.echo(f"Secret '{key}' not found.")
|
||||||
|
|
||||||
|
@cli.command()
|
||||||
|
def check_rotation():
|
||||||
|
"""Check which secrets need rotation"""
|
||||||
|
needs_rotation = manager.check_rotation_needed()
|
||||||
|
|
||||||
|
if not needs_rotation:
|
||||||
|
click.echo("No secrets need rotation.")
|
||||||
|
return
|
||||||
|
|
||||||
|
click.echo(f"\n{len(needs_rotation)} secrets need rotation:")
|
||||||
|
for key in needs_rotation:
|
||||||
|
click.echo(f" - {key}")
|
||||||
|
|
||||||
|
if click.confirm("\nDo you want to rotate all of them now?"):
|
||||||
|
for key in needs_rotation:
|
||||||
|
try:
|
||||||
|
old_value, new_value = manager.rotate(key, user='cli')
|
||||||
|
click.echo(f"✓ Rotated {key}")
|
||||||
|
except Exception as e:
|
||||||
|
click.echo(f"✗ Failed to rotate {key}: {e}")
|
||||||
|
|
||||||
|
@cli.command()
|
||||||
|
def verify():
|
||||||
|
"""Verify integrity of all secrets"""
|
||||||
|
click.echo("Verifying secrets integrity...")
|
||||||
|
|
||||||
|
if manager.verify_integrity():
|
||||||
|
click.echo("✓ All secrets passed integrity check")
|
||||||
|
else:
|
||||||
|
click.echo("✗ Integrity check failed!")
|
||||||
|
click.echo("Some secrets may be corrupted. Check logs for details.")
|
||||||
|
|
||||||
|
@cli.command()
|
||||||
|
def migrate():
|
||||||
|
"""Migrate secrets from environment variables"""
|
||||||
|
click.echo("Migrating secrets from environment variables...")
|
||||||
|
|
||||||
|
# List of known secrets to migrate
|
||||||
|
secrets_to_migrate = [
|
||||||
|
('TTS_API_KEY', 'TTS API Key'),
|
||||||
|
('SECRET_KEY', 'Flask Secret Key'),
|
||||||
|
('ADMIN_TOKEN', 'Admin Token'),
|
||||||
|
('DATABASE_URL', 'Database URL'),
|
||||||
|
('REDIS_URL', 'Redis URL'),
|
||||||
|
]
|
||||||
|
|
||||||
|
migrated = 0
|
||||||
|
|
||||||
|
for env_key, description in secrets_to_migrate:
|
||||||
|
value = os.environ.get(env_key)
|
||||||
|
if value and value != manager.get(env_key):
|
||||||
|
if click.confirm(f"Migrate {description} from environment?"):
|
||||||
|
manager.set(env_key, value, {'migrated_from': 'environment'}, user='migration')
|
||||||
|
click.echo(f"✓ Migrated {env_key}")
|
||||||
|
migrated += 1
|
||||||
|
|
||||||
|
click.echo(f"\nMigrated {migrated} secrets.")
|
||||||
|
|
||||||
|
@cli.command()
|
||||||
|
@click.argument('key')
|
||||||
|
@click.argument('days', type=int)
|
||||||
|
def schedule_rotation(key, days):
|
||||||
|
"""Schedule automatic rotation for a secret"""
|
||||||
|
manager.schedule_rotation(key, days)
|
||||||
|
click.echo(f"Scheduled rotation for '{key}' every {days} days.")
|
||||||
|
|
||||||
|
@cli.command()
|
||||||
|
@click.argument('key', required=False)
|
||||||
|
@click.option('--limit', default=20, help='Number of entries to show')
|
||||||
|
def audit(key, limit):
|
||||||
|
"""Show audit log"""
|
||||||
|
logs = manager.get_audit_log(key, limit)
|
||||||
|
|
||||||
|
if not logs:
|
||||||
|
click.echo("No audit log entries found.")
|
||||||
|
return
|
||||||
|
|
||||||
|
click.echo(f"\nShowing last {len(logs)} audit log entries:\n")
|
||||||
|
|
||||||
|
for entry in logs:
|
||||||
|
timestamp = entry['timestamp'][:19] # Trim microseconds
|
||||||
|
action = entry['action'].ljust(15)
|
||||||
|
key_str = entry['key'].ljust(20)
|
||||||
|
user = entry['user']
|
||||||
|
|
||||||
|
click.echo(f"{timestamp} | {action} | {key_str} | {user}")
|
||||||
|
|
||||||
|
if entry.get('details'):
|
||||||
|
click.echo(f"{'':>20} Details: {json.dumps(entry['details'])}")
|
||||||
|
|
||||||
|
@cli.command()
|
||||||
|
def init():
|
||||||
|
"""Initialize secrets configuration"""
|
||||||
|
click.echo("Initializing Talk2Me secrets configuration...")
|
||||||
|
|
||||||
|
# Check if already initialized
|
||||||
|
if os.path.exists('.secrets.json'):
|
||||||
|
if not click.confirm(".secrets.json already exists. Overwrite?"):
|
||||||
|
return
|
||||||
|
|
||||||
|
# Generate initial secrets
|
||||||
|
import secrets as py_secrets
|
||||||
|
|
||||||
|
initial_secrets = {
|
||||||
|
'FLASK_SECRET_KEY': py_secrets.token_hex(32),
|
||||||
|
'ADMIN_TOKEN': py_secrets.token_urlsafe(32),
|
||||||
|
}
|
||||||
|
|
||||||
|
click.echo("\nGenerating initial secrets...")
|
||||||
|
|
||||||
|
for key, value in initial_secrets.items():
|
||||||
|
manager.set(key, value, {'generated': True}, user='init')
|
||||||
|
click.echo(f"✓ Generated {key}")
|
||||||
|
|
||||||
|
# Prompt for required secrets
|
||||||
|
click.echo("\nPlease provide the following secrets:")
|
||||||
|
|
||||||
|
tts_api_key = getpass.getpass("TTS API Key (press Enter to skip): ")
|
||||||
|
if tts_api_key:
|
||||||
|
manager.set('TTS_API_KEY', tts_api_key, user='init')
|
||||||
|
click.echo("✓ Set TTS_API_KEY")
|
||||||
|
|
||||||
|
click.echo("\nSecrets initialized successfully!")
|
||||||
|
click.echo("\nIMPORTANT:")
|
||||||
|
click.echo("1. Keep .secrets.json secure and never commit it to version control")
|
||||||
|
click.echo("2. Back up your master key from .master_key")
|
||||||
|
click.echo("3. Set appropriate file permissions (owner read/write only)")
|
||||||
|
|
||||||
|
if __name__ == '__main__':
|
||||||
|
cli()
|
403
memory_manager.py
Normal file
403
memory_manager.py
Normal file
@ -0,0 +1,403 @@
|
|||||||
|
# Memory management system to prevent leaks and monitor usage
|
||||||
|
import gc
|
||||||
|
import os
|
||||||
|
import psutil
|
||||||
|
import torch
|
||||||
|
import logging
|
||||||
|
import threading
|
||||||
|
import time
|
||||||
|
from typing import Dict, Optional, Callable
|
||||||
|
from dataclasses import dataclass, field
|
||||||
|
from datetime import datetime
|
||||||
|
import weakref
|
||||||
|
import tempfile
|
||||||
|
import shutil
|
||||||
|
|
||||||
|
logger = logging.getLogger(__name__)
|
||||||
|
|
||||||
|
@dataclass
|
||||||
|
class MemoryStats:
|
||||||
|
"""Current memory statistics"""
|
||||||
|
timestamp: float = field(default_factory=time.time)
|
||||||
|
process_memory_mb: float = 0.0
|
||||||
|
system_memory_percent: float = 0.0
|
||||||
|
gpu_memory_mb: float = 0.0
|
||||||
|
gpu_memory_percent: float = 0.0
|
||||||
|
temp_files_count: int = 0
|
||||||
|
temp_files_size_mb: float = 0.0
|
||||||
|
active_sessions: int = 0
|
||||||
|
gc_collections: Dict[int, int] = field(default_factory=dict)
|
||||||
|
|
||||||
|
class MemoryManager:
|
||||||
|
"""
|
||||||
|
Comprehensive memory management system to prevent leaks
|
||||||
|
"""
|
||||||
|
def __init__(self, app=None, config=None):
|
||||||
|
self.config = config or {}
|
||||||
|
self.app = app
|
||||||
|
self._cleanup_callbacks = []
|
||||||
|
self._resource_registry = weakref.WeakValueDictionary()
|
||||||
|
self._monitoring_thread = None
|
||||||
|
self._shutdown = False
|
||||||
|
|
||||||
|
# Memory thresholds
|
||||||
|
self.memory_threshold_mb = self.config.get('memory_threshold_mb', 4096) # 4GB
|
||||||
|
self.gpu_memory_threshold_mb = self.config.get('gpu_memory_threshold_mb', 2048) # 2GB
|
||||||
|
self.cleanup_interval = self.config.get('cleanup_interval', 30) # 30 seconds
|
||||||
|
|
||||||
|
# Whisper model reference
|
||||||
|
self.whisper_model = None
|
||||||
|
self.model_reload_count = 0
|
||||||
|
self.last_model_reload = time.time()
|
||||||
|
|
||||||
|
if app:
|
||||||
|
self.init_app(app)
|
||||||
|
|
||||||
|
def init_app(self, app):
|
||||||
|
"""Initialize memory management for Flask app"""
|
||||||
|
self.app = app
|
||||||
|
app.memory_manager = self
|
||||||
|
|
||||||
|
# Start monitoring thread
|
||||||
|
self._start_monitoring()
|
||||||
|
|
||||||
|
# Register cleanup on shutdown
|
||||||
|
import atexit
|
||||||
|
atexit.register(self.shutdown)
|
||||||
|
|
||||||
|
logger.info("Memory manager initialized")
|
||||||
|
|
||||||
|
def set_whisper_model(self, model):
|
||||||
|
"""Register the Whisper model for management"""
|
||||||
|
self.whisper_model = model
|
||||||
|
logger.info("Whisper model registered with memory manager")
|
||||||
|
|
||||||
|
def _start_monitoring(self):
|
||||||
|
"""Start background memory monitoring"""
|
||||||
|
self._monitoring_thread = threading.Thread(
|
||||||
|
target=self._monitor_memory,
|
||||||
|
daemon=True
|
||||||
|
)
|
||||||
|
self._monitoring_thread.start()
|
||||||
|
|
||||||
|
def _monitor_memory(self):
|
||||||
|
"""Background thread to monitor and manage memory"""
|
||||||
|
logger.info("Memory monitoring thread started")
|
||||||
|
|
||||||
|
while not self._shutdown:
|
||||||
|
try:
|
||||||
|
# Collect memory statistics
|
||||||
|
stats = self.get_memory_stats()
|
||||||
|
|
||||||
|
# Check if we need to free memory
|
||||||
|
if self._should_cleanup(stats):
|
||||||
|
logger.warning(f"Memory threshold exceeded - Process: {stats.process_memory_mb:.1f}MB, "
|
||||||
|
f"GPU: {stats.gpu_memory_mb:.1f}MB")
|
||||||
|
self.cleanup_memory(aggressive=True)
|
||||||
|
|
||||||
|
# Log stats periodically
|
||||||
|
if int(time.time()) % 300 == 0: # Every 5 minutes
|
||||||
|
logger.info(f"Memory stats - Process: {stats.process_memory_mb:.1f}MB, "
|
||||||
|
f"System: {stats.system_memory_percent:.1f}%, "
|
||||||
|
f"GPU: {stats.gpu_memory_mb:.1f}MB")
|
||||||
|
|
||||||
|
except Exception as e:
|
||||||
|
logger.error(f"Error in memory monitoring: {e}")
|
||||||
|
|
||||||
|
time.sleep(self.cleanup_interval)
|
||||||
|
|
||||||
|
def _should_cleanup(self, stats: MemoryStats) -> bool:
|
||||||
|
"""Determine if memory cleanup is needed"""
|
||||||
|
# Check process memory
|
||||||
|
if stats.process_memory_mb > self.memory_threshold_mb:
|
||||||
|
return True
|
||||||
|
|
||||||
|
# Check system memory
|
||||||
|
if stats.system_memory_percent > 85:
|
||||||
|
return True
|
||||||
|
|
||||||
|
# Check GPU memory
|
||||||
|
if stats.gpu_memory_mb > self.gpu_memory_threshold_mb:
|
||||||
|
return True
|
||||||
|
|
||||||
|
return False
|
||||||
|
|
||||||
|
def get_memory_stats(self) -> MemoryStats:
|
||||||
|
"""Get current memory statistics"""
|
||||||
|
stats = MemoryStats()
|
||||||
|
|
||||||
|
try:
|
||||||
|
# Process memory
|
||||||
|
process = psutil.Process()
|
||||||
|
memory_info = process.memory_info()
|
||||||
|
stats.process_memory_mb = memory_info.rss / 1024 / 1024
|
||||||
|
|
||||||
|
# System memory
|
||||||
|
system_memory = psutil.virtual_memory()
|
||||||
|
stats.system_memory_percent = system_memory.percent
|
||||||
|
|
||||||
|
# GPU memory if available
|
||||||
|
if torch.cuda.is_available():
|
||||||
|
stats.gpu_memory_mb = torch.cuda.memory_allocated() / 1024 / 1024
|
||||||
|
stats.gpu_memory_percent = (torch.cuda.memory_allocated() /
|
||||||
|
torch.cuda.get_device_properties(0).total_memory * 100)
|
||||||
|
|
||||||
|
# Temp files
|
||||||
|
temp_dir = self.app.config.get('UPLOAD_FOLDER', tempfile.gettempdir())
|
||||||
|
if os.path.exists(temp_dir):
|
||||||
|
temp_files = list(os.listdir(temp_dir))
|
||||||
|
stats.temp_files_count = len(temp_files)
|
||||||
|
stats.temp_files_size_mb = sum(
|
||||||
|
os.path.getsize(os.path.join(temp_dir, f))
|
||||||
|
for f in temp_files if os.path.isfile(os.path.join(temp_dir, f))
|
||||||
|
) / 1024 / 1024
|
||||||
|
|
||||||
|
# Session count
|
||||||
|
if hasattr(self.app, 'session_manager'):
|
||||||
|
stats.active_sessions = len(self.app.session_manager.sessions)
|
||||||
|
|
||||||
|
# GC stats
|
||||||
|
gc_stats = gc.get_stats()
|
||||||
|
for i, stat in enumerate(gc_stats):
|
||||||
|
if isinstance(stat, dict):
|
||||||
|
stats.gc_collections[i] = stat.get('collections', 0)
|
||||||
|
|
||||||
|
except Exception as e:
|
||||||
|
logger.error(f"Error collecting memory stats: {e}")
|
||||||
|
|
||||||
|
return stats
|
||||||
|
|
||||||
|
def cleanup_memory(self, aggressive=False):
|
||||||
|
"""Perform memory cleanup"""
|
||||||
|
logger.info(f"Starting memory cleanup (aggressive={aggressive})")
|
||||||
|
freed_mb = 0
|
||||||
|
|
||||||
|
try:
|
||||||
|
# 1. Force garbage collection
|
||||||
|
gc.collect()
|
||||||
|
if aggressive:
|
||||||
|
gc.collect(2) # Full collection
|
||||||
|
|
||||||
|
# 2. Clear GPU memory cache
|
||||||
|
if torch.cuda.is_available():
|
||||||
|
before_gpu = torch.cuda.memory_allocated() / 1024 / 1024
|
||||||
|
torch.cuda.empty_cache()
|
||||||
|
torch.cuda.synchronize()
|
||||||
|
after_gpu = torch.cuda.memory_allocated() / 1024 / 1024
|
||||||
|
freed_mb += (before_gpu - after_gpu)
|
||||||
|
logger.info(f"Freed {before_gpu - after_gpu:.1f}MB GPU memory")
|
||||||
|
|
||||||
|
# 3. Clean old temporary files
|
||||||
|
if hasattr(self.app, 'config'):
|
||||||
|
temp_dir = self.app.config.get('UPLOAD_FOLDER')
|
||||||
|
if temp_dir and os.path.exists(temp_dir):
|
||||||
|
freed_mb += self._cleanup_temp_files(temp_dir, aggressive)
|
||||||
|
|
||||||
|
# 4. Trigger session cleanup
|
||||||
|
if hasattr(self.app, 'session_manager'):
|
||||||
|
self.app.session_manager.cleanup_expired_sessions()
|
||||||
|
if aggressive:
|
||||||
|
self.app.session_manager.cleanup_idle_sessions()
|
||||||
|
|
||||||
|
# 5. Run registered cleanup callbacks
|
||||||
|
for callback in self._cleanup_callbacks:
|
||||||
|
try:
|
||||||
|
callback()
|
||||||
|
except Exception as e:
|
||||||
|
logger.error(f"Cleanup callback error: {e}")
|
||||||
|
|
||||||
|
# 6. Reload Whisper model if needed (aggressive mode only)
|
||||||
|
if aggressive and self.whisper_model and torch.cuda.is_available():
|
||||||
|
current_gpu_mb = torch.cuda.memory_allocated() / 1024 / 1024
|
||||||
|
if current_gpu_mb > self.gpu_memory_threshold_mb * 0.8:
|
||||||
|
self._reload_whisper_model()
|
||||||
|
|
||||||
|
logger.info(f"Memory cleanup completed - freed approximately {freed_mb:.1f}MB")
|
||||||
|
|
||||||
|
except Exception as e:
|
||||||
|
logger.error(f"Error during memory cleanup: {e}")
|
||||||
|
|
||||||
|
def _cleanup_temp_files(self, temp_dir: str, aggressive: bool) -> float:
|
||||||
|
"""Clean up temporary files"""
|
||||||
|
freed_mb = 0
|
||||||
|
current_time = time.time()
|
||||||
|
max_age = 300 if not aggressive else 60 # 5 minutes or 1 minute
|
||||||
|
|
||||||
|
try:
|
||||||
|
for filename in os.listdir(temp_dir):
|
||||||
|
filepath = os.path.join(temp_dir, filename)
|
||||||
|
if os.path.isfile(filepath):
|
||||||
|
file_age = current_time - os.path.getmtime(filepath)
|
||||||
|
if file_age > max_age:
|
||||||
|
file_size = os.path.getsize(filepath) / 1024 / 1024
|
||||||
|
try:
|
||||||
|
os.remove(filepath)
|
||||||
|
freed_mb += file_size
|
||||||
|
logger.debug(f"Removed old temp file: {filename}")
|
||||||
|
except Exception as e:
|
||||||
|
logger.error(f"Failed to remove {filepath}: {e}")
|
||||||
|
except Exception as e:
|
||||||
|
logger.error(f"Error cleaning temp files: {e}")
|
||||||
|
|
||||||
|
return freed_mb
|
||||||
|
|
||||||
|
def _reload_whisper_model(self):
|
||||||
|
"""Reload Whisper model to clear GPU memory fragmentation"""
|
||||||
|
if not self.whisper_model:
|
||||||
|
return
|
||||||
|
|
||||||
|
# Don't reload too frequently
|
||||||
|
if time.time() - self.last_model_reload < 300: # 5 minutes
|
||||||
|
return
|
||||||
|
|
||||||
|
try:
|
||||||
|
logger.info("Reloading Whisper model to clear GPU memory")
|
||||||
|
|
||||||
|
# Get model info
|
||||||
|
import whisper
|
||||||
|
model_size = getattr(self.whisper_model, 'model_size', 'base')
|
||||||
|
device = next(self.whisper_model.parameters()).device
|
||||||
|
|
||||||
|
# Clear the old model
|
||||||
|
del self.whisper_model
|
||||||
|
torch.cuda.empty_cache()
|
||||||
|
gc.collect()
|
||||||
|
|
||||||
|
# Reload model
|
||||||
|
self.whisper_model = whisper.load_model(model_size, device=device)
|
||||||
|
self.model_reload_count += 1
|
||||||
|
self.last_model_reload = time.time()
|
||||||
|
|
||||||
|
# Update app reference
|
||||||
|
if hasattr(self.app, 'whisper_model'):
|
||||||
|
self.app.whisper_model = self.whisper_model
|
||||||
|
|
||||||
|
logger.info(f"Whisper model reloaded successfully (reload #{self.model_reload_count})")
|
||||||
|
|
||||||
|
except Exception as e:
|
||||||
|
logger.error(f"Failed to reload Whisper model: {e}")
|
||||||
|
|
||||||
|
def register_cleanup_callback(self, callback: Callable):
|
||||||
|
"""Register a callback to be called during cleanup"""
|
||||||
|
self._cleanup_callbacks.append(callback)
|
||||||
|
|
||||||
|
def register_resource(self, resource, name: str = None):
|
||||||
|
"""Register a resource for tracking"""
|
||||||
|
if name:
|
||||||
|
self._resource_registry[name] = resource
|
||||||
|
|
||||||
|
def release_resource(self, name: str):
|
||||||
|
"""Release a tracked resource"""
|
||||||
|
if name in self._resource_registry:
|
||||||
|
del self._resource_registry[name]
|
||||||
|
|
||||||
|
def get_metrics(self) -> Dict:
|
||||||
|
"""Get memory management metrics"""
|
||||||
|
stats = self.get_memory_stats()
|
||||||
|
|
||||||
|
return {
|
||||||
|
'memory': {
|
||||||
|
'process_mb': round(stats.process_memory_mb, 1),
|
||||||
|
'system_percent': round(stats.system_memory_percent, 1),
|
||||||
|
'gpu_mb': round(stats.gpu_memory_mb, 1),
|
||||||
|
'gpu_percent': round(stats.gpu_memory_percent, 1)
|
||||||
|
},
|
||||||
|
'temp_files': {
|
||||||
|
'count': stats.temp_files_count,
|
||||||
|
'size_mb': round(stats.temp_files_size_mb, 1)
|
||||||
|
},
|
||||||
|
'sessions': {
|
||||||
|
'active': stats.active_sessions
|
||||||
|
},
|
||||||
|
'model': {
|
||||||
|
'reload_count': self.model_reload_count,
|
||||||
|
'last_reload': datetime.fromtimestamp(self.last_model_reload).isoformat()
|
||||||
|
},
|
||||||
|
'thresholds': {
|
||||||
|
'memory_mb': self.memory_threshold_mb,
|
||||||
|
'gpu_mb': self.gpu_memory_threshold_mb
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
def shutdown(self):
|
||||||
|
"""Shutdown memory manager"""
|
||||||
|
logger.info("Shutting down memory manager")
|
||||||
|
self._shutdown = True
|
||||||
|
|
||||||
|
# Final cleanup
|
||||||
|
self.cleanup_memory(aggressive=True)
|
||||||
|
|
||||||
|
# Wait for monitoring thread
|
||||||
|
if self._monitoring_thread:
|
||||||
|
self._monitoring_thread.join(timeout=5)
|
||||||
|
|
||||||
|
# Context manager for audio processing
|
||||||
|
class AudioProcessingContext:
|
||||||
|
"""Context manager to ensure audio resources are cleaned up"""
|
||||||
|
def __init__(self, memory_manager: MemoryManager, name: str = None):
|
||||||
|
self.memory_manager = memory_manager
|
||||||
|
self.name = name or f"audio_{int(time.time() * 1000)}"
|
||||||
|
self.temp_files = []
|
||||||
|
self.start_time = None
|
||||||
|
self.start_memory = None
|
||||||
|
|
||||||
|
def __enter__(self):
|
||||||
|
self.start_time = time.time()
|
||||||
|
if torch.cuda.is_available():
|
||||||
|
self.start_memory = torch.cuda.memory_allocated()
|
||||||
|
return self
|
||||||
|
|
||||||
|
def __exit__(self, exc_type, exc_val, exc_tb):
|
||||||
|
# Clean up temp files
|
||||||
|
for filepath in self.temp_files:
|
||||||
|
try:
|
||||||
|
if os.path.exists(filepath):
|
||||||
|
os.remove(filepath)
|
||||||
|
except Exception as e:
|
||||||
|
logger.error(f"Failed to remove temp file {filepath}: {e}")
|
||||||
|
|
||||||
|
# Clear GPU cache if used
|
||||||
|
if torch.cuda.is_available():
|
||||||
|
torch.cuda.empty_cache()
|
||||||
|
|
||||||
|
# Log memory usage
|
||||||
|
if self.start_memory is not None:
|
||||||
|
memory_used = torch.cuda.memory_allocated() - self.start_memory
|
||||||
|
duration = time.time() - self.start_time
|
||||||
|
logger.debug(f"Audio processing '{self.name}' - Duration: {duration:.2f}s, "
|
||||||
|
f"GPU memory: {memory_used / 1024 / 1024:.1f}MB")
|
||||||
|
|
||||||
|
# Force garbage collection if there was an error
|
||||||
|
if exc_type is not None:
|
||||||
|
gc.collect()
|
||||||
|
|
||||||
|
def add_temp_file(self, filepath: str):
|
||||||
|
"""Register a temporary file for cleanup"""
|
||||||
|
self.temp_files.append(filepath)
|
||||||
|
|
||||||
|
# Utility functions
|
||||||
|
def with_memory_management(func):
|
||||||
|
"""Decorator to add memory management to functions"""
|
||||||
|
def wrapper(*args, **kwargs):
|
||||||
|
# Get memory manager from app context
|
||||||
|
from flask import current_app
|
||||||
|
memory_manager = getattr(current_app, 'memory_manager', None)
|
||||||
|
|
||||||
|
if memory_manager:
|
||||||
|
with AudioProcessingContext(memory_manager, name=func.__name__):
|
||||||
|
return func(*args, **kwargs)
|
||||||
|
else:
|
||||||
|
return func(*args, **kwargs)
|
||||||
|
|
||||||
|
return wrapper
|
||||||
|
|
||||||
|
def init_memory_management(app, **kwargs):
|
||||||
|
"""Initialize memory management for the application"""
|
||||||
|
config = {
|
||||||
|
'memory_threshold_mb': kwargs.get('memory_threshold_mb', 4096),
|
||||||
|
'gpu_memory_threshold_mb': kwargs.get('gpu_memory_threshold_mb', 2048),
|
||||||
|
'cleanup_interval': kwargs.get('cleanup_interval', 30)
|
||||||
|
}
|
||||||
|
|
||||||
|
memory_manager = MemoryManager(app, config)
|
||||||
|
return memory_manager
|
108
nginx.conf
Normal file
108
nginx.conf
Normal file
@ -0,0 +1,108 @@
|
|||||||
|
upstream talk2me {
|
||||||
|
server talk2me:5005 fail_timeout=0;
|
||||||
|
}
|
||||||
|
|
||||||
|
server {
|
||||||
|
listen 80;
|
||||||
|
server_name _;
|
||||||
|
|
||||||
|
# Redirect to HTTPS in production
|
||||||
|
# return 301 https://$server_name$request_uri;
|
||||||
|
|
||||||
|
# Security headers
|
||||||
|
add_header X-Content-Type-Options nosniff always;
|
||||||
|
add_header X-Frame-Options DENY always;
|
||||||
|
add_header X-XSS-Protection "1; mode=block" always;
|
||||||
|
add_header Referrer-Policy "strict-origin-when-cross-origin" always;
|
||||||
|
add_header Content-Security-Policy "default-src 'self'; script-src 'self' 'unsafe-inline'; style-src 'self' 'unsafe-inline'; img-src 'self' data:; font-src 'self'; connect-src 'self'; media-src 'self';" always;
|
||||||
|
|
||||||
|
# File upload limits
|
||||||
|
client_max_body_size 50M;
|
||||||
|
client_body_buffer_size 1M;
|
||||||
|
client_body_timeout 120s;
|
||||||
|
|
||||||
|
# Timeouts
|
||||||
|
proxy_connect_timeout 120s;
|
||||||
|
proxy_send_timeout 120s;
|
||||||
|
proxy_read_timeout 120s;
|
||||||
|
send_timeout 120s;
|
||||||
|
|
||||||
|
# Gzip compression
|
||||||
|
gzip on;
|
||||||
|
gzip_vary on;
|
||||||
|
gzip_min_length 1024;
|
||||||
|
gzip_types text/plain text/css text/xml text/javascript application/x-javascript application/xml+rss application/json application/javascript;
|
||||||
|
|
||||||
|
# Static files
|
||||||
|
location /static {
|
||||||
|
alias /app/static;
|
||||||
|
expires 1y;
|
||||||
|
add_header Cache-Control "public, immutable";
|
||||||
|
|
||||||
|
# Gzip static files
|
||||||
|
gzip_static on;
|
||||||
|
}
|
||||||
|
|
||||||
|
# Service worker
|
||||||
|
location /service-worker.js {
|
||||||
|
proxy_pass http://talk2me;
|
||||||
|
proxy_set_header Host $host;
|
||||||
|
proxy_set_header X-Real-IP $remote_addr;
|
||||||
|
add_header Cache-Control "no-cache, no-store, must-revalidate";
|
||||||
|
}
|
||||||
|
|
||||||
|
# WebSocket support for future features
|
||||||
|
location /ws {
|
||||||
|
proxy_pass http://talk2me;
|
||||||
|
proxy_http_version 1.1;
|
||||||
|
proxy_set_header Upgrade $http_upgrade;
|
||||||
|
proxy_set_header Connection "upgrade";
|
||||||
|
proxy_set_header Host $host;
|
||||||
|
proxy_set_header X-Real-IP $remote_addr;
|
||||||
|
proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
|
||||||
|
proxy_set_header X-Forwarded-Proto $scheme;
|
||||||
|
|
||||||
|
# WebSocket timeouts
|
||||||
|
proxy_read_timeout 86400s;
|
||||||
|
proxy_send_timeout 86400s;
|
||||||
|
}
|
||||||
|
|
||||||
|
# Health check (don't log)
|
||||||
|
location /health {
|
||||||
|
proxy_pass http://talk2me/health;
|
||||||
|
access_log off;
|
||||||
|
proxy_set_header Host $host;
|
||||||
|
proxy_set_header X-Real-IP $remote_addr;
|
||||||
|
}
|
||||||
|
|
||||||
|
# Main application
|
||||||
|
location / {
|
||||||
|
proxy_pass http://talk2me;
|
||||||
|
proxy_redirect off;
|
||||||
|
proxy_buffering off;
|
||||||
|
|
||||||
|
proxy_set_header Host $host;
|
||||||
|
proxy_set_header X-Real-IP $remote_addr;
|
||||||
|
proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
|
||||||
|
proxy_set_header X-Forwarded-Proto $scheme;
|
||||||
|
proxy_set_header X-Forwarded-Host $server_name;
|
||||||
|
|
||||||
|
# Don't buffer responses
|
||||||
|
proxy_buffering off;
|
||||||
|
proxy_request_buffering off;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
# HTTPS configuration (uncomment for production)
|
||||||
|
# server {
|
||||||
|
# listen 443 ssl http2;
|
||||||
|
# server_name your-domain.com;
|
||||||
|
#
|
||||||
|
# ssl_certificate /etc/nginx/ssl/cert.pem;
|
||||||
|
# ssl_certificate_key /etc/nginx/ssl/key.pem;
|
||||||
|
# ssl_protocols TLSv1.2 TLSv1.3;
|
||||||
|
# ssl_ciphers ECDHE-ECDSA-AES128-GCM-SHA256:ECDHE-RSA-AES128-GCM-SHA256:ECDHE-ECDSA-AES256-GCM-SHA384:ECDHE-RSA-AES256-GCM-SHA384;
|
||||||
|
# ssl_prefer_server_ciphers off;
|
||||||
|
#
|
||||||
|
# # Include all location blocks from above
|
||||||
|
# }
|
48
package-lock.json
generated
Normal file
48
package-lock.json
generated
Normal file
@ -0,0 +1,48 @@
|
|||||||
|
{
|
||||||
|
"name": "talk2me",
|
||||||
|
"version": "1.0.0",
|
||||||
|
"lockfileVersion": 3,
|
||||||
|
"requires": true,
|
||||||
|
"packages": {
|
||||||
|
"": {
|
||||||
|
"name": "talk2me",
|
||||||
|
"version": "1.0.0",
|
||||||
|
"license": "ISC",
|
||||||
|
"devDependencies": {
|
||||||
|
"@types/node": "^20.10.0",
|
||||||
|
"typescript": "^5.3.0"
|
||||||
|
}
|
||||||
|
},
|
||||||
|
"node_modules/@types/node": {
|
||||||
|
"version": "20.17.57",
|
||||||
|
"resolved": "https://registry.npmjs.org/@types/node/-/node-20.17.57.tgz",
|
||||||
|
"integrity": "sha512-f3T4y6VU4fVQDKVqJV4Uppy8c1p/sVvS3peyqxyWnzkqXFJLRU7Y1Bl7rMS1Qe9z0v4M6McY0Fp9yBsgHJUsWQ==",
|
||||||
|
"dev": true,
|
||||||
|
"license": "MIT",
|
||||||
|
"dependencies": {
|
||||||
|
"undici-types": "~6.19.2"
|
||||||
|
}
|
||||||
|
},
|
||||||
|
"node_modules/typescript": {
|
||||||
|
"version": "5.8.3",
|
||||||
|
"resolved": "https://registry.npmjs.org/typescript/-/typescript-5.8.3.tgz",
|
||||||
|
"integrity": "sha512-p1diW6TqL9L07nNxvRMM7hMMw4c5XOo/1ibL4aAIGmSAt9slTE1Xgw5KWuof2uTOvCg9BY7ZRi+GaF+7sfgPeQ==",
|
||||||
|
"dev": true,
|
||||||
|
"license": "Apache-2.0",
|
||||||
|
"bin": {
|
||||||
|
"tsc": "bin/tsc",
|
||||||
|
"tsserver": "bin/tsserver"
|
||||||
|
},
|
||||||
|
"engines": {
|
||||||
|
"node": ">=14.17"
|
||||||
|
}
|
||||||
|
},
|
||||||
|
"node_modules/undici-types": {
|
||||||
|
"version": "6.19.8",
|
||||||
|
"resolved": "https://registry.npmjs.org/undici-types/-/undici-types-6.19.8.tgz",
|
||||||
|
"integrity": "sha512-ve2KP6f/JnbPBFyobGHuerC9g1FYGn/F8n1LWTwNxCEzd6IfqTwUQcNXgEtmmQ6DlRrC1hrSrBnCZPokRrDHjw==",
|
||||||
|
"dev": true,
|
||||||
|
"license": "MIT"
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
26
package.json
Normal file
26
package.json
Normal file
@ -0,0 +1,26 @@
|
|||||||
|
{
|
||||||
|
"name": "talk2me",
|
||||||
|
"version": "1.0.0",
|
||||||
|
"description": "Real-time voice translation web application",
|
||||||
|
"main": "index.js",
|
||||||
|
"scripts": {
|
||||||
|
"build": "tsc",
|
||||||
|
"watch": "tsc --watch",
|
||||||
|
"dev": "tsc --watch",
|
||||||
|
"clean": "rm -rf static/js/dist",
|
||||||
|
"type-check": "tsc --noEmit"
|
||||||
|
},
|
||||||
|
"keywords": [
|
||||||
|
"translation",
|
||||||
|
"voice",
|
||||||
|
"pwa",
|
||||||
|
"typescript"
|
||||||
|
],
|
||||||
|
"author": "",
|
||||||
|
"license": "ISC",
|
||||||
|
"devDependencies": {
|
||||||
|
"@types/node": "^20.10.0",
|
||||||
|
"typescript": "^5.3.0"
|
||||||
|
},
|
||||||
|
"dependencies": {}
|
||||||
|
}
|
408
rate_limiter.py
Normal file
408
rate_limiter.py
Normal file
@ -0,0 +1,408 @@
|
|||||||
|
# Rate limiting implementation for Flask
|
||||||
|
import time
|
||||||
|
import logging
|
||||||
|
from functools import wraps
|
||||||
|
from collections import defaultdict, deque
|
||||||
|
from threading import Lock
|
||||||
|
from flask import request, jsonify, g
|
||||||
|
from datetime import datetime, timedelta
|
||||||
|
import hashlib
|
||||||
|
import json
|
||||||
|
|
||||||
|
logger = logging.getLogger(__name__)
|
||||||
|
|
||||||
|
class RateLimiter:
|
||||||
|
"""
|
||||||
|
Token bucket rate limiter with sliding window and multiple strategies
|
||||||
|
"""
|
||||||
|
def __init__(self):
|
||||||
|
self.buckets = defaultdict(lambda: {
|
||||||
|
'tokens': 0,
|
||||||
|
'last_update': time.time(),
|
||||||
|
'requests': deque(maxlen=1000) # Track last 1000 requests
|
||||||
|
})
|
||||||
|
self.lock = Lock()
|
||||||
|
|
||||||
|
# Default limits (can be overridden per endpoint)
|
||||||
|
self.default_limits = {
|
||||||
|
'requests_per_minute': 30,
|
||||||
|
'requests_per_hour': 500,
|
||||||
|
'burst_size': 10,
|
||||||
|
'token_refresh_rate': 0.5 # tokens per second
|
||||||
|
}
|
||||||
|
|
||||||
|
# Endpoint-specific limits
|
||||||
|
self.endpoint_limits = {
|
||||||
|
'/transcribe': {
|
||||||
|
'requests_per_minute': 10,
|
||||||
|
'requests_per_hour': 100,
|
||||||
|
'burst_size': 3,
|
||||||
|
'token_refresh_rate': 0.167, # 1 token per 6 seconds
|
||||||
|
'max_request_size': 10 * 1024 * 1024 # 10MB
|
||||||
|
},
|
||||||
|
'/translate': {
|
||||||
|
'requests_per_minute': 20,
|
||||||
|
'requests_per_hour': 300,
|
||||||
|
'burst_size': 5,
|
||||||
|
'token_refresh_rate': 0.333, # 1 token per 3 seconds
|
||||||
|
'max_request_size': 100 * 1024 # 100KB
|
||||||
|
},
|
||||||
|
'/translate/stream': {
|
||||||
|
'requests_per_minute': 10,
|
||||||
|
'requests_per_hour': 150,
|
||||||
|
'burst_size': 3,
|
||||||
|
'token_refresh_rate': 0.167,
|
||||||
|
'max_request_size': 100 * 1024 # 100KB
|
||||||
|
},
|
||||||
|
'/speak': {
|
||||||
|
'requests_per_minute': 15,
|
||||||
|
'requests_per_hour': 200,
|
||||||
|
'burst_size': 3,
|
||||||
|
'token_refresh_rate': 0.25, # 1 token per 4 seconds
|
||||||
|
'max_request_size': 50 * 1024 # 50KB
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
# IP-based blocking
|
||||||
|
self.blocked_ips = set()
|
||||||
|
self.temp_blocked_ips = {} # IP -> unblock_time
|
||||||
|
|
||||||
|
# Global limits
|
||||||
|
self.global_limits = {
|
||||||
|
'total_requests_per_minute': 1000,
|
||||||
|
'total_requests_per_hour': 10000,
|
||||||
|
'concurrent_requests': 50
|
||||||
|
}
|
||||||
|
self.global_requests = deque(maxlen=10000)
|
||||||
|
self.concurrent_requests = 0
|
||||||
|
|
||||||
|
def get_client_id(self, request):
|
||||||
|
"""Get unique client identifier"""
|
||||||
|
# Use IP address + user agent for better identification
|
||||||
|
ip = request.remote_addr or 'unknown'
|
||||||
|
user_agent = request.headers.get('User-Agent', '')
|
||||||
|
|
||||||
|
# Handle proxied requests
|
||||||
|
forwarded_for = request.headers.get('X-Forwarded-For')
|
||||||
|
if forwarded_for:
|
||||||
|
ip = forwarded_for.split(',')[0].strip()
|
||||||
|
|
||||||
|
# Create unique identifier
|
||||||
|
identifier = f"{ip}:{user_agent}"
|
||||||
|
return hashlib.md5(identifier.encode()).hexdigest()
|
||||||
|
|
||||||
|
def get_limits(self, endpoint):
|
||||||
|
"""Get rate limits for endpoint"""
|
||||||
|
return self.endpoint_limits.get(endpoint, self.default_limits)
|
||||||
|
|
||||||
|
def is_ip_blocked(self, ip):
|
||||||
|
"""Check if IP is blocked"""
|
||||||
|
# Check permanent blocks
|
||||||
|
if ip in self.blocked_ips:
|
||||||
|
return True
|
||||||
|
|
||||||
|
# Check temporary blocks
|
||||||
|
if ip in self.temp_blocked_ips:
|
||||||
|
if time.time() < self.temp_blocked_ips[ip]:
|
||||||
|
return True
|
||||||
|
else:
|
||||||
|
# Unblock if time expired
|
||||||
|
del self.temp_blocked_ips[ip]
|
||||||
|
|
||||||
|
return False
|
||||||
|
|
||||||
|
def block_ip_temporarily(self, ip, duration=3600):
|
||||||
|
"""Block IP temporarily (default 1 hour)"""
|
||||||
|
self.temp_blocked_ips[ip] = time.time() + duration
|
||||||
|
logger.warning(f"IP {ip} temporarily blocked for {duration} seconds")
|
||||||
|
|
||||||
|
def check_global_limits(self):
|
||||||
|
"""Check global rate limits"""
|
||||||
|
now = time.time()
|
||||||
|
|
||||||
|
# Clean old requests
|
||||||
|
minute_ago = now - 60
|
||||||
|
hour_ago = now - 3600
|
||||||
|
|
||||||
|
self.global_requests = deque(
|
||||||
|
(t for t in self.global_requests if t > hour_ago),
|
||||||
|
maxlen=10000
|
||||||
|
)
|
||||||
|
|
||||||
|
# Count requests
|
||||||
|
requests_last_minute = sum(1 for t in self.global_requests if t > minute_ago)
|
||||||
|
requests_last_hour = len(self.global_requests)
|
||||||
|
|
||||||
|
# Check limits
|
||||||
|
if requests_last_minute >= self.global_limits['total_requests_per_minute']:
|
||||||
|
return False, "Global rate limit exceeded (per minute)"
|
||||||
|
|
||||||
|
if requests_last_hour >= self.global_limits['total_requests_per_hour']:
|
||||||
|
return False, "Global rate limit exceeded (per hour)"
|
||||||
|
|
||||||
|
if self.concurrent_requests >= self.global_limits['concurrent_requests']:
|
||||||
|
return False, "Too many concurrent requests"
|
||||||
|
|
||||||
|
return True, None
|
||||||
|
|
||||||
|
def check_rate_limit(self, client_id, endpoint, request_size=0):
|
||||||
|
"""Check if request should be allowed"""
|
||||||
|
with self.lock:
|
||||||
|
# Check global limits first
|
||||||
|
global_ok, global_msg = self.check_global_limits()
|
||||||
|
if not global_ok:
|
||||||
|
return False, global_msg, None
|
||||||
|
|
||||||
|
# Get limits for endpoint
|
||||||
|
limits = self.get_limits(endpoint)
|
||||||
|
|
||||||
|
# Check request size if applicable
|
||||||
|
if request_size > 0 and 'max_request_size' in limits:
|
||||||
|
if request_size > limits['max_request_size']:
|
||||||
|
return False, "Request too large", None
|
||||||
|
|
||||||
|
# Get or create bucket
|
||||||
|
bucket = self.buckets[client_id]
|
||||||
|
now = time.time()
|
||||||
|
|
||||||
|
# Update tokens based on time passed
|
||||||
|
time_passed = now - bucket['last_update']
|
||||||
|
new_tokens = time_passed * limits['token_refresh_rate']
|
||||||
|
bucket['tokens'] = min(
|
||||||
|
limits['burst_size'],
|
||||||
|
bucket['tokens'] + new_tokens
|
||||||
|
)
|
||||||
|
bucket['last_update'] = now
|
||||||
|
|
||||||
|
# Clean old requests from sliding window
|
||||||
|
minute_ago = now - 60
|
||||||
|
hour_ago = now - 3600
|
||||||
|
bucket['requests'] = deque(
|
||||||
|
(t for t in bucket['requests'] if t > hour_ago),
|
||||||
|
maxlen=1000
|
||||||
|
)
|
||||||
|
|
||||||
|
# Count requests in windows
|
||||||
|
requests_last_minute = sum(1 for t in bucket['requests'] if t > minute_ago)
|
||||||
|
requests_last_hour = len(bucket['requests'])
|
||||||
|
|
||||||
|
# Check sliding window limits
|
||||||
|
if requests_last_minute >= limits['requests_per_minute']:
|
||||||
|
return False, "Rate limit exceeded (per minute)", {
|
||||||
|
'retry_after': 60,
|
||||||
|
'limit': limits['requests_per_minute'],
|
||||||
|
'remaining': 0,
|
||||||
|
'reset': int(minute_ago + 60)
|
||||||
|
}
|
||||||
|
|
||||||
|
if requests_last_hour >= limits['requests_per_hour']:
|
||||||
|
return False, "Rate limit exceeded (per hour)", {
|
||||||
|
'retry_after': 3600,
|
||||||
|
'limit': limits['requests_per_hour'],
|
||||||
|
'remaining': 0,
|
||||||
|
'reset': int(hour_ago + 3600)
|
||||||
|
}
|
||||||
|
|
||||||
|
# Check token bucket
|
||||||
|
if bucket['tokens'] < 1:
|
||||||
|
retry_after = int(1 / limits['token_refresh_rate'])
|
||||||
|
return False, "Rate limit exceeded (burst)", {
|
||||||
|
'retry_after': retry_after,
|
||||||
|
'limit': limits['burst_size'],
|
||||||
|
'remaining': 0,
|
||||||
|
'reset': int(now + retry_after)
|
||||||
|
}
|
||||||
|
|
||||||
|
# Request allowed - consume token and record
|
||||||
|
bucket['tokens'] -= 1
|
||||||
|
bucket['requests'].append(now)
|
||||||
|
self.global_requests.append(now)
|
||||||
|
|
||||||
|
# Calculate remaining
|
||||||
|
remaining_minute = limits['requests_per_minute'] - requests_last_minute - 1
|
||||||
|
remaining_hour = limits['requests_per_hour'] - requests_last_hour - 1
|
||||||
|
|
||||||
|
return True, None, {
|
||||||
|
'limit': limits['requests_per_minute'],
|
||||||
|
'remaining': remaining_minute,
|
||||||
|
'reset': int(minute_ago + 60)
|
||||||
|
}
|
||||||
|
|
||||||
|
def increment_concurrent(self):
|
||||||
|
"""Increment concurrent request counter"""
|
||||||
|
with self.lock:
|
||||||
|
self.concurrent_requests += 1
|
||||||
|
|
||||||
|
def decrement_concurrent(self):
|
||||||
|
"""Decrement concurrent request counter"""
|
||||||
|
with self.lock:
|
||||||
|
self.concurrent_requests = max(0, self.concurrent_requests - 1)
|
||||||
|
|
||||||
|
def get_client_stats(self, client_id):
|
||||||
|
"""Get statistics for a client"""
|
||||||
|
with self.lock:
|
||||||
|
if client_id not in self.buckets:
|
||||||
|
return None
|
||||||
|
|
||||||
|
bucket = self.buckets[client_id]
|
||||||
|
now = time.time()
|
||||||
|
minute_ago = now - 60
|
||||||
|
hour_ago = now - 3600
|
||||||
|
|
||||||
|
requests_last_minute = sum(1 for t in bucket['requests'] if t > minute_ago)
|
||||||
|
requests_last_hour = len([t for t in bucket['requests'] if t > hour_ago])
|
||||||
|
|
||||||
|
return {
|
||||||
|
'requests_last_minute': requests_last_minute,
|
||||||
|
'requests_last_hour': requests_last_hour,
|
||||||
|
'tokens_available': bucket['tokens'],
|
||||||
|
'last_request': bucket['last_update']
|
||||||
|
}
|
||||||
|
|
||||||
|
def cleanup_old_buckets(self, max_age=86400):
|
||||||
|
"""Clean up old unused buckets (default 24 hours)"""
|
||||||
|
with self.lock:
|
||||||
|
now = time.time()
|
||||||
|
to_remove = []
|
||||||
|
|
||||||
|
for client_id, bucket in self.buckets.items():
|
||||||
|
if now - bucket['last_update'] > max_age:
|
||||||
|
to_remove.append(client_id)
|
||||||
|
|
||||||
|
for client_id in to_remove:
|
||||||
|
del self.buckets[client_id]
|
||||||
|
|
||||||
|
if to_remove:
|
||||||
|
logger.info(f"Cleaned up {len(to_remove)} old rate limit buckets")
|
||||||
|
|
||||||
|
# Global rate limiter instance
|
||||||
|
rate_limiter = RateLimiter()
|
||||||
|
|
||||||
|
def rate_limit(endpoint=None,
|
||||||
|
requests_per_minute=None,
|
||||||
|
requests_per_hour=None,
|
||||||
|
burst_size=None,
|
||||||
|
check_size=False):
|
||||||
|
"""
|
||||||
|
Rate limiting decorator for Flask routes
|
||||||
|
|
||||||
|
Usage:
|
||||||
|
@app.route('/api/endpoint')
|
||||||
|
@rate_limit(requests_per_minute=10, check_size=True)
|
||||||
|
def endpoint():
|
||||||
|
return jsonify({'status': 'ok'})
|
||||||
|
"""
|
||||||
|
def decorator(f):
|
||||||
|
@wraps(f)
|
||||||
|
def decorated_function(*args, **kwargs):
|
||||||
|
# Get client ID
|
||||||
|
client_id = rate_limiter.get_client_id(request)
|
||||||
|
ip = request.remote_addr
|
||||||
|
|
||||||
|
# Check if IP is blocked
|
||||||
|
if rate_limiter.is_ip_blocked(ip):
|
||||||
|
return jsonify({
|
||||||
|
'error': 'IP temporarily blocked due to excessive requests'
|
||||||
|
}), 429
|
||||||
|
|
||||||
|
# Get endpoint
|
||||||
|
endpoint_path = endpoint or request.endpoint
|
||||||
|
|
||||||
|
# Override default limits if specified
|
||||||
|
if any([requests_per_minute, requests_per_hour, burst_size]):
|
||||||
|
limits = rate_limiter.get_limits(endpoint_path).copy()
|
||||||
|
if requests_per_minute:
|
||||||
|
limits['requests_per_minute'] = requests_per_minute
|
||||||
|
if requests_per_hour:
|
||||||
|
limits['requests_per_hour'] = requests_per_hour
|
||||||
|
if burst_size:
|
||||||
|
limits['burst_size'] = burst_size
|
||||||
|
rate_limiter.endpoint_limits[endpoint_path] = limits
|
||||||
|
|
||||||
|
# Check request size if needed
|
||||||
|
request_size = 0
|
||||||
|
if check_size:
|
||||||
|
request_size = request.content_length or 0
|
||||||
|
|
||||||
|
# Check rate limit
|
||||||
|
allowed, message, headers = rate_limiter.check_rate_limit(
|
||||||
|
client_id, endpoint_path, request_size
|
||||||
|
)
|
||||||
|
|
||||||
|
if not allowed:
|
||||||
|
# Log excessive requests
|
||||||
|
logger.warning(f"Rate limit exceeded for {client_id} on {endpoint_path}: {message}")
|
||||||
|
|
||||||
|
# Check if we should temporarily block this IP
|
||||||
|
stats = rate_limiter.get_client_stats(client_id)
|
||||||
|
if stats and stats['requests_last_minute'] > 100:
|
||||||
|
rate_limiter.block_ip_temporarily(ip, 3600) # 1 hour block
|
||||||
|
|
||||||
|
response = jsonify({
|
||||||
|
'error': message,
|
||||||
|
'retry_after': headers.get('retry_after') if headers else 60
|
||||||
|
})
|
||||||
|
response.status_code = 429
|
||||||
|
|
||||||
|
# Add rate limit headers
|
||||||
|
if headers:
|
||||||
|
response.headers['X-RateLimit-Limit'] = str(headers['limit'])
|
||||||
|
response.headers['X-RateLimit-Remaining'] = str(headers['remaining'])
|
||||||
|
response.headers['X-RateLimit-Reset'] = str(headers['reset'])
|
||||||
|
response.headers['Retry-After'] = str(headers['retry_after'])
|
||||||
|
|
||||||
|
return response
|
||||||
|
|
||||||
|
# Track concurrent requests
|
||||||
|
rate_limiter.increment_concurrent()
|
||||||
|
|
||||||
|
try:
|
||||||
|
# Add rate limit info to response
|
||||||
|
g.rate_limit_headers = headers
|
||||||
|
response = f(*args, **kwargs)
|
||||||
|
|
||||||
|
# Add headers to successful response
|
||||||
|
if headers and hasattr(response, 'headers'):
|
||||||
|
response.headers['X-RateLimit-Limit'] = str(headers['limit'])
|
||||||
|
response.headers['X-RateLimit-Remaining'] = str(headers['remaining'])
|
||||||
|
response.headers['X-RateLimit-Reset'] = str(headers['reset'])
|
||||||
|
|
||||||
|
return response
|
||||||
|
finally:
|
||||||
|
rate_limiter.decrement_concurrent()
|
||||||
|
|
||||||
|
return decorated_function
|
||||||
|
return decorator
|
||||||
|
|
||||||
|
def cleanup_rate_limiter():
|
||||||
|
"""Cleanup function to be called periodically"""
|
||||||
|
rate_limiter.cleanup_old_buckets()
|
||||||
|
|
||||||
|
# IP whitelist/blacklist management
|
||||||
|
class IPFilter:
|
||||||
|
def __init__(self):
|
||||||
|
self.whitelist = set()
|
||||||
|
self.blacklist = set()
|
||||||
|
|
||||||
|
def add_to_whitelist(self, ip):
|
||||||
|
self.whitelist.add(ip)
|
||||||
|
self.blacklist.discard(ip)
|
||||||
|
|
||||||
|
def add_to_blacklist(self, ip):
|
||||||
|
self.blacklist.add(ip)
|
||||||
|
self.whitelist.discard(ip)
|
||||||
|
|
||||||
|
def is_allowed(self, ip):
|
||||||
|
if ip in self.blacklist:
|
||||||
|
return False
|
||||||
|
if self.whitelist and ip not in self.whitelist:
|
||||||
|
return False
|
||||||
|
return True
|
||||||
|
|
||||||
|
ip_filter = IPFilter()
|
||||||
|
|
||||||
|
def ip_filter_check():
|
||||||
|
"""Middleware to check IP filtering"""
|
||||||
|
ip = request.remote_addr
|
||||||
|
if not ip_filter.is_allowed(ip):
|
||||||
|
return jsonify({'error': 'Access denied'}), 403
|
302
request_size_limiter.py
Normal file
302
request_size_limiter.py
Normal file
@ -0,0 +1,302 @@
|
|||||||
|
# Request size limiting middleware for preventing memory exhaustion
|
||||||
|
import logging
|
||||||
|
from functools import wraps
|
||||||
|
from flask import request, jsonify, current_app
|
||||||
|
import os
|
||||||
|
|
||||||
|
logger = logging.getLogger(__name__)
|
||||||
|
|
||||||
|
# Default size limits (in bytes)
|
||||||
|
DEFAULT_LIMITS = {
|
||||||
|
'max_content_length': 50 * 1024 * 1024, # 50MB global max
|
||||||
|
'max_audio_size': 25 * 1024 * 1024, # 25MB for audio files
|
||||||
|
'max_json_size': 1 * 1024 * 1024, # 1MB for JSON payloads
|
||||||
|
'max_image_size': 10 * 1024 * 1024, # 10MB for images
|
||||||
|
'max_chunk_size': 1 * 1024 * 1024, # 1MB chunks for streaming
|
||||||
|
}
|
||||||
|
|
||||||
|
# File extension to MIME type mapping
|
||||||
|
AUDIO_EXTENSIONS = {'.wav', '.mp3', '.ogg', '.webm', '.m4a', '.flac', '.aac'}
|
||||||
|
IMAGE_EXTENSIONS = {'.jpg', '.jpeg', '.png', '.gif', '.webp', '.bmp'}
|
||||||
|
|
||||||
|
class RequestSizeLimiter:
|
||||||
|
"""
|
||||||
|
Middleware to enforce request size limits and prevent memory exhaustion
|
||||||
|
"""
|
||||||
|
def __init__(self, app=None, config=None):
|
||||||
|
self.config = config or {}
|
||||||
|
self.limits = {**DEFAULT_LIMITS, **self.config}
|
||||||
|
|
||||||
|
if app:
|
||||||
|
self.init_app(app)
|
||||||
|
|
||||||
|
def init_app(self, app):
|
||||||
|
"""Initialize the Flask application with size limiting"""
|
||||||
|
# Set Flask's MAX_CONTENT_LENGTH
|
||||||
|
app.config['MAX_CONTENT_LENGTH'] = self.limits['max_content_length']
|
||||||
|
|
||||||
|
# Store limiter in app
|
||||||
|
app.request_size_limiter = self
|
||||||
|
|
||||||
|
# Add before_request handler
|
||||||
|
app.before_request(self.check_request_size)
|
||||||
|
|
||||||
|
# Add error handler for 413 Request Entity Too Large
|
||||||
|
app.register_error_handler(413, self.handle_413)
|
||||||
|
|
||||||
|
logger.info(f"Request size limiter initialized with max content length: {self.limits['max_content_length'] / 1024 / 1024:.1f}MB")
|
||||||
|
|
||||||
|
def check_request_size(self):
|
||||||
|
"""Check request size before processing"""
|
||||||
|
# Skip size check for GET, HEAD, OPTIONS
|
||||||
|
if request.method in ('GET', 'HEAD', 'OPTIONS'):
|
||||||
|
return None
|
||||||
|
|
||||||
|
# Get content length
|
||||||
|
content_length = request.content_length
|
||||||
|
|
||||||
|
if content_length is None:
|
||||||
|
# No content-length header, check for chunked encoding
|
||||||
|
if request.headers.get('Transfer-Encoding') == 'chunked':
|
||||||
|
logger.warning(f"Chunked request from {request.remote_addr} to {request.endpoint}")
|
||||||
|
# For chunked requests, we'll need to monitor the stream
|
||||||
|
return None
|
||||||
|
else:
|
||||||
|
# No content, allow it
|
||||||
|
return None
|
||||||
|
|
||||||
|
# Check against global limit
|
||||||
|
if content_length > self.limits['max_content_length']:
|
||||||
|
logger.warning(f"Request from {request.remote_addr} exceeds global limit: {content_length} bytes")
|
||||||
|
return jsonify({
|
||||||
|
'error': 'Request too large',
|
||||||
|
'max_size': self.limits['max_content_length'],
|
||||||
|
'your_size': content_length
|
||||||
|
}), 413
|
||||||
|
|
||||||
|
# Check endpoint-specific limits
|
||||||
|
endpoint = request.endpoint
|
||||||
|
if endpoint:
|
||||||
|
endpoint_limit = self.get_endpoint_limit(endpoint)
|
||||||
|
if endpoint_limit and content_length > endpoint_limit:
|
||||||
|
logger.warning(f"Request from {request.remote_addr} to {endpoint} exceeds endpoint limit: {content_length} bytes")
|
||||||
|
return jsonify({
|
||||||
|
'error': f'Request too large for {endpoint}',
|
||||||
|
'max_size': endpoint_limit,
|
||||||
|
'your_size': content_length
|
||||||
|
}), 413
|
||||||
|
|
||||||
|
# Check file-specific limits
|
||||||
|
if request.files:
|
||||||
|
for file_key, file_obj in request.files.items():
|
||||||
|
# Check file size
|
||||||
|
file_obj.seek(0, os.SEEK_END)
|
||||||
|
file_size = file_obj.tell()
|
||||||
|
file_obj.seek(0) # Reset position
|
||||||
|
|
||||||
|
# Determine file type
|
||||||
|
filename = file_obj.filename or ''
|
||||||
|
file_ext = os.path.splitext(filename)[1].lower()
|
||||||
|
|
||||||
|
# Apply type-specific limits
|
||||||
|
if file_ext in AUDIO_EXTENSIONS:
|
||||||
|
max_size = self.limits.get('max_audio_size', self.limits['max_content_length'])
|
||||||
|
if file_size > max_size:
|
||||||
|
logger.warning(f"Audio file from {request.remote_addr} exceeds limit: {file_size} bytes")
|
||||||
|
return jsonify({
|
||||||
|
'error': 'Audio file too large',
|
||||||
|
'max_size': max_size,
|
||||||
|
'your_size': file_size,
|
||||||
|
'max_size_mb': round(max_size / 1024 / 1024, 1)
|
||||||
|
}), 413
|
||||||
|
|
||||||
|
elif file_ext in IMAGE_EXTENSIONS:
|
||||||
|
max_size = self.limits.get('max_image_size', self.limits['max_content_length'])
|
||||||
|
if file_size > max_size:
|
||||||
|
logger.warning(f"Image file from {request.remote_addr} exceeds limit: {file_size} bytes")
|
||||||
|
return jsonify({
|
||||||
|
'error': 'Image file too large',
|
||||||
|
'max_size': max_size,
|
||||||
|
'your_size': file_size,
|
||||||
|
'max_size_mb': round(max_size / 1024 / 1024, 1)
|
||||||
|
}), 413
|
||||||
|
|
||||||
|
# Check JSON payload size
|
||||||
|
if request.is_json:
|
||||||
|
try:
|
||||||
|
# Get raw data size
|
||||||
|
data_size = len(request.get_data())
|
||||||
|
max_json = self.limits.get('max_json_size', self.limits['max_content_length'])
|
||||||
|
|
||||||
|
if data_size > max_json:
|
||||||
|
logger.warning(f"JSON payload from {request.remote_addr} exceeds limit: {data_size} bytes")
|
||||||
|
return jsonify({
|
||||||
|
'error': 'JSON payload too large',
|
||||||
|
'max_size': max_json,
|
||||||
|
'your_size': data_size,
|
||||||
|
'max_size_kb': round(max_json / 1024, 1)
|
||||||
|
}), 413
|
||||||
|
except Exception as e:
|
||||||
|
logger.error(f"Error checking JSON size: {e}")
|
||||||
|
|
||||||
|
return None
|
||||||
|
|
||||||
|
def get_endpoint_limit(self, endpoint):
|
||||||
|
"""Get size limit for specific endpoint"""
|
||||||
|
endpoint_limits = {
|
||||||
|
'transcribe': self.limits.get('max_audio_size', 25 * 1024 * 1024),
|
||||||
|
'speak': self.limits.get('max_json_size', 1 * 1024 * 1024),
|
||||||
|
'translate': self.limits.get('max_json_size', 1 * 1024 * 1024),
|
||||||
|
'translate_stream': self.limits.get('max_json_size', 1 * 1024 * 1024),
|
||||||
|
}
|
||||||
|
return endpoint_limits.get(endpoint)
|
||||||
|
|
||||||
|
def handle_413(self, error):
|
||||||
|
"""Handle 413 Request Entity Too Large errors"""
|
||||||
|
logger.warning(f"413 error from {request.remote_addr}: {error}")
|
||||||
|
return jsonify({
|
||||||
|
'error': 'Request entity too large',
|
||||||
|
'message': 'The request payload is too large. Please reduce the size and try again.',
|
||||||
|
'max_size': self.limits['max_content_length'],
|
||||||
|
'max_size_mb': round(self.limits['max_content_length'] / 1024 / 1024, 1)
|
||||||
|
}), 413
|
||||||
|
|
||||||
|
def update_limits(self, **kwargs):
|
||||||
|
"""Update size limits dynamically"""
|
||||||
|
old_limits = self.limits.copy()
|
||||||
|
self.limits.update(kwargs)
|
||||||
|
|
||||||
|
# Update Flask's MAX_CONTENT_LENGTH if changed
|
||||||
|
if 'max_content_length' in kwargs and current_app:
|
||||||
|
current_app.config['MAX_CONTENT_LENGTH'] = kwargs['max_content_length']
|
||||||
|
|
||||||
|
logger.info(f"Updated size limits: {kwargs}")
|
||||||
|
return old_limits
|
||||||
|
|
||||||
|
def limit_request_size(**limit_kwargs):
|
||||||
|
"""
|
||||||
|
Decorator to apply custom size limits to specific routes
|
||||||
|
|
||||||
|
Usage:
|
||||||
|
@app.route('/upload')
|
||||||
|
@limit_request_size(max_size=10*1024*1024) # 10MB limit
|
||||||
|
def upload():
|
||||||
|
...
|
||||||
|
"""
|
||||||
|
def decorator(f):
|
||||||
|
@wraps(f)
|
||||||
|
def wrapper(*args, **kwargs):
|
||||||
|
# Check content length
|
||||||
|
content_length = request.content_length
|
||||||
|
max_size = limit_kwargs.get('max_size', DEFAULT_LIMITS['max_content_length'])
|
||||||
|
|
||||||
|
if content_length and content_length > max_size:
|
||||||
|
logger.warning(f"Request to {request.endpoint} exceeds custom limit: {content_length} bytes")
|
||||||
|
return jsonify({
|
||||||
|
'error': 'Request too large',
|
||||||
|
'max_size': max_size,
|
||||||
|
'your_size': content_length,
|
||||||
|
'max_size_mb': round(max_size / 1024 / 1024, 1)
|
||||||
|
}), 413
|
||||||
|
|
||||||
|
# Check specific file types if specified
|
||||||
|
if 'max_audio_size' in limit_kwargs and request.files:
|
||||||
|
for file_obj in request.files.values():
|
||||||
|
if file_obj.filename:
|
||||||
|
ext = os.path.splitext(file_obj.filename)[1].lower()
|
||||||
|
if ext in AUDIO_EXTENSIONS:
|
||||||
|
file_obj.seek(0, os.SEEK_END)
|
||||||
|
file_size = file_obj.tell()
|
||||||
|
file_obj.seek(0)
|
||||||
|
|
||||||
|
if file_size > limit_kwargs['max_audio_size']:
|
||||||
|
return jsonify({
|
||||||
|
'error': 'Audio file too large',
|
||||||
|
'max_size': limit_kwargs['max_audio_size'],
|
||||||
|
'your_size': file_size,
|
||||||
|
'max_size_mb': round(limit_kwargs['max_audio_size'] / 1024 / 1024, 1)
|
||||||
|
}), 413
|
||||||
|
|
||||||
|
return f(*args, **kwargs)
|
||||||
|
return wrapper
|
||||||
|
return decorator
|
||||||
|
|
||||||
|
class StreamSizeLimiter:
|
||||||
|
"""
|
||||||
|
Helper class to limit streaming request sizes
|
||||||
|
"""
|
||||||
|
def __init__(self, stream, max_size):
|
||||||
|
self.stream = stream
|
||||||
|
self.max_size = max_size
|
||||||
|
self.bytes_read = 0
|
||||||
|
|
||||||
|
def read(self, size=-1):
|
||||||
|
"""Read from stream with size limit enforcement"""
|
||||||
|
if size == -1:
|
||||||
|
# Read all remaining, but respect limit
|
||||||
|
size = self.max_size - self.bytes_read
|
||||||
|
|
||||||
|
# Check if we would exceed limit
|
||||||
|
if self.bytes_read + size > self.max_size:
|
||||||
|
raise ValueError(f"Stream size exceeds limit of {self.max_size} bytes")
|
||||||
|
|
||||||
|
data = self.stream.read(size)
|
||||||
|
self.bytes_read += len(data)
|
||||||
|
|
||||||
|
return data
|
||||||
|
|
||||||
|
def readline(self, size=-1):
|
||||||
|
"""Read line from stream with size limit enforcement"""
|
||||||
|
if size == -1:
|
||||||
|
size = self.max_size - self.bytes_read
|
||||||
|
|
||||||
|
if self.bytes_read + size > self.max_size:
|
||||||
|
raise ValueError(f"Stream size exceeds limit of {self.max_size} bytes")
|
||||||
|
|
||||||
|
line = self.stream.readline(size)
|
||||||
|
self.bytes_read += len(line)
|
||||||
|
|
||||||
|
return line
|
||||||
|
|
||||||
|
# Utility functions
|
||||||
|
def get_request_size():
|
||||||
|
"""Get the size of the current request"""
|
||||||
|
if request.content_length:
|
||||||
|
return request.content_length
|
||||||
|
|
||||||
|
# For chunked requests, read and measure
|
||||||
|
try:
|
||||||
|
data = request.get_data()
|
||||||
|
return len(data)
|
||||||
|
except Exception:
|
||||||
|
return 0
|
||||||
|
|
||||||
|
def format_size(size_bytes):
|
||||||
|
"""Format size in human-readable format"""
|
||||||
|
for unit in ['B', 'KB', 'MB', 'GB']:
|
||||||
|
if size_bytes < 1024.0:
|
||||||
|
return f"{size_bytes:.1f} {unit}"
|
||||||
|
size_bytes /= 1024.0
|
||||||
|
return f"{size_bytes:.1f} TB"
|
||||||
|
|
||||||
|
# Configuration helper
|
||||||
|
def configure_size_limits(app, **kwargs):
|
||||||
|
"""
|
||||||
|
Configure size limits for the application
|
||||||
|
|
||||||
|
Args:
|
||||||
|
app: Flask application
|
||||||
|
max_content_length: Global maximum request size
|
||||||
|
max_audio_size: Maximum audio file size
|
||||||
|
max_json_size: Maximum JSON payload size
|
||||||
|
max_image_size: Maximum image file size
|
||||||
|
"""
|
||||||
|
config = {
|
||||||
|
'max_content_length': kwargs.get('max_content_length', DEFAULT_LIMITS['max_content_length']),
|
||||||
|
'max_audio_size': kwargs.get('max_audio_size', DEFAULT_LIMITS['max_audio_size']),
|
||||||
|
'max_json_size': kwargs.get('max_json_size', DEFAULT_LIMITS['max_json_size']),
|
||||||
|
'max_image_size': kwargs.get('max_image_size', DEFAULT_LIMITS['max_image_size']),
|
||||||
|
}
|
||||||
|
|
||||||
|
limiter = RequestSizeLimiter(app, config)
|
||||||
|
return limiter
|
27
requirements-prod.txt
Normal file
27
requirements-prod.txt
Normal file
@ -0,0 +1,27 @@
|
|||||||
|
# Production requirements for Talk2Me
|
||||||
|
# Includes base requirements plus production WSGI server
|
||||||
|
|
||||||
|
# Include base requirements
|
||||||
|
-r requirements.txt
|
||||||
|
|
||||||
|
# Production WSGI server
|
||||||
|
gunicorn==21.2.0
|
||||||
|
|
||||||
|
# Async workers (optional, for better concurrency)
|
||||||
|
gevent==23.9.1
|
||||||
|
greenlet==3.0.1
|
||||||
|
|
||||||
|
# Production monitoring
|
||||||
|
prometheus-client==0.19.0
|
||||||
|
|
||||||
|
# Production caching (optional)
|
||||||
|
redis==5.0.1
|
||||||
|
hiredis==2.3.2
|
||||||
|
|
||||||
|
# Database for production (optional, for session storage)
|
||||||
|
psycopg2-binary==2.9.9
|
||||||
|
SQLAlchemy==2.0.23
|
||||||
|
|
||||||
|
# Additional production utilities
|
||||||
|
python-json-logger==2.0.7 # JSON logging
|
||||||
|
sentry-sdk[flask]==1.39.1 # Error tracking (optional)
|
@ -1,5 +1,12 @@
|
|||||||
flask
|
flask
|
||||||
|
flask-cors
|
||||||
requests
|
requests
|
||||||
openai-whisper
|
openai-whisper
|
||||||
torch
|
torch
|
||||||
ollama
|
ollama
|
||||||
|
pywebpush
|
||||||
|
cryptography
|
||||||
|
python-dotenv
|
||||||
|
click
|
||||||
|
colorlog
|
||||||
|
psutil
|
||||||
|
411
secrets_manager.py
Normal file
411
secrets_manager.py
Normal file
@ -0,0 +1,411 @@
|
|||||||
|
# Secrets management system for secure configuration
|
||||||
|
import os
|
||||||
|
import json
|
||||||
|
import base64
|
||||||
|
import logging
|
||||||
|
from typing import Any, Dict, Optional, List
|
||||||
|
from datetime import datetime, timedelta
|
||||||
|
from cryptography.fernet import Fernet
|
||||||
|
from cryptography.hazmat.primitives import hashes
|
||||||
|
from cryptography.hazmat.primitives.kdf.pbkdf2 import PBKDF2HMAC
|
||||||
|
import hashlib
|
||||||
|
import hmac
|
||||||
|
import secrets
|
||||||
|
from functools import lru_cache
|
||||||
|
from threading import Lock
|
||||||
|
|
||||||
|
logger = logging.getLogger(__name__)
|
||||||
|
|
||||||
|
class SecretsManager:
|
||||||
|
"""
|
||||||
|
Secure secrets management with encryption, rotation, and audit logging
|
||||||
|
"""
|
||||||
|
def __init__(self, config_file: str = None):
|
||||||
|
self.config_file = config_file or os.environ.get('SECRETS_CONFIG', '.secrets.json')
|
||||||
|
self.lock = Lock()
|
||||||
|
self._secrets_cache = {}
|
||||||
|
self._encryption_key = None
|
||||||
|
self._master_key = None
|
||||||
|
self._audit_log = []
|
||||||
|
self._rotation_schedule = {}
|
||||||
|
self._validators = {}
|
||||||
|
|
||||||
|
# Initialize encryption
|
||||||
|
self._init_encryption()
|
||||||
|
|
||||||
|
# Load secrets
|
||||||
|
self._load_secrets()
|
||||||
|
|
||||||
|
def _init_encryption(self):
|
||||||
|
"""Initialize encryption key from environment or generate new one"""
|
||||||
|
# Try to get master key from environment
|
||||||
|
master_key = os.environ.get('MASTER_KEY')
|
||||||
|
|
||||||
|
if not master_key:
|
||||||
|
# Try to load from secure file
|
||||||
|
key_file = os.environ.get('MASTER_KEY_FILE', '.master_key')
|
||||||
|
if os.path.exists(key_file):
|
||||||
|
try:
|
||||||
|
with open(key_file, 'rb') as f:
|
||||||
|
master_key = f.read().decode('utf-8').strip()
|
||||||
|
except Exception as e:
|
||||||
|
logger.error(f"Failed to load master key from file: {e}")
|
||||||
|
|
||||||
|
if not master_key:
|
||||||
|
# Generate new master key
|
||||||
|
logger.warning("No master key found. Generating new one.")
|
||||||
|
master_key = Fernet.generate_key().decode('utf-8')
|
||||||
|
|
||||||
|
# Save to secure file (should be protected by OS permissions)
|
||||||
|
key_file = os.environ.get('MASTER_KEY_FILE', '.master_key')
|
||||||
|
try:
|
||||||
|
with open(key_file, 'wb') as f:
|
||||||
|
f.write(master_key.encode('utf-8'))
|
||||||
|
os.chmod(key_file, 0o600) # Owner read/write only
|
||||||
|
logger.info(f"Master key saved to {key_file}")
|
||||||
|
except Exception as e:
|
||||||
|
logger.error(f"Failed to save master key: {e}")
|
||||||
|
|
||||||
|
self._master_key = master_key.encode('utf-8')
|
||||||
|
|
||||||
|
# Derive encryption key from master key
|
||||||
|
kdf = PBKDF2HMAC(
|
||||||
|
algorithm=hashes.SHA256(),
|
||||||
|
length=32,
|
||||||
|
salt=b'talk2me-secrets-salt', # In production, use random salt
|
||||||
|
iterations=100000,
|
||||||
|
)
|
||||||
|
key = base64.urlsafe_b64encode(kdf.derive(self._master_key))
|
||||||
|
self._encryption_key = Fernet(key)
|
||||||
|
|
||||||
|
def _load_secrets(self):
|
||||||
|
"""Load encrypted secrets from file"""
|
||||||
|
if not os.path.exists(self.config_file):
|
||||||
|
logger.info(f"No secrets file found at {self.config_file}")
|
||||||
|
return
|
||||||
|
|
||||||
|
try:
|
||||||
|
with open(self.config_file, 'r') as f:
|
||||||
|
data = json.load(f)
|
||||||
|
|
||||||
|
# Decrypt secrets
|
||||||
|
for key, value in data.get('secrets', {}).items():
|
||||||
|
if isinstance(value, dict) and 'encrypted' in value:
|
||||||
|
try:
|
||||||
|
decrypted = self._decrypt(value['encrypted'])
|
||||||
|
self._secrets_cache[key] = {
|
||||||
|
'value': decrypted,
|
||||||
|
'created': value.get('created'),
|
||||||
|
'rotated': value.get('rotated'),
|
||||||
|
'metadata': value.get('metadata', {})
|
||||||
|
}
|
||||||
|
except Exception as e:
|
||||||
|
logger.error(f"Failed to decrypt secret {key}: {e}")
|
||||||
|
else:
|
||||||
|
# Plain text (for migration)
|
||||||
|
self._secrets_cache[key] = {
|
||||||
|
'value': value,
|
||||||
|
'created': datetime.now().isoformat(),
|
||||||
|
'rotated': None,
|
||||||
|
'metadata': {}
|
||||||
|
}
|
||||||
|
|
||||||
|
# Load rotation schedule
|
||||||
|
self._rotation_schedule = data.get('rotation_schedule', {})
|
||||||
|
|
||||||
|
# Load audit log
|
||||||
|
self._audit_log = data.get('audit_log', [])
|
||||||
|
|
||||||
|
logger.info(f"Loaded {len(self._secrets_cache)} secrets")
|
||||||
|
|
||||||
|
except Exception as e:
|
||||||
|
logger.error(f"Failed to load secrets: {e}")
|
||||||
|
|
||||||
|
def _save_secrets(self):
|
||||||
|
"""Save encrypted secrets to file"""
|
||||||
|
with self.lock:
|
||||||
|
data = {
|
||||||
|
'secrets': {},
|
||||||
|
'rotation_schedule': self._rotation_schedule,
|
||||||
|
'audit_log': self._audit_log[-1000:] # Keep last 1000 entries
|
||||||
|
}
|
||||||
|
|
||||||
|
# Encrypt secrets
|
||||||
|
for key, secret_data in self._secrets_cache.items():
|
||||||
|
data['secrets'][key] = {
|
||||||
|
'encrypted': self._encrypt(secret_data['value']),
|
||||||
|
'created': secret_data.get('created'),
|
||||||
|
'rotated': secret_data.get('rotated'),
|
||||||
|
'metadata': secret_data.get('metadata', {})
|
||||||
|
}
|
||||||
|
|
||||||
|
# Save to file
|
||||||
|
try:
|
||||||
|
# Write to temporary file first
|
||||||
|
temp_file = f"{self.config_file}.tmp"
|
||||||
|
with open(temp_file, 'w') as f:
|
||||||
|
json.dump(data, f, indent=2)
|
||||||
|
|
||||||
|
# Set secure permissions
|
||||||
|
os.chmod(temp_file, 0o600) # Owner read/write only
|
||||||
|
|
||||||
|
# Atomic rename
|
||||||
|
os.rename(temp_file, self.config_file)
|
||||||
|
|
||||||
|
logger.info(f"Saved {len(self._secrets_cache)} secrets")
|
||||||
|
except Exception as e:
|
||||||
|
logger.error(f"Failed to save secrets: {e}")
|
||||||
|
raise
|
||||||
|
|
||||||
|
def _encrypt(self, value: str) -> str:
|
||||||
|
"""Encrypt a value"""
|
||||||
|
if not isinstance(value, str):
|
||||||
|
value = str(value)
|
||||||
|
return self._encryption_key.encrypt(value.encode('utf-8')).decode('utf-8')
|
||||||
|
|
||||||
|
def _decrypt(self, encrypted_value: str) -> str:
|
||||||
|
"""Decrypt a value"""
|
||||||
|
return self._encryption_key.decrypt(encrypted_value.encode('utf-8')).decode('utf-8')
|
||||||
|
|
||||||
|
def _audit(self, action: str, key: str, user: str = None, details: dict = None):
|
||||||
|
"""Add entry to audit log"""
|
||||||
|
entry = {
|
||||||
|
'timestamp': datetime.now().isoformat(),
|
||||||
|
'action': action,
|
||||||
|
'key': key,
|
||||||
|
'user': user or 'system',
|
||||||
|
'details': details or {}
|
||||||
|
}
|
||||||
|
self._audit_log.append(entry)
|
||||||
|
logger.info(f"Audit: {action} on {key} by {user or 'system'}")
|
||||||
|
|
||||||
|
def get(self, key: str, default: Any = None) -> Any:
|
||||||
|
"""Get a secret value"""
|
||||||
|
# Try cache first
|
||||||
|
if key in self._secrets_cache:
|
||||||
|
self._audit('access', key)
|
||||||
|
return self._secrets_cache[key]['value']
|
||||||
|
|
||||||
|
# Try environment variable
|
||||||
|
env_key = f"SECRET_{key.upper()}"
|
||||||
|
env_value = os.environ.get(env_key)
|
||||||
|
if env_value:
|
||||||
|
self._audit('access', key, details={'source': 'environment'})
|
||||||
|
return env_value
|
||||||
|
|
||||||
|
# Try regular environment variable
|
||||||
|
env_value = os.environ.get(key)
|
||||||
|
if env_value:
|
||||||
|
self._audit('access', key, details={'source': 'environment'})
|
||||||
|
return env_value
|
||||||
|
|
||||||
|
self._audit('access_failed', key)
|
||||||
|
return default
|
||||||
|
|
||||||
|
def set(self, key: str, value: str, metadata: dict = None, user: str = None):
|
||||||
|
"""Set a secret value"""
|
||||||
|
with self.lock:
|
||||||
|
old_value = self._secrets_cache.get(key, {}).get('value')
|
||||||
|
|
||||||
|
self._secrets_cache[key] = {
|
||||||
|
'value': value,
|
||||||
|
'created': self._secrets_cache.get(key, {}).get('created', datetime.now().isoformat()),
|
||||||
|
'rotated': datetime.now().isoformat() if old_value else None,
|
||||||
|
'metadata': metadata or {}
|
||||||
|
}
|
||||||
|
|
||||||
|
self._audit('set' if not old_value else 'update', key, user)
|
||||||
|
self._save_secrets()
|
||||||
|
|
||||||
|
def delete(self, key: str, user: str = None):
|
||||||
|
"""Delete a secret"""
|
||||||
|
with self.lock:
|
||||||
|
if key in self._secrets_cache:
|
||||||
|
del self._secrets_cache[key]
|
||||||
|
self._audit('delete', key, user)
|
||||||
|
self._save_secrets()
|
||||||
|
return True
|
||||||
|
return False
|
||||||
|
|
||||||
|
def rotate(self, key: str, new_value: str = None, user: str = None):
|
||||||
|
"""Rotate a secret"""
|
||||||
|
with self.lock:
|
||||||
|
if key not in self._secrets_cache:
|
||||||
|
raise KeyError(f"Secret {key} not found")
|
||||||
|
|
||||||
|
old_value = self._secrets_cache[key]['value']
|
||||||
|
|
||||||
|
# Generate new value if not provided
|
||||||
|
if not new_value:
|
||||||
|
if key.endswith('_KEY') or key.endswith('_TOKEN'):
|
||||||
|
new_value = secrets.token_urlsafe(32)
|
||||||
|
elif key.endswith('_PASSWORD'):
|
||||||
|
new_value = secrets.token_urlsafe(24)
|
||||||
|
else:
|
||||||
|
raise ValueError(f"Cannot auto-generate value for {key}")
|
||||||
|
|
||||||
|
# Update secret
|
||||||
|
self._secrets_cache[key]['value'] = new_value
|
||||||
|
self._secrets_cache[key]['rotated'] = datetime.now().isoformat()
|
||||||
|
|
||||||
|
self._audit('rotate', key, user, {'generated': new_value is None})
|
||||||
|
self._save_secrets()
|
||||||
|
|
||||||
|
return old_value, new_value
|
||||||
|
|
||||||
|
def list_secrets(self) -> List[Dict[str, Any]]:
|
||||||
|
"""List all secrets (without values)"""
|
||||||
|
secrets_list = []
|
||||||
|
for key, data in self._secrets_cache.items():
|
||||||
|
secrets_list.append({
|
||||||
|
'key': key,
|
||||||
|
'created': data.get('created'),
|
||||||
|
'rotated': data.get('rotated'),
|
||||||
|
'metadata': data.get('metadata', {}),
|
||||||
|
'has_value': bool(data.get('value'))
|
||||||
|
})
|
||||||
|
return secrets_list
|
||||||
|
|
||||||
|
def add_validator(self, key: str, validator):
|
||||||
|
"""Add a validator function for a secret"""
|
||||||
|
self._validators[key] = validator
|
||||||
|
|
||||||
|
def validate(self, key: str, value: str) -> bool:
|
||||||
|
"""Validate a secret value"""
|
||||||
|
if key in self._validators:
|
||||||
|
try:
|
||||||
|
return self._validators[key](value)
|
||||||
|
except Exception as e:
|
||||||
|
logger.error(f"Validation failed for {key}: {e}")
|
||||||
|
return False
|
||||||
|
return True
|
||||||
|
|
||||||
|
def schedule_rotation(self, key: str, days: int):
|
||||||
|
"""Schedule automatic rotation for a secret"""
|
||||||
|
self._rotation_schedule[key] = {
|
||||||
|
'days': days,
|
||||||
|
'last_rotated': self._secrets_cache.get(key, {}).get('rotated', datetime.now().isoformat())
|
||||||
|
}
|
||||||
|
self._save_secrets()
|
||||||
|
|
||||||
|
def check_rotation_needed(self) -> List[str]:
|
||||||
|
"""Check which secrets need rotation"""
|
||||||
|
needs_rotation = []
|
||||||
|
now = datetime.now()
|
||||||
|
|
||||||
|
for key, schedule in self._rotation_schedule.items():
|
||||||
|
last_rotated = datetime.fromisoformat(schedule['last_rotated'])
|
||||||
|
if now - last_rotated > timedelta(days=schedule['days']):
|
||||||
|
needs_rotation.append(key)
|
||||||
|
|
||||||
|
return needs_rotation
|
||||||
|
|
||||||
|
def get_audit_log(self, key: str = None, limit: int = 100) -> List[Dict]:
|
||||||
|
"""Get audit log entries"""
|
||||||
|
logs = self._audit_log
|
||||||
|
|
||||||
|
if key:
|
||||||
|
logs = [log for log in logs if log['key'] == key]
|
||||||
|
|
||||||
|
return logs[-limit:]
|
||||||
|
|
||||||
|
def export_for_environment(self) -> Dict[str, str]:
|
||||||
|
"""Export secrets as environment variables"""
|
||||||
|
env_vars = {}
|
||||||
|
for key, data in self._secrets_cache.items():
|
||||||
|
env_key = f"SECRET_{key.upper()}"
|
||||||
|
env_vars[env_key] = data['value']
|
||||||
|
return env_vars
|
||||||
|
|
||||||
|
def verify_integrity(self) -> bool:
|
||||||
|
"""Verify integrity of secrets"""
|
||||||
|
try:
|
||||||
|
# Try to decrypt all secrets
|
||||||
|
for key, secret_data in self._secrets_cache.items():
|
||||||
|
if 'value' in secret_data:
|
||||||
|
# Re-encrypt and compare
|
||||||
|
encrypted = self._encrypt(secret_data['value'])
|
||||||
|
decrypted = self._decrypt(encrypted)
|
||||||
|
if decrypted != secret_data['value']:
|
||||||
|
logger.error(f"Integrity check failed for {key}")
|
||||||
|
return False
|
||||||
|
|
||||||
|
logger.info("Integrity check passed")
|
||||||
|
return True
|
||||||
|
except Exception as e:
|
||||||
|
logger.error(f"Integrity check failed: {e}")
|
||||||
|
return False
|
||||||
|
|
||||||
|
# Global instance
|
||||||
|
_secrets_manager = None
|
||||||
|
_secrets_lock = Lock()
|
||||||
|
|
||||||
|
def get_secrets_manager(config_file: str = None) -> SecretsManager:
|
||||||
|
"""Get or create global secrets manager instance"""
|
||||||
|
global _secrets_manager
|
||||||
|
|
||||||
|
with _secrets_lock:
|
||||||
|
if _secrets_manager is None:
|
||||||
|
_secrets_manager = SecretsManager(config_file)
|
||||||
|
return _secrets_manager
|
||||||
|
|
||||||
|
def get_secret(key: str, default: Any = None) -> Any:
|
||||||
|
"""Convenience function to get a secret"""
|
||||||
|
manager = get_secrets_manager()
|
||||||
|
return manager.get(key, default)
|
||||||
|
|
||||||
|
def set_secret(key: str, value: str, metadata: dict = None):
|
||||||
|
"""Convenience function to set a secret"""
|
||||||
|
manager = get_secrets_manager()
|
||||||
|
manager.set(key, value, metadata)
|
||||||
|
|
||||||
|
# Flask integration
|
||||||
|
def init_app(app):
|
||||||
|
"""Initialize secrets management for Flask app"""
|
||||||
|
manager = get_secrets_manager()
|
||||||
|
|
||||||
|
# Load secrets into app config
|
||||||
|
app.config['SECRET_KEY'] = manager.get('FLASK_SECRET_KEY') or app.config.get('SECRET_KEY')
|
||||||
|
app.config['TTS_API_KEY'] = manager.get('TTS_API_KEY') or app.config.get('TTS_API_KEY')
|
||||||
|
|
||||||
|
# Add secret manager to app
|
||||||
|
app.secrets_manager = manager
|
||||||
|
|
||||||
|
# Add CLI commands
|
||||||
|
@app.cli.command('secrets-list')
|
||||||
|
def list_secrets_cmd():
|
||||||
|
"""List all secrets"""
|
||||||
|
secrets = manager.list_secrets()
|
||||||
|
for secret in secrets:
|
||||||
|
print(f"{secret['key']}: created={secret['created']}, rotated={secret['rotated']}")
|
||||||
|
|
||||||
|
@app.cli.command('secrets-set')
|
||||||
|
def set_secret_cmd():
|
||||||
|
"""Set a secret"""
|
||||||
|
import click
|
||||||
|
key = click.prompt('Secret key')
|
||||||
|
value = click.prompt('Secret value', hide_input=True)
|
||||||
|
manager.set(key, value, user='cli')
|
||||||
|
print(f"Secret {key} set successfully")
|
||||||
|
|
||||||
|
@app.cli.command('secrets-rotate')
|
||||||
|
def rotate_secret_cmd():
|
||||||
|
"""Rotate a secret"""
|
||||||
|
import click
|
||||||
|
key = click.prompt('Secret key to rotate')
|
||||||
|
old_value, new_value = manager.rotate(key, user='cli')
|
||||||
|
print(f"Secret {key} rotated successfully")
|
||||||
|
print(f"New value: {new_value}")
|
||||||
|
|
||||||
|
@app.cli.command('secrets-check-rotation')
|
||||||
|
def check_rotation_cmd():
|
||||||
|
"""Check which secrets need rotation"""
|
||||||
|
needs_rotation = manager.check_rotation_needed()
|
||||||
|
if needs_rotation:
|
||||||
|
print("Secrets needing rotation:")
|
||||||
|
for key in needs_rotation:
|
||||||
|
print(f" - {key}")
|
||||||
|
else:
|
||||||
|
print("No secrets need rotation")
|
||||||
|
|
||||||
|
logger.info("Secrets management initialized")
|
607
session_manager.py
Normal file
607
session_manager.py
Normal file
@ -0,0 +1,607 @@
|
|||||||
|
# Session management system for preventing resource leaks
|
||||||
|
import time
|
||||||
|
import uuid
|
||||||
|
import logging
|
||||||
|
from datetime import datetime, timedelta
|
||||||
|
from typing import Dict, Any, Optional, List, Tuple
|
||||||
|
from dataclasses import dataclass, field
|
||||||
|
from threading import Lock, Thread
|
||||||
|
import json
|
||||||
|
import os
|
||||||
|
import tempfile
|
||||||
|
import shutil
|
||||||
|
from collections import defaultdict
|
||||||
|
from functools import wraps
|
||||||
|
from flask import session, request, g, current_app
|
||||||
|
|
||||||
|
logger = logging.getLogger(__name__)
|
||||||
|
|
||||||
|
@dataclass
|
||||||
|
class SessionResource:
|
||||||
|
"""Represents a resource associated with a session"""
|
||||||
|
resource_id: str
|
||||||
|
resource_type: str # 'audio_file', 'temp_file', 'websocket', 'stream'
|
||||||
|
path: Optional[str] = None
|
||||||
|
created_at: float = field(default_factory=time.time)
|
||||||
|
last_accessed: float = field(default_factory=time.time)
|
||||||
|
size_bytes: int = 0
|
||||||
|
metadata: Dict[str, Any] = field(default_factory=dict)
|
||||||
|
|
||||||
|
@dataclass
|
||||||
|
class UserSession:
|
||||||
|
"""Represents a user session with associated resources"""
|
||||||
|
session_id: str
|
||||||
|
user_id: Optional[str] = None
|
||||||
|
ip_address: Optional[str] = None
|
||||||
|
user_agent: Optional[str] = None
|
||||||
|
created_at: float = field(default_factory=time.time)
|
||||||
|
last_activity: float = field(default_factory=time.time)
|
||||||
|
resources: Dict[str, SessionResource] = field(default_factory=dict)
|
||||||
|
request_count: int = 0
|
||||||
|
total_bytes_used: int = 0
|
||||||
|
active_streams: int = 0
|
||||||
|
metadata: Dict[str, Any] = field(default_factory=dict)
|
||||||
|
|
||||||
|
class SessionManager:
|
||||||
|
"""
|
||||||
|
Manages user sessions and associated resources to prevent leaks
|
||||||
|
"""
|
||||||
|
def __init__(self, config: Dict[str, Any] = None):
|
||||||
|
self.config = config or {}
|
||||||
|
self.sessions: Dict[str, UserSession] = {}
|
||||||
|
self.lock = Lock()
|
||||||
|
|
||||||
|
# Configuration
|
||||||
|
self.max_session_duration = self.config.get('max_session_duration', 3600) # 1 hour
|
||||||
|
self.max_idle_time = self.config.get('max_idle_time', 900) # 15 minutes
|
||||||
|
self.max_resources_per_session = self.config.get('max_resources_per_session', 100)
|
||||||
|
self.max_bytes_per_session = self.config.get('max_bytes_per_session', 100 * 1024 * 1024) # 100MB
|
||||||
|
self.cleanup_interval = self.config.get('cleanup_interval', 60) # 1 minute
|
||||||
|
self.session_storage_path = self.config.get('session_storage_path',
|
||||||
|
os.path.join(tempfile.gettempdir(), 'talk2me_sessions'))
|
||||||
|
|
||||||
|
# Statistics
|
||||||
|
self.stats = {
|
||||||
|
'total_sessions_created': 0,
|
||||||
|
'total_sessions_cleaned': 0,
|
||||||
|
'total_resources_cleaned': 0,
|
||||||
|
'total_bytes_cleaned': 0,
|
||||||
|
'active_sessions': 0,
|
||||||
|
'active_resources': 0,
|
||||||
|
'active_bytes': 0
|
||||||
|
}
|
||||||
|
|
||||||
|
# Resource cleanup handlers
|
||||||
|
self.cleanup_handlers = {
|
||||||
|
'audio_file': self._cleanup_audio_file,
|
||||||
|
'temp_file': self._cleanup_temp_file,
|
||||||
|
'websocket': self._cleanup_websocket,
|
||||||
|
'stream': self._cleanup_stream
|
||||||
|
}
|
||||||
|
|
||||||
|
# Initialize storage
|
||||||
|
self._init_storage()
|
||||||
|
|
||||||
|
# Start cleanup thread
|
||||||
|
self.cleanup_thread = Thread(target=self._cleanup_loop, daemon=True)
|
||||||
|
self.cleanup_thread.start()
|
||||||
|
|
||||||
|
logger.info("Session manager initialized")
|
||||||
|
|
||||||
|
def _init_storage(self):
|
||||||
|
"""Initialize session storage directory"""
|
||||||
|
try:
|
||||||
|
os.makedirs(self.session_storage_path, mode=0o755, exist_ok=True)
|
||||||
|
logger.info(f"Session storage initialized at {self.session_storage_path}")
|
||||||
|
except Exception as e:
|
||||||
|
logger.error(f"Failed to create session storage: {e}")
|
||||||
|
|
||||||
|
def create_session(self, session_id: str = None, user_id: str = None,
|
||||||
|
ip_address: str = None, user_agent: str = None) -> UserSession:
|
||||||
|
"""Create a new session"""
|
||||||
|
with self.lock:
|
||||||
|
if not session_id:
|
||||||
|
session_id = str(uuid.uuid4())
|
||||||
|
|
||||||
|
if session_id in self.sessions:
|
||||||
|
logger.warning(f"Session {session_id} already exists")
|
||||||
|
return self.sessions[session_id]
|
||||||
|
|
||||||
|
session = UserSession(
|
||||||
|
session_id=session_id,
|
||||||
|
user_id=user_id,
|
||||||
|
ip_address=ip_address,
|
||||||
|
user_agent=user_agent
|
||||||
|
)
|
||||||
|
|
||||||
|
self.sessions[session_id] = session
|
||||||
|
self.stats['total_sessions_created'] += 1
|
||||||
|
self.stats['active_sessions'] = len(self.sessions)
|
||||||
|
|
||||||
|
# Create session directory
|
||||||
|
session_dir = os.path.join(self.session_storage_path, session_id)
|
||||||
|
try:
|
||||||
|
os.makedirs(session_dir, mode=0o755, exist_ok=True)
|
||||||
|
except Exception as e:
|
||||||
|
logger.error(f"Failed to create session directory: {e}")
|
||||||
|
|
||||||
|
logger.info(f"Created session {session_id}")
|
||||||
|
return session
|
||||||
|
|
||||||
|
def get_session(self, session_id: str) -> Optional[UserSession]:
|
||||||
|
"""Get a session by ID"""
|
||||||
|
with self.lock:
|
||||||
|
session = self.sessions.get(session_id)
|
||||||
|
if session:
|
||||||
|
session.last_activity = time.time()
|
||||||
|
return session
|
||||||
|
|
||||||
|
def add_resource(self, session_id: str, resource_type: str,
|
||||||
|
resource_id: str = None, path: str = None,
|
||||||
|
size_bytes: int = 0, metadata: Dict[str, Any] = None) -> Optional[SessionResource]:
|
||||||
|
"""Add a resource to a session"""
|
||||||
|
with self.lock:
|
||||||
|
session = self.sessions.get(session_id)
|
||||||
|
if not session:
|
||||||
|
logger.warning(f"Session {session_id} not found")
|
||||||
|
return None
|
||||||
|
|
||||||
|
# Check limits
|
||||||
|
if len(session.resources) >= self.max_resources_per_session:
|
||||||
|
logger.warning(f"Session {session_id} reached resource limit")
|
||||||
|
self._cleanup_oldest_resources(session, 1)
|
||||||
|
|
||||||
|
if session.total_bytes_used + size_bytes > self.max_bytes_per_session:
|
||||||
|
logger.warning(f"Session {session_id} reached size limit")
|
||||||
|
bytes_to_free = (session.total_bytes_used + size_bytes) - self.max_bytes_per_session
|
||||||
|
self._cleanup_resources_by_size(session, bytes_to_free)
|
||||||
|
|
||||||
|
# Create resource
|
||||||
|
if not resource_id:
|
||||||
|
resource_id = str(uuid.uuid4())
|
||||||
|
|
||||||
|
resource = SessionResource(
|
||||||
|
resource_id=resource_id,
|
||||||
|
resource_type=resource_type,
|
||||||
|
path=path,
|
||||||
|
size_bytes=size_bytes,
|
||||||
|
metadata=metadata or {}
|
||||||
|
)
|
||||||
|
|
||||||
|
session.resources[resource_id] = resource
|
||||||
|
session.total_bytes_used += size_bytes
|
||||||
|
session.last_activity = time.time()
|
||||||
|
|
||||||
|
# Update stats
|
||||||
|
self.stats['active_resources'] += 1
|
||||||
|
self.stats['active_bytes'] += size_bytes
|
||||||
|
|
||||||
|
logger.debug(f"Added {resource_type} resource {resource_id} to session {session_id}")
|
||||||
|
return resource
|
||||||
|
|
||||||
|
def remove_resource(self, session_id: str, resource_id: str) -> bool:
|
||||||
|
"""Remove a resource from a session"""
|
||||||
|
with self.lock:
|
||||||
|
session = self.sessions.get(session_id)
|
||||||
|
if not session:
|
||||||
|
return False
|
||||||
|
|
||||||
|
resource = session.resources.get(resource_id)
|
||||||
|
if not resource:
|
||||||
|
return False
|
||||||
|
|
||||||
|
# Cleanup resource
|
||||||
|
self._cleanup_resource(resource)
|
||||||
|
|
||||||
|
# Remove from session
|
||||||
|
del session.resources[resource_id]
|
||||||
|
session.total_bytes_used -= resource.size_bytes
|
||||||
|
|
||||||
|
# Update stats
|
||||||
|
self.stats['active_resources'] -= 1
|
||||||
|
self.stats['active_bytes'] -= resource.size_bytes
|
||||||
|
self.stats['total_resources_cleaned'] += 1
|
||||||
|
self.stats['total_bytes_cleaned'] += resource.size_bytes
|
||||||
|
|
||||||
|
logger.debug(f"Removed resource {resource_id} from session {session_id}")
|
||||||
|
return True
|
||||||
|
|
||||||
|
def update_session_activity(self, session_id: str):
|
||||||
|
"""Update session last activity time"""
|
||||||
|
with self.lock:
|
||||||
|
session = self.sessions.get(session_id)
|
||||||
|
if session:
|
||||||
|
session.last_activity = time.time()
|
||||||
|
session.request_count += 1
|
||||||
|
|
||||||
|
def cleanup_session(self, session_id: str) -> bool:
|
||||||
|
"""Clean up a session and all its resources"""
|
||||||
|
with self.lock:
|
||||||
|
session = self.sessions.get(session_id)
|
||||||
|
if not session:
|
||||||
|
return False
|
||||||
|
|
||||||
|
# Cleanup all resources
|
||||||
|
for resource_id in list(session.resources.keys()):
|
||||||
|
self.remove_resource(session_id, resource_id)
|
||||||
|
|
||||||
|
# Remove session directory
|
||||||
|
session_dir = os.path.join(self.session_storage_path, session_id)
|
||||||
|
try:
|
||||||
|
if os.path.exists(session_dir):
|
||||||
|
shutil.rmtree(session_dir)
|
||||||
|
except Exception as e:
|
||||||
|
logger.error(f"Failed to remove session directory: {e}")
|
||||||
|
|
||||||
|
# Remove session
|
||||||
|
del self.sessions[session_id]
|
||||||
|
|
||||||
|
# Update stats
|
||||||
|
self.stats['active_sessions'] = len(self.sessions)
|
||||||
|
self.stats['total_sessions_cleaned'] += 1
|
||||||
|
|
||||||
|
logger.info(f"Cleaned up session {session_id}")
|
||||||
|
return True
|
||||||
|
|
||||||
|
def _cleanup_resource(self, resource: SessionResource):
|
||||||
|
"""Clean up a single resource"""
|
||||||
|
handler = self.cleanup_handlers.get(resource.resource_type)
|
||||||
|
if handler:
|
||||||
|
try:
|
||||||
|
handler(resource)
|
||||||
|
except Exception as e:
|
||||||
|
logger.error(f"Failed to cleanup {resource.resource_type} {resource.resource_id}: {e}")
|
||||||
|
|
||||||
|
def _cleanup_audio_file(self, resource: SessionResource):
|
||||||
|
"""Clean up audio file resource"""
|
||||||
|
if resource.path and os.path.exists(resource.path):
|
||||||
|
try:
|
||||||
|
os.remove(resource.path)
|
||||||
|
logger.debug(f"Removed audio file {resource.path}")
|
||||||
|
except Exception as e:
|
||||||
|
logger.error(f"Failed to remove audio file {resource.path}: {e}")
|
||||||
|
|
||||||
|
def _cleanup_temp_file(self, resource: SessionResource):
|
||||||
|
"""Clean up temporary file resource"""
|
||||||
|
if resource.path and os.path.exists(resource.path):
|
||||||
|
try:
|
||||||
|
os.remove(resource.path)
|
||||||
|
logger.debug(f"Removed temp file {resource.path}")
|
||||||
|
except Exception as e:
|
||||||
|
logger.error(f"Failed to remove temp file {resource.path}: {e}")
|
||||||
|
|
||||||
|
def _cleanup_websocket(self, resource: SessionResource):
|
||||||
|
"""Clean up websocket resource"""
|
||||||
|
# Implement websocket cleanup if needed
|
||||||
|
pass
|
||||||
|
|
||||||
|
def _cleanup_stream(self, resource: SessionResource):
|
||||||
|
"""Clean up stream resource"""
|
||||||
|
# Implement stream cleanup if needed
|
||||||
|
if resource.metadata.get('stream_id'):
|
||||||
|
# Close any open streams
|
||||||
|
pass
|
||||||
|
|
||||||
|
def _cleanup_oldest_resources(self, session: UserSession, count: int):
|
||||||
|
"""Clean up oldest resources from a session"""
|
||||||
|
# Sort resources by creation time
|
||||||
|
sorted_resources = sorted(
|
||||||
|
session.resources.items(),
|
||||||
|
key=lambda x: x[1].created_at
|
||||||
|
)
|
||||||
|
|
||||||
|
# Remove oldest resources
|
||||||
|
for resource_id, _ in sorted_resources[:count]:
|
||||||
|
self.remove_resource(session.session_id, resource_id)
|
||||||
|
|
||||||
|
def _cleanup_resources_by_size(self, session: UserSession, bytes_to_free: int):
|
||||||
|
"""Clean up resources to free up space"""
|
||||||
|
freed_bytes = 0
|
||||||
|
|
||||||
|
# Sort resources by size (largest first)
|
||||||
|
sorted_resources = sorted(
|
||||||
|
session.resources.items(),
|
||||||
|
key=lambda x: x[1].size_bytes,
|
||||||
|
reverse=True
|
||||||
|
)
|
||||||
|
|
||||||
|
# Remove resources until we've freed enough space
|
||||||
|
for resource_id, resource in sorted_resources:
|
||||||
|
if freed_bytes >= bytes_to_free:
|
||||||
|
break
|
||||||
|
|
||||||
|
freed_bytes += resource.size_bytes
|
||||||
|
self.remove_resource(session.session_id, resource_id)
|
||||||
|
|
||||||
|
def _cleanup_loop(self):
|
||||||
|
"""Background cleanup thread"""
|
||||||
|
while True:
|
||||||
|
try:
|
||||||
|
time.sleep(self.cleanup_interval)
|
||||||
|
self.cleanup_expired_sessions()
|
||||||
|
self.cleanup_idle_sessions()
|
||||||
|
self.cleanup_orphaned_files()
|
||||||
|
except Exception as e:
|
||||||
|
logger.error(f"Error in cleanup loop: {e}")
|
||||||
|
|
||||||
|
def cleanup_expired_sessions(self):
|
||||||
|
"""Clean up sessions that have exceeded max duration"""
|
||||||
|
with self.lock:
|
||||||
|
now = time.time()
|
||||||
|
expired_sessions = []
|
||||||
|
|
||||||
|
for session_id, session in self.sessions.items():
|
||||||
|
if now - session.created_at > self.max_session_duration:
|
||||||
|
expired_sessions.append(session_id)
|
||||||
|
|
||||||
|
for session_id in expired_sessions:
|
||||||
|
logger.info(f"Cleaning up expired session {session_id}")
|
||||||
|
self.cleanup_session(session_id)
|
||||||
|
|
||||||
|
def cleanup_idle_sessions(self):
|
||||||
|
"""Clean up sessions that have been idle too long"""
|
||||||
|
with self.lock:
|
||||||
|
now = time.time()
|
||||||
|
idle_sessions = []
|
||||||
|
|
||||||
|
for session_id, session in self.sessions.items():
|
||||||
|
if now - session.last_activity > self.max_idle_time:
|
||||||
|
idle_sessions.append(session_id)
|
||||||
|
|
||||||
|
for session_id in idle_sessions:
|
||||||
|
logger.info(f"Cleaning up idle session {session_id}")
|
||||||
|
self.cleanup_session(session_id)
|
||||||
|
|
||||||
|
def cleanup_orphaned_files(self):
|
||||||
|
"""Clean up orphaned files in session storage"""
|
||||||
|
try:
|
||||||
|
if not os.path.exists(self.session_storage_path):
|
||||||
|
return
|
||||||
|
|
||||||
|
# Get all session directories
|
||||||
|
session_dirs = set(os.listdir(self.session_storage_path))
|
||||||
|
|
||||||
|
# Get active session IDs
|
||||||
|
with self.lock:
|
||||||
|
active_sessions = set(self.sessions.keys())
|
||||||
|
|
||||||
|
# Find orphaned directories
|
||||||
|
orphaned_dirs = session_dirs - active_sessions
|
||||||
|
|
||||||
|
# Clean up orphaned directories
|
||||||
|
for dir_name in orphaned_dirs:
|
||||||
|
dir_path = os.path.join(self.session_storage_path, dir_name)
|
||||||
|
if os.path.isdir(dir_path):
|
||||||
|
try:
|
||||||
|
shutil.rmtree(dir_path)
|
||||||
|
logger.info(f"Cleaned up orphaned session directory {dir_name}")
|
||||||
|
except Exception as e:
|
||||||
|
logger.error(f"Failed to remove orphaned directory {dir_path}: {e}")
|
||||||
|
|
||||||
|
except Exception as e:
|
||||||
|
logger.error(f"Error cleaning orphaned files: {e}")
|
||||||
|
|
||||||
|
def get_session_info(self, session_id: str) -> Optional[Dict[str, Any]]:
|
||||||
|
"""Get detailed information about a session"""
|
||||||
|
with self.lock:
|
||||||
|
session = self.sessions.get(session_id)
|
||||||
|
if not session:
|
||||||
|
return None
|
||||||
|
|
||||||
|
return {
|
||||||
|
'session_id': session.session_id,
|
||||||
|
'user_id': session.user_id,
|
||||||
|
'ip_address': session.ip_address,
|
||||||
|
'created_at': datetime.fromtimestamp(session.created_at).isoformat(),
|
||||||
|
'last_activity': datetime.fromtimestamp(session.last_activity).isoformat(),
|
||||||
|
'duration_seconds': int(time.time() - session.created_at),
|
||||||
|
'idle_seconds': int(time.time() - session.last_activity),
|
||||||
|
'request_count': session.request_count,
|
||||||
|
'resource_count': len(session.resources),
|
||||||
|
'total_bytes_used': session.total_bytes_used,
|
||||||
|
'active_streams': session.active_streams,
|
||||||
|
'resources': [
|
||||||
|
{
|
||||||
|
'resource_id': r.resource_id,
|
||||||
|
'resource_type': r.resource_type,
|
||||||
|
'size_bytes': r.size_bytes,
|
||||||
|
'created_at': datetime.fromtimestamp(r.created_at).isoformat(),
|
||||||
|
'last_accessed': datetime.fromtimestamp(r.last_accessed).isoformat()
|
||||||
|
}
|
||||||
|
for r in session.resources.values()
|
||||||
|
]
|
||||||
|
}
|
||||||
|
|
||||||
|
def get_all_sessions_info(self) -> List[Dict[str, Any]]:
|
||||||
|
"""Get information about all active sessions"""
|
||||||
|
with self.lock:
|
||||||
|
return [
|
||||||
|
self.get_session_info(session_id)
|
||||||
|
for session_id in self.sessions.keys()
|
||||||
|
]
|
||||||
|
|
||||||
|
def get_stats(self) -> Dict[str, Any]:
|
||||||
|
"""Get session manager statistics"""
|
||||||
|
with self.lock:
|
||||||
|
return {
|
||||||
|
**self.stats,
|
||||||
|
'uptime_seconds': int(time.time() - self.stats.get('start_time', time.time())),
|
||||||
|
'avg_session_duration': self._calculate_avg_session_duration(),
|
||||||
|
'avg_resources_per_session': self._calculate_avg_resources_per_session(),
|
||||||
|
'total_storage_used': self._calculate_total_storage_used()
|
||||||
|
}
|
||||||
|
|
||||||
|
def _calculate_avg_session_duration(self) -> float:
|
||||||
|
"""Calculate average session duration"""
|
||||||
|
if not self.sessions:
|
||||||
|
return 0
|
||||||
|
|
||||||
|
total_duration = sum(
|
||||||
|
time.time() - session.created_at
|
||||||
|
for session in self.sessions.values()
|
||||||
|
)
|
||||||
|
return total_duration / len(self.sessions)
|
||||||
|
|
||||||
|
def _calculate_avg_resources_per_session(self) -> float:
|
||||||
|
"""Calculate average resources per session"""
|
||||||
|
if not self.sessions:
|
||||||
|
return 0
|
||||||
|
|
||||||
|
total_resources = sum(
|
||||||
|
len(session.resources)
|
||||||
|
for session in self.sessions.values()
|
||||||
|
)
|
||||||
|
return total_resources / len(self.sessions)
|
||||||
|
|
||||||
|
def _calculate_total_storage_used(self) -> int:
|
||||||
|
"""Calculate total storage used"""
|
||||||
|
total = 0
|
||||||
|
try:
|
||||||
|
for root, dirs, files in os.walk(self.session_storage_path):
|
||||||
|
for file in files:
|
||||||
|
filepath = os.path.join(root, file)
|
||||||
|
total += os.path.getsize(filepath)
|
||||||
|
except Exception as e:
|
||||||
|
logger.error(f"Error calculating storage used: {e}")
|
||||||
|
return total
|
||||||
|
|
||||||
|
def export_metrics(self) -> Dict[str, Any]:
|
||||||
|
"""Export metrics for monitoring"""
|
||||||
|
with self.lock:
|
||||||
|
return {
|
||||||
|
'sessions': {
|
||||||
|
'active': self.stats['active_sessions'],
|
||||||
|
'total_created': self.stats['total_sessions_created'],
|
||||||
|
'total_cleaned': self.stats['total_sessions_cleaned']
|
||||||
|
},
|
||||||
|
'resources': {
|
||||||
|
'active': self.stats['active_resources'],
|
||||||
|
'total_cleaned': self.stats['total_resources_cleaned'],
|
||||||
|
'active_bytes': self.stats['active_bytes'],
|
||||||
|
'total_bytes_cleaned': self.stats['total_bytes_cleaned']
|
||||||
|
},
|
||||||
|
'limits': {
|
||||||
|
'max_session_duration': self.max_session_duration,
|
||||||
|
'max_idle_time': self.max_idle_time,
|
||||||
|
'max_resources_per_session': self.max_resources_per_session,
|
||||||
|
'max_bytes_per_session': self.max_bytes_per_session
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
# Global session manager instance
|
||||||
|
_session_manager = None
|
||||||
|
_session_lock = Lock()
|
||||||
|
|
||||||
|
def get_session_manager(config: Dict[str, Any] = None) -> SessionManager:
|
||||||
|
"""Get or create global session manager instance"""
|
||||||
|
global _session_manager
|
||||||
|
|
||||||
|
with _session_lock:
|
||||||
|
if _session_manager is None:
|
||||||
|
_session_manager = SessionManager(config)
|
||||||
|
return _session_manager
|
||||||
|
|
||||||
|
# Flask integration
|
||||||
|
def init_app(app):
|
||||||
|
"""Initialize session management for Flask app"""
|
||||||
|
config = {
|
||||||
|
'max_session_duration': app.config.get('MAX_SESSION_DURATION', 3600),
|
||||||
|
'max_idle_time': app.config.get('MAX_SESSION_IDLE_TIME', 900),
|
||||||
|
'max_resources_per_session': app.config.get('MAX_RESOURCES_PER_SESSION', 100),
|
||||||
|
'max_bytes_per_session': app.config.get('MAX_BYTES_PER_SESSION', 100 * 1024 * 1024),
|
||||||
|
'cleanup_interval': app.config.get('SESSION_CLEANUP_INTERVAL', 60),
|
||||||
|
'session_storage_path': app.config.get('SESSION_STORAGE_PATH',
|
||||||
|
os.path.join(app.config.get('UPLOAD_FOLDER', tempfile.gettempdir()), 'sessions'))
|
||||||
|
}
|
||||||
|
|
||||||
|
manager = get_session_manager(config)
|
||||||
|
app.session_manager = manager
|
||||||
|
|
||||||
|
# Add before_request handler
|
||||||
|
@app.before_request
|
||||||
|
def before_request_session():
|
||||||
|
# Get or create session
|
||||||
|
session_id = session.get('session_id')
|
||||||
|
if not session_id:
|
||||||
|
session_id = str(uuid.uuid4())
|
||||||
|
session['session_id'] = session_id
|
||||||
|
session.permanent = True
|
||||||
|
|
||||||
|
# Get session from manager
|
||||||
|
user_session = manager.get_session(session_id)
|
||||||
|
if not user_session:
|
||||||
|
user_session = manager.create_session(
|
||||||
|
session_id=session_id,
|
||||||
|
ip_address=request.remote_addr,
|
||||||
|
user_agent=request.headers.get('User-Agent')
|
||||||
|
)
|
||||||
|
|
||||||
|
# Update activity
|
||||||
|
manager.update_session_activity(session_id)
|
||||||
|
|
||||||
|
# Store in g for request access
|
||||||
|
g.user_session = user_session
|
||||||
|
g.session_manager = manager
|
||||||
|
|
||||||
|
# Add CLI commands
|
||||||
|
@app.cli.command('sessions-list')
|
||||||
|
def list_sessions_cmd():
|
||||||
|
"""List all active sessions"""
|
||||||
|
sessions = manager.get_all_sessions_info()
|
||||||
|
for session_info in sessions:
|
||||||
|
print(f"\nSession: {session_info['session_id']}")
|
||||||
|
print(f" Created: {session_info['created_at']}")
|
||||||
|
print(f" Last activity: {session_info['last_activity']}")
|
||||||
|
print(f" Resources: {session_info['resource_count']}")
|
||||||
|
print(f" Bytes used: {session_info['total_bytes_used']}")
|
||||||
|
|
||||||
|
@app.cli.command('sessions-cleanup')
|
||||||
|
def cleanup_sessions_cmd():
|
||||||
|
"""Manual session cleanup"""
|
||||||
|
manager.cleanup_expired_sessions()
|
||||||
|
manager.cleanup_idle_sessions()
|
||||||
|
manager.cleanup_orphaned_files()
|
||||||
|
print("Session cleanup completed")
|
||||||
|
|
||||||
|
@app.cli.command('sessions-stats')
|
||||||
|
def session_stats_cmd():
|
||||||
|
"""Show session statistics"""
|
||||||
|
stats = manager.get_stats()
|
||||||
|
print(json.dumps(stats, indent=2))
|
||||||
|
|
||||||
|
logger.info("Session management initialized")
|
||||||
|
|
||||||
|
# Decorator for session resource tracking
|
||||||
|
def track_resource(resource_type: str):
|
||||||
|
"""Decorator to track resources for a session"""
|
||||||
|
def decorator(func):
|
||||||
|
@wraps(func)
|
||||||
|
def wrapper(*args, **kwargs):
|
||||||
|
result = func(*args, **kwargs)
|
||||||
|
|
||||||
|
# Track resource if in request context
|
||||||
|
if hasattr(g, 'user_session') and hasattr(g, 'session_manager'):
|
||||||
|
if isinstance(result, (str, bytes)) or hasattr(result, 'filename'):
|
||||||
|
# Determine path and size
|
||||||
|
path = None
|
||||||
|
size = 0
|
||||||
|
|
||||||
|
if isinstance(result, str) and os.path.exists(result):
|
||||||
|
path = result
|
||||||
|
size = os.path.getsize(result)
|
||||||
|
elif hasattr(result, 'filename'):
|
||||||
|
path = result.filename
|
||||||
|
if os.path.exists(path):
|
||||||
|
size = os.path.getsize(path)
|
||||||
|
|
||||||
|
# Add resource to session
|
||||||
|
g.session_manager.add_resource(
|
||||||
|
session_id=g.user_session.session_id,
|
||||||
|
resource_type=resource_type,
|
||||||
|
path=path,
|
||||||
|
size_bytes=size
|
||||||
|
)
|
||||||
|
|
||||||
|
return result
|
||||||
|
return wrapper
|
||||||
|
return decorator
|
776
setup-script.sh
776
setup-script.sh
@ -1,776 +0,0 @@
|
|||||||
#!/bin/bash
|
|
||||||
|
|
||||||
# Create necessary directories
|
|
||||||
mkdir -p templates static/{css,js}
|
|
||||||
|
|
||||||
# Move HTML template to templates directory
|
|
||||||
cat > templates/index.html << 'EOL'
|
|
||||||
<!DOCTYPE html>
|
|
||||||
<html lang="en">
|
|
||||||
<head>
|
|
||||||
<meta charset="UTF-8">
|
|
||||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
||||||
<title>Voice Language Translator</title>
|
|
||||||
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0-alpha1/dist/css/bootstrap.min.css" rel="stylesheet">
|
|
||||||
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0/css/all.min.css">
|
|
||||||
<style>
|
|
||||||
body {
|
|
||||||
padding-top: 20px;
|
|
||||||
padding-bottom: 20px;
|
|
||||||
background-color: #f8f9fa;
|
|
||||||
}
|
|
||||||
.record-btn {
|
|
||||||
width: 80px;
|
|
||||||
height: 80px;
|
|
||||||
border-radius: 50%;
|
|
||||||
display: flex;
|
|
||||||
align-items: center;
|
|
||||||
justify-content: center;
|
|
||||||
font-size: 32px;
|
|
||||||
margin: 20px auto;
|
|
||||||
box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
|
|
||||||
transition: all 0.3s;
|
|
||||||
}
|
|
||||||
.record-btn:active {
|
|
||||||
transform: scale(0.95);
|
|
||||||
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
|
|
||||||
}
|
|
||||||
.recording {
|
|
||||||
background-color: #dc3545 !important;
|
|
||||||
animation: pulse 1.5s infinite;
|
|
||||||
}
|
|
||||||
@keyframes pulse {
|
|
||||||
0% {
|
|
||||||
transform: scale(1);
|
|
||||||
}
|
|
||||||
50% {
|
|
||||||
transform: scale(1.05);
|
|
||||||
}
|
|
||||||
100% {
|
|
||||||
transform: scale(1);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
.card {
|
|
||||||
border-radius: 15px;
|
|
||||||
box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
|
|
||||||
margin-bottom: 20px;
|
|
||||||
}
|
|
||||||
.card-header {
|
|
||||||
border-radius: 15px 15px 0 0 !important;
|
|
||||||
}
|
|
||||||
.language-select {
|
|
||||||
border-radius: 10px;
|
|
||||||
padding: 10px;
|
|
||||||
}
|
|
||||||
.text-display {
|
|
||||||
min-height: 100px;
|
|
||||||
padding: 15px;
|
|
||||||
background-color: #f8f9fa;
|
|
||||||
border-radius: 10px;
|
|
||||||
margin-bottom: 15px;
|
|
||||||
}
|
|
||||||
.btn-action {
|
|
||||||
border-radius: 10px;
|
|
||||||
padding: 8px 15px;
|
|
||||||
margin: 5px;
|
|
||||||
}
|
|
||||||
.spinner-border {
|
|
||||||
width: 1rem;
|
|
||||||
height: 1rem;
|
|
||||||
margin-right: 5px;
|
|
||||||
}
|
|
||||||
.status-indicator {
|
|
||||||
font-size: 0.9rem;
|
|
||||||
font-style: italic;
|
|
||||||
color: #6c757d;
|
|
||||||
}
|
|
||||||
</style>
|
|
||||||
</head>
|
|
||||||
<body>
|
|
||||||
<div class="container">
|
|
||||||
<h1 class="text-center mb-4">Voice Language Translator</h1>
|
|
||||||
<p class="text-center text-muted">Powered by Gemma 3, Whisper & Edge TTS</p>
|
|
||||||
|
|
||||||
<div class="row">
|
|
||||||
<div class="col-md-6 mb-3">
|
|
||||||
<div class="card">
|
|
||||||
<div class="card-header bg-primary text-white">
|
|
||||||
<h5 class="mb-0">Source</h5>
|
|
||||||
</div>
|
|
||||||
<div class="card-body">
|
|
||||||
<select id="sourceLanguage" class="form-select language-select mb-3">
|
|
||||||
{% for language in languages %}
|
|
||||||
<option value="{{ language }}">{{ language }}</option>
|
|
||||||
{% endfor %}
|
|
||||||
</select>
|
|
||||||
<div class="text-display" id="sourceText">
|
|
||||||
<p class="text-muted">Your transcribed text will appear here...</p>
|
|
||||||
</div>
|
|
||||||
<div class="d-flex justify-content-between">
|
|
||||||
<button id="playSource" class="btn btn-outline-primary btn-action" disabled>
|
|
||||||
<i class="fas fa-play"></i> Play
|
|
||||||
</button>
|
|
||||||
<button id="clearSource" class="btn btn-outline-secondary btn-action">
|
|
||||||
<i class="fas fa-trash"></i> Clear
|
|
||||||
</button>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="col-md-6 mb-3">
|
|
||||||
<div class="card">
|
|
||||||
<div class="card-header bg-success text-white">
|
|
||||||
<h5 class="mb-0">Translation</h5>
|
|
||||||
</div>
|
|
||||||
<div class="card-body">
|
|
||||||
<select id="targetLanguage" class="form-select language-select mb-3">
|
|
||||||
{% for language in languages %}
|
|
||||||
<option value="{{ language }}">{{ language }}</option>
|
|
||||||
{% endfor %}
|
|
||||||
</select>
|
|
||||||
<div class="text-display" id="translatedText">
|
|
||||||
<p class="text-muted">Translation will appear here...</p>
|
|
||||||
</div>
|
|
||||||
<div class="d-flex justify-content-between">
|
|
||||||
<button id="playTranslation" class="btn btn-outline-success btn-action" disabled>
|
|
||||||
<i class="fas fa-play"></i> Play
|
|
||||||
</button>
|
|
||||||
<button id="clearTranslation" class="btn btn-outline-secondary btn-action">
|
|
||||||
<i class="fas fa-trash"></i> Clear
|
|
||||||
</button>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="text-center">
|
|
||||||
<button id="recordBtn" class="btn btn-primary record-btn">
|
|
||||||
<i class="fas fa-microphone"></i>
|
|
||||||
</button>
|
|
||||||
<p class="status-indicator" id="statusIndicator">Click to start recording</p>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="text-center mt-3">
|
|
||||||
<button id="translateBtn" class="btn btn-success" disabled>
|
|
||||||
<i class="fas fa-language"></i> Translate
|
|
||||||
</button>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="mt-3">
|
|
||||||
<div class="progress d-none" id="progressContainer">
|
|
||||||
<div id="progressBar" class="progress-bar progress-bar-striped progress-bar-animated" role="progressbar" style="width: 0%"></div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<audio id="audioPlayer" style="display: none;"></audio>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0-alpha1/dist/js/bootstrap.bundle.min.js"></script>
|
|
||||||
<script>
|
|
||||||
document.addEventListener('DOMContentLoaded', function() {
|
|
||||||
// DOM elements
|
|
||||||
const recordBtn = document.getElementById('recordBtn');
|
|
||||||
const translateBtn = document.getElementById('translateBtn');
|
|
||||||
const sourceText = document.getElementById('sourceText');
|
|
||||||
const translatedText = document.getElementById('translatedText');
|
|
||||||
const sourceLanguage = document.getElementById('sourceLanguage');
|
|
||||||
const targetLanguage = document.getElementById('targetLanguage');
|
|
||||||
const playSource = document.getElementById('playSource');
|
|
||||||
const playTranslation = document.getElementById('playTranslation');
|
|
||||||
const clearSource = document.getElementById('clearSource');
|
|
||||||
const clearTranslation = document.getElementById('clearTranslation');
|
|
||||||
const statusIndicator = document.getElementById('statusIndicator');
|
|
||||||
const progressContainer = document.getElementById('progressContainer');
|
|
||||||
const progressBar = document.getElementById('progressBar');
|
|
||||||
const audioPlayer = document.getElementById('audioPlayer');
|
|
||||||
|
|
||||||
// Set initial values
|
|
||||||
let isRecording = false;
|
|
||||||
let mediaRecorder = null;
|
|
||||||
let audioChunks = [];
|
|
||||||
let currentSourceText = '';
|
|
||||||
let currentTranslationText = '';
|
|
||||||
|
|
||||||
// Make sure target language is different from source
|
|
||||||
if (targetLanguage.options[0].value === sourceLanguage.value) {
|
|
||||||
targetLanguage.selectedIndex = 1;
|
|
||||||
}
|
|
||||||
|
|
||||||
// Event listeners for language selection
|
|
||||||
sourceLanguage.addEventListener('change', function() {
|
|
||||||
if (targetLanguage.value === sourceLanguage.value) {
|
|
||||||
for (let i = 0; i < targetLanguage.options.length; i++) {
|
|
||||||
if (targetLanguage.options[i].value !== sourceLanguage.value) {
|
|
||||||
targetLanguage.selectedIndex = i;
|
|
||||||
break;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
});
|
|
||||||
|
|
||||||
targetLanguage.addEventListener('change', function() {
|
|
||||||
if (targetLanguage.value === sourceLanguage.value) {
|
|
||||||
for (let i = 0; i < sourceLanguage.options.length; i++) {
|
|
||||||
if (sourceLanguage.options[i].value !== targetLanguage.value) {
|
|
||||||
sourceLanguage.selectedIndex = i;
|
|
||||||
break;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
});
|
|
||||||
|
|
||||||
// Record button click event
|
|
||||||
recordBtn.addEventListener('click', function() {
|
|
||||||
if (isRecording) {
|
|
||||||
stopRecording();
|
|
||||||
} else {
|
|
||||||
startRecording();
|
|
||||||
}
|
|
||||||
});
|
|
||||||
|
|
||||||
// Function to start recording
|
|
||||||
function startRecording() {
|
|
||||||
navigator.mediaDevices.getUserMedia({ audio: true })
|
|
||||||
.then(stream => {
|
|
||||||
mediaRecorder = new MediaRecorder(stream);
|
|
||||||
audioChunks = [];
|
|
||||||
|
|
||||||
mediaRecorder.addEventListener('dataavailable', event => {
|
|
||||||
audioChunks.push(event.data);
|
|
||||||
});
|
|
||||||
|
|
||||||
mediaRecorder.addEventListener('stop', () => {
|
|
||||||
const audioBlob = new Blob(audioChunks, { type: 'audio/wav' });
|
|
||||||
transcribeAudio(audioBlob);
|
|
||||||
});
|
|
||||||
|
|
||||||
mediaRecorder.start();
|
|
||||||
isRecording = true;
|
|
||||||
recordBtn.classList.add('recording');
|
|
||||||
recordBtn.classList.replace('btn-primary', 'btn-danger');
|
|
||||||
recordBtn.innerHTML = '<i class="fas fa-stop"></i>';
|
|
||||||
statusIndicator.textContent = 'Recording... Click to stop';
|
|
||||||
})
|
|
||||||
.catch(error => {
|
|
||||||
console.error('Error accessing microphone:', error);
|
|
||||||
alert('Error accessing microphone. Please make sure you have given permission for microphone access.');
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
// Function to stop recording
|
|
||||||
function stopRecording() {
|
|
||||||
mediaRecorder.stop();
|
|
||||||
isRecording = false;
|
|
||||||
recordBtn.classList.remove('recording');
|
|
||||||
recordBtn.classList.replace('btn-danger', 'btn-primary');
|
|
||||||
recordBtn.innerHTML = '<i class="fas fa-microphone"></i>';
|
|
||||||
statusIndicator.textContent = 'Processing audio...';
|
|
||||||
|
|
||||||
// Stop all audio tracks
|
|
||||||
mediaRecorder.stream.getTracks().forEach(track => track.stop());
|
|
||||||
}
|
|
||||||
|
|
||||||
// Function to transcribe audio
|
|
||||||
function transcribeAudio(audioBlob) {
|
|
||||||
const formData = new FormData();
|
|
||||||
formData.append('audio', audioBlob);
|
|
||||||
formData.append('source_lang', sourceLanguage.value);
|
|
||||||
|
|
||||||
showProgress();
|
|
||||||
|
|
||||||
fetch('/transcribe', {
|
|
||||||
method: 'POST',
|
|
||||||
body: formData
|
|
||||||
})
|
|
||||||
.then(response => response.json())
|
|
||||||
.then(data => {
|
|
||||||
hideProgress();
|
|
||||||
|
|
||||||
if (data.success) {
|
|
||||||
currentSourceText = data.text;
|
|
||||||
sourceText.innerHTML = `<p>${data.text}</p>`;
|
|
||||||
playSource.disabled = false;
|
|
||||||
translateBtn.disabled = false;
|
|
||||||
statusIndicator.textContent = 'Transcription complete';
|
|
||||||
} else {
|
|
||||||
sourceText.innerHTML = `<p class="text-danger">Error: ${data.error}</p>`;
|
|
||||||
statusIndicator.textContent = 'Transcription failed';
|
|
||||||
}
|
|
||||||
})
|
|
||||||
.catch(error => {
|
|
||||||
hideProgress();
|
|
||||||
console.error('Transcription error:', error);
|
|
||||||
sourceText.innerHTML = `<p class="text-danger">Failed to transcribe audio. Please try again.</p>`;
|
|
||||||
statusIndicator.textContent = 'Transcription failed';
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
// Translate button click event
|
|
||||||
translateBtn.addEventListener('click', function() {
|
|
||||||
if (!currentSourceText) {
|
|
||||||
return;
|
|
||||||
}
|
|
||||||
|
|
||||||
statusIndicator.textContent = 'Translating...';
|
|
||||||
showProgress();
|
|
||||||
|
|
||||||
fetch('/translate', {
|
|
||||||
method: 'POST',
|
|
||||||
headers: {
|
|
||||||
'Content-Type': 'application/json'
|
|
||||||
},
|
|
||||||
body: JSON.stringify({
|
|
||||||
text: currentSourceText,
|
|
||||||
source_lang: sourceLanguage.value,
|
|
||||||
target_lang: targetLanguage.value
|
|
||||||
})
|
|
||||||
})
|
|
||||||
.then(response => response.json())
|
|
||||||
.then(data => {
|
|
||||||
hideProgress();
|
|
||||||
|
|
||||||
if (data.success) {
|
|
||||||
currentTranslationText = data.translation;
|
|
||||||
translatedText.innerHTML = `<p>${data.translation}</p>`;
|
|
||||||
playTranslation.disabled = false;
|
|
||||||
statusIndicator.textContent = 'Translation complete';
|
|
||||||
} else {
|
|
||||||
translatedText.innerHTML = `<p class="text-danger">Error: ${data.error}</p>`;
|
|
||||||
statusIndicator.textContent = 'Translation failed';
|
|
||||||
}
|
|
||||||
})
|
|
||||||
.catch(error => {
|
|
||||||
hideProgress();
|
|
||||||
console.error('Translation error:', error);
|
|
||||||
translatedText.innerHTML = `<p class="text-danger">Failed to translate. Please try again.</p>`;
|
|
||||||
statusIndicator.textContent = 'Translation failed';
|
|
||||||
});
|
|
||||||
});
|
|
||||||
|
|
||||||
// Play source text
|
|
||||||
playSource.addEventListener('click', function() {
|
|
||||||
if (!currentSourceText) return;
|
|
||||||
|
|
||||||
playAudio(currentSourceText, sourceLanguage.value);
|
|
||||||
statusIndicator.textContent = 'Playing source audio...';
|
|
||||||
});
|
|
||||||
|
|
||||||
// Play translation
|
|
||||||
playTranslation.addEventListener('click', function() {
|
|
||||||
if (!currentTranslationText) return;
|
|
||||||
|
|
||||||
playAudio(currentTranslationText, targetLanguage.value);
|
|
||||||
statusIndicator.textContent = 'Playing translation audio...';
|
|
||||||
});
|
|
||||||
|
|
||||||
// Function to play audio via TTS
|
|
||||||
function playAudio(text, language) {
|
|
||||||
showProgress();
|
|
||||||
|
|
||||||
fetch('/speak', {
|
|
||||||
method: 'POST',
|
|
||||||
headers: {
|
|
||||||
'Content-Type': 'application/json'
|
|
||||||
},
|
|
||||||
body: JSON.stringify({
|
|
||||||
text: text,
|
|
||||||
language: language
|
|
||||||
})
|
|
||||||
})
|
|
||||||
.then(response => response.json())
|
|
||||||
.then(data => {
|
|
||||||
hideProgress();
|
|
||||||
|
|
||||||
if (data.success) {
|
|
||||||
audioPlayer.src = data.audio_url;
|
|
||||||
audioPlayer.onended = function() {
|
|
||||||
statusIndicator.textContent = 'Ready';
|
|
||||||
};
|
|
||||||
audioPlayer.play();
|
|
||||||
} else {
|
|
||||||
statusIndicator.textContent = 'TTS failed';
|
|
||||||
alert('Failed to play audio: ' + data.error);
|
|
||||||
}
|
|
||||||
})
|
|
||||||
.catch(error => {
|
|
||||||
hideProgress();
|
|
||||||
console.error('TTS error:', error);
|
|
||||||
statusIndicator.textContent = 'TTS failed';
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
// Clear buttons
|
|
||||||
clearSource.addEventListener('click', function() {
|
|
||||||
sourceText.innerHTML = '<p class="text-muted">Your transcribed text will appear here...</p>';
|
|
||||||
currentSourceText = '';
|
|
||||||
playSource.disabled = true;
|
|
||||||
translateBtn.disabled = true;
|
|
||||||
});
|
|
||||||
|
|
||||||
clearTranslation.addEventListener('click', function() {
|
|
||||||
translatedText.innerHTML = '<p class="text-muted">Translation will appear here...</p>';
|
|
||||||
currentTranslationText = '';
|
|
||||||
playTranslation.disabled = true;
|
|
||||||
});
|
|
||||||
|
|
||||||
// Progress indicator functions
|
|
||||||
function showProgress() {
|
|
||||||
progressContainer.classList.remove('d-none');
|
|
||||||
let progress = 0;
|
|
||||||
const interval = setInterval(() => {
|
|
||||||
progress += 5;
|
|
||||||
if (progress > 90) {
|
|
||||||
clearInterval(interval);
|
|
||||||
}
|
|
||||||
progressBar.style.width = `${progress}%`;
|
|
||||||
}, 100);
|
|
||||||
progressBar.dataset.interval = interval;
|
|
||||||
}
|
|
||||||
|
|
||||||
function hideProgress() {
|
|
||||||
const interval = progressBar.dataset.interval;
|
|
||||||
if (interval) {
|
|
||||||
clearInterval(Number(interval));
|
|
||||||
}
|
|
||||||
progressBar.style.width = '100%';
|
|
||||||
setTimeout(() => {
|
|
||||||
progressContainer.classList.add('d-none');
|
|
||||||
progressBar.style.width = '0%';
|
|
||||||
}, 500);
|
|
||||||
}
|
|
||||||
});
|
|
||||||
</script>
|
|
||||||
</body>
|
|
||||||
</html>
|
|
||||||
EOL
|
|
||||||
|
|
||||||
# Create app.py
|
|
||||||
cat > app.py << 'EOL'
|
|
||||||
import os
|
|
||||||
import time
|
|
||||||
import tempfile
|
|
||||||
import requests
|
|
||||||
import json
|
|
||||||
from flask import Flask, render_template, request, jsonify, Response, send_file
|
|
||||||
import whisper
|
|
||||||
import torch
|
|
||||||
import ollama
|
|
||||||
import logging
|
|
||||||
|
|
||||||
app = Flask(__name__)
|
|
||||||
app.config['UPLOAD_FOLDER'] = tempfile.mkdtemp()
|
|
||||||
app.config['TTS_SERVER'] = os.environ.get('TTS_SERVER_URL', 'http://localhost:5050/v1/audio/speech')
|
|
||||||
app.config['TTS_API_KEY'] = os.environ.get('TTS_API_KEY', 'your_api_key_here')
|
|
||||||
|
|
||||||
# Add a route to check TTS server status
|
|
||||||
@app.route('/check_tts_server', methods=['GET'])
|
|
||||||
def check_tts_server():
|
|
||||||
try:
|
|
||||||
# Try a simple HTTP request to the TTS server
|
|
||||||
response = requests.get(app.config['TTS_SERVER'].rsplit('/api/generate', 1)[0] + '/status', timeout=5)
|
|
||||||
if response.status_code == 200:
|
|
||||||
return jsonify({
|
|
||||||
'status': 'online',
|
|
||||||
'url': app.config['TTS_SERVER']
|
|
||||||
})
|
|
||||||
else:
|
|
||||||
return jsonify({
|
|
||||||
'status': 'error',
|
|
||||||
'message': f'TTS server returned status code {response.status_code}',
|
|
||||||
'url': app.config['TTS_SERVER']
|
|
||||||
})
|
|
||||||
except requests.exceptions.RequestException as e:
|
|
||||||
return jsonify({
|
|
||||||
'status': 'error',
|
|
||||||
'message': f'Cannot connect to TTS server: {str(e)}',
|
|
||||||
'url': app.config['TTS_SERVER']
|
|
||||||
})
|
|
||||||
|
|
||||||
# Initialize logging
|
|
||||||
logging.basicConfig(level=logging.INFO)
|
|
||||||
logger = logging.getLogger(__name__)
|
|
||||||
|
|
||||||
# Load Whisper model
|
|
||||||
logger.info("Loading Whisper model...")
|
|
||||||
whisper_model = whisper.load_model("base")
|
|
||||||
logger.info("Whisper model loaded successfully")
|
|
||||||
|
|
||||||
# Supported languages
|
|
||||||
SUPPORTED_LANGUAGES = {
|
|
||||||
"ar": "Arabic",
|
|
||||||
"hy": "Armenian",
|
|
||||||
"az": "Azerbaijani",
|
|
||||||
"en": "English",
|
|
||||||
"fr": "French",
|
|
||||||
"ka": "Georgian",
|
|
||||||
"kk": "Kazakh",
|
|
||||||
"zh": "Mandarin",
|
|
||||||
"fa": "Farsi",
|
|
||||||
"pt": "Portuguese",
|
|
||||||
"ru": "Russian",
|
|
||||||
"es": "Spanish",
|
|
||||||
"tr": "Turkish",
|
|
||||||
"uz": "Uzbek"
|
|
||||||
}
|
|
||||||
|
|
||||||
# Map language names to language codes
|
|
||||||
LANGUAGE_TO_CODE = {v: k for k, v in SUPPORTED_LANGUAGES.items()}
|
|
||||||
|
|
||||||
# Map language names to OpenAI TTS voice options
|
|
||||||
LANGUAGE_TO_VOICE = {
|
|
||||||
"Arabic": "alloy", # Using OpenAI general voices
|
|
||||||
"Armenian": "echo", # as OpenAI doesn't have specific voices
|
|
||||||
"Azerbaijani": "nova", # for all these languages
|
|
||||||
"English": "echo", # We'll use the available voices
|
|
||||||
"French": "alloy", # and rely on the translation being
|
|
||||||
"Georgian": "fable", # in the correct language text
|
|
||||||
"Kazakh": "onyx",
|
|
||||||
"Mandarin": "shimmer",
|
|
||||||
"Farsi": "nova",
|
|
||||||
"Portuguese": "alloy",
|
|
||||||
"Russian": "echo",
|
|
||||||
"Spanish": "nova",
|
|
||||||
"Turkish": "fable",
|
|
||||||
"Uzbek": "onyx"
|
|
||||||
}
|
|
||||||
|
|
||||||
@app.route('/')
|
|
||||||
def index():
|
|
||||||
return render_template('index.html', languages=sorted(SUPPORTED_LANGUAGES.values()))
|
|
||||||
|
|
||||||
@app.route('/transcribe', methods=['POST'])
|
|
||||||
def transcribe():
|
|
||||||
if 'audio' not in request.files:
|
|
||||||
return jsonify({'error': 'No audio file provided'}), 400
|
|
||||||
|
|
||||||
audio_file = request.files['audio']
|
|
||||||
source_lang = request.form.get('source_lang', '')
|
|
||||||
|
|
||||||
# Save the audio file temporarily
|
|
||||||
temp_path = os.path.join(app.config['UPLOAD_FOLDER'], 'input_audio.wav')
|
|
||||||
audio_file.save(temp_path)
|
|
||||||
|
|
||||||
try:
|
|
||||||
# Use Whisper for transcription
|
|
||||||
result = whisper_model.transcribe(
|
|
||||||
temp_path,
|
|
||||||
language=LANGUAGE_TO_CODE.get(source_lang, None)
|
|
||||||
)
|
|
||||||
transcribed_text = result["text"]
|
|
||||||
|
|
||||||
return jsonify({
|
|
||||||
'success': True,
|
|
||||||
'text': transcribed_text
|
|
||||||
})
|
|
||||||
except Exception as e:
|
|
||||||
logger.error(f"Transcription error: {str(e)}")
|
|
||||||
return jsonify({'error': f'Transcription failed: {str(e)}'}), 500
|
|
||||||
finally:
|
|
||||||
# Clean up the temporary file
|
|
||||||
if os.path.exists(temp_path):
|
|
||||||
os.remove(temp_path)
|
|
||||||
|
|
||||||
@app.route('/translate', methods=['POST'])
|
|
||||||
def translate():
|
|
||||||
try:
|
|
||||||
data = request.json
|
|
||||||
text = data.get('text', '')
|
|
||||||
source_lang = data.get('source_lang', '')
|
|
||||||
target_lang = data.get('target_lang', '')
|
|
||||||
|
|
||||||
if not text or not source_lang or not target_lang:
|
|
||||||
return jsonify({'error': 'Missing required parameters'}), 400
|
|
||||||
|
|
||||||
# Create a prompt for Gemma 3 translation
|
|
||||||
prompt = f"""
|
|
||||||
Translate the following text from {source_lang} to {target_lang}:
|
|
||||||
|
|
||||||
"{text}"
|
|
||||||
|
|
||||||
Provide only the translation without any additional text.
|
|
||||||
"""
|
|
||||||
|
|
||||||
# Use Ollama to interact with Gemma 3
|
|
||||||
response = ollama.chat(
|
|
||||||
model="gemma3",
|
|
||||||
messages=[
|
|
||||||
{
|
|
||||||
"role": "user",
|
|
||||||
"content": prompt
|
|
||||||
}
|
|
||||||
]
|
|
||||||
)
|
|
||||||
|
|
||||||
translated_text = response['message']['content'].strip()
|
|
||||||
|
|
||||||
return jsonify({
|
|
||||||
'success': True,
|
|
||||||
'translation': translated_text
|
|
||||||
})
|
|
||||||
except Exception as e:
|
|
||||||
logger.error(f"Translation error: {str(e)}")
|
|
||||||
return jsonify({'error': f'Translation failed: {str(e)}'}), 500
|
|
||||||
|
|
||||||
@app.route('/speak', methods=['POST'])
|
|
||||||
def speak():
|
|
||||||
try:
|
|
||||||
data = request.json
|
|
||||||
text = data.get('text', '')
|
|
||||||
language = data.get('language', '')
|
|
||||||
|
|
||||||
if not text or not language:
|
|
||||||
return jsonify({'error': 'Missing required parameters'}), 400
|
|
||||||
|
|
||||||
voice = LANGUAGE_TO_VOICE.get(language)
|
|
||||||
if not voice:
|
|
||||||
return jsonify({'error': 'Unsupported language for TTS'}), 400
|
|
||||||
|
|
||||||
# Get TTS server URL from environment or config
|
|
||||||
tts_server_url = app.config['TTS_SERVER']
|
|
||||||
|
|
||||||
try:
|
|
||||||
# Request TTS from the Edge TTS server
|
|
||||||
logger.info(f"Sending TTS request to {tts_server_url}")
|
|
||||||
tts_response = requests.post(
|
|
||||||
tts_server_url,
|
|
||||||
json={
|
|
||||||
'text': text,
|
|
||||||
'voice': voice,
|
|
||||||
'output_format': 'mp3'
|
|
||||||
},
|
|
||||||
timeout=10 # Add timeout
|
|
||||||
)
|
|
||||||
|
|
||||||
logger.info(f"TTS response status: {tts_response.status_code}")
|
|
||||||
|
|
||||||
if tts_response.status_code != 200:
|
|
||||||
error_msg = f'TTS request failed with status {tts_response.status_code}'
|
|
||||||
logger.error(error_msg)
|
|
||||||
|
|
||||||
# Try to get error details from response if possible
|
|
||||||
try:
|
|
||||||
error_details = tts_response.json()
|
|
||||||
logger.error(f"Error details: {error_details}")
|
|
||||||
except:
|
|
||||||
pass
|
|
||||||
|
|
||||||
return jsonify({'error': error_msg}), 500
|
|
||||||
|
|
||||||
# The response contains the audio data directly
|
|
||||||
temp_audio_path = os.path.join(app.config['UPLOAD_FOLDER'], f'output_{int(time.time())}.mp3')
|
|
||||||
with open(temp_audio_path, 'wb') as f:
|
|
||||||
f.write(tts_response.content)
|
|
||||||
|
|
||||||
return jsonify({
|
|
||||||
'success': True,
|
|
||||||
'audio_url': f'/get_audio/{os.path.basename(temp_audio_path)}'
|
|
||||||
})
|
|
||||||
except requests.exceptions.RequestException as e:
|
|
||||||
error_msg = f'Failed to connect to TTS server: {str(e)}'
|
|
||||||
logger.error(error_msg)
|
|
||||||
return jsonify({'error': error_msg}), 500
|
|
||||||
except Exception as e:
|
|
||||||
logger.error(f"TTS error: {str(e)}")
|
|
||||||
return jsonify({'error': f'TTS failed: {str(e)}'}), 500
|
|
||||||
|
|
||||||
@app.route('/get_audio/<filename>')
|
|
||||||
def get_audio(filename):
|
|
||||||
try:
|
|
||||||
file_path = os.path.join(app.config['UPLOAD_FOLDER'], filename)
|
|
||||||
return send_file(file_path, mimetype='audio/mpeg')
|
|
||||||
except Exception as e:
|
|
||||||
logger.error(f"Audio retrieval error: {str(e)}")
|
|
||||||
return jsonify({'error': f'Audio retrieval failed: {str(e)}'}), 500
|
|
||||||
|
|
||||||
if __name__ == '__main__':
|
|
||||||
app.run(host='0.0.0.0', port=8000, debug=True)
|
|
||||||
EOL
|
|
||||||
|
|
||||||
# Create requirements.txt
|
|
||||||
cat > requirements.txt << 'EOL'
|
|
||||||
flask==2.3.2
|
|
||||||
requests==2.31.0
|
|
||||||
openai-whisper==20231117
|
|
||||||
torch==2.1.0
|
|
||||||
ollama==0.1.5
|
|
||||||
EOL
|
|
||||||
|
|
||||||
# Create README.md
|
|
||||||
cat > README.md << 'EOL'
|
|
||||||
# Voice Language Translator
|
|
||||||
|
|
||||||
A mobile-friendly web application that translates spoken language between multiple languages using:
|
|
||||||
- Gemma 3 open-source LLM via Ollama for translation
|
|
||||||
- OpenAI Whisper for speech-to-text
|
|
||||||
- OpenAI Edge TTS for text-to-speech
|
|
||||||
|
|
||||||
## Supported Languages
|
|
||||||
|
|
||||||
- Arabic
|
|
||||||
- Armenian
|
|
||||||
- Azerbaijani
|
|
||||||
- English
|
|
||||||
- French
|
|
||||||
- Georgian
|
|
||||||
- Kazakh
|
|
||||||
- Mandarin
|
|
||||||
- Farsi
|
|
||||||
- Portuguese
|
|
||||||
- Russian
|
|
||||||
- Spanish
|
|
||||||
- Turkish
|
|
||||||
- Uzbek
|
|
||||||
|
|
||||||
## Setup Instructions
|
|
||||||
|
|
||||||
1. Install the required Python packages:
|
|
||||||
```
|
|
||||||
pip install -r requirements.txt
|
|
||||||
```
|
|
||||||
|
|
||||||
2. Make sure you have Ollama installed and the Gemma 3 model loaded:
|
|
||||||
```
|
|
||||||
ollama pull gemma3
|
|
||||||
```
|
|
||||||
|
|
||||||
3. Ensure your OpenAI Edge TTS server is running on port 5050.
|
|
||||||
|
|
||||||
4. Run the application:
|
|
||||||
```
|
|
||||||
python app.py
|
|
||||||
```
|
|
||||||
|
|
||||||
5. Open your browser and navigate to:
|
|
||||||
```
|
|
||||||
http://localhost:8000
|
|
||||||
```
|
|
||||||
|
|
||||||
## Usage
|
|
||||||
|
|
||||||
1. Select your source language from the dropdown menu
|
|
||||||
2. Press the microphone button and speak
|
|
||||||
3. Press the button again to stop recording
|
|
||||||
4. Wait for the transcription to complete
|
|
||||||
5. Select your target language
|
|
||||||
6. Press the "Translate" button
|
|
||||||
7. Use the play buttons to hear the original or translated text
|
|
||||||
|
|
||||||
## Technical Details
|
|
||||||
|
|
||||||
- The app uses Flask for the web server
|
|
||||||
- Audio is processed client-side using the MediaRecorder API
|
|
||||||
- Whisper for speech recognition with language hints
|
|
||||||
- Ollama provides access to the Gemma 3 model for translation
|
|
||||||
- OpenAI Edge TTS delivers natural-sounding speech output
|
|
||||||
|
|
||||||
## Mobile Support
|
|
||||||
|
|
||||||
The interface is fully responsive and designed to work well on mobile devices.
|
|
||||||
EOL
|
|
||||||
|
|
||||||
# Make the script executable
|
|
||||||
chmod +x app.py
|
|
||||||
|
|
||||||
echo "Setup complete! Run the app with: python app.py"
|
|
@ -0,0 +1,559 @@
|
|||||||
|
/* Main styles for Talk2Me application */
|
||||||
|
|
||||||
|
/* Loading animations */
|
||||||
|
.loading-dots {
|
||||||
|
display: inline-flex;
|
||||||
|
align-items: center;
|
||||||
|
gap: 4px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.loading-dots span {
|
||||||
|
width: 8px;
|
||||||
|
height: 8px;
|
||||||
|
border-radius: 50%;
|
||||||
|
background-color: #007bff;
|
||||||
|
animation: dotPulse 1.4s infinite ease-in-out both;
|
||||||
|
}
|
||||||
|
|
||||||
|
.loading-dots span:nth-child(1) {
|
||||||
|
animation-delay: -0.32s;
|
||||||
|
}
|
||||||
|
|
||||||
|
.loading-dots span:nth-child(2) {
|
||||||
|
animation-delay: -0.16s;
|
||||||
|
}
|
||||||
|
|
||||||
|
@keyframes dotPulse {
|
||||||
|
0%, 80%, 100% {
|
||||||
|
transform: scale(0);
|
||||||
|
opacity: 0.5;
|
||||||
|
}
|
||||||
|
40% {
|
||||||
|
transform: scale(1);
|
||||||
|
opacity: 1;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Wave animation for recording */
|
||||||
|
.recording-wave {
|
||||||
|
position: relative;
|
||||||
|
display: inline-block;
|
||||||
|
width: 40px;
|
||||||
|
height: 40px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.recording-wave span {
|
||||||
|
position: absolute;
|
||||||
|
bottom: 0;
|
||||||
|
width: 4px;
|
||||||
|
height: 100%;
|
||||||
|
background: #fff;
|
||||||
|
border-radius: 2px;
|
||||||
|
animation: wave 1.2s linear infinite;
|
||||||
|
}
|
||||||
|
|
||||||
|
.recording-wave span:nth-child(1) {
|
||||||
|
left: 0;
|
||||||
|
animation-delay: 0s;
|
||||||
|
}
|
||||||
|
|
||||||
|
.recording-wave span:nth-child(2) {
|
||||||
|
left: 8px;
|
||||||
|
animation-delay: -1.1s;
|
||||||
|
}
|
||||||
|
|
||||||
|
.recording-wave span:nth-child(3) {
|
||||||
|
left: 16px;
|
||||||
|
animation-delay: -1s;
|
||||||
|
}
|
||||||
|
|
||||||
|
.recording-wave span:nth-child(4) {
|
||||||
|
left: 24px;
|
||||||
|
animation-delay: -0.9s;
|
||||||
|
}
|
||||||
|
|
||||||
|
.recording-wave span:nth-child(5) {
|
||||||
|
left: 32px;
|
||||||
|
animation-delay: -0.8s;
|
||||||
|
}
|
||||||
|
|
||||||
|
@keyframes wave {
|
||||||
|
0%, 40%, 100% {
|
||||||
|
transform: scaleY(0.4);
|
||||||
|
}
|
||||||
|
20% {
|
||||||
|
transform: scaleY(1);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Spinner animation */
|
||||||
|
.spinner-custom {
|
||||||
|
width: 40px;
|
||||||
|
height: 40px;
|
||||||
|
position: relative;
|
||||||
|
display: inline-block;
|
||||||
|
}
|
||||||
|
|
||||||
|
.spinner-custom::before {
|
||||||
|
content: '';
|
||||||
|
position: absolute;
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
border-radius: 50%;
|
||||||
|
border: 3px solid rgba(0, 123, 255, 0.2);
|
||||||
|
}
|
||||||
|
|
||||||
|
.spinner-custom::after {
|
||||||
|
content: '';
|
||||||
|
position: absolute;
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
border-radius: 50%;
|
||||||
|
border: 3px solid transparent;
|
||||||
|
border-top-color: #007bff;
|
||||||
|
animation: spin 0.8s linear infinite;
|
||||||
|
}
|
||||||
|
|
||||||
|
@keyframes spin {
|
||||||
|
to {
|
||||||
|
transform: rotate(360deg);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Translation animation */
|
||||||
|
.translation-animation {
|
||||||
|
position: relative;
|
||||||
|
display: inline-flex;
|
||||||
|
align-items: center;
|
||||||
|
gap: 10px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.translation-animation .arrow {
|
||||||
|
width: 30px;
|
||||||
|
height: 2px;
|
||||||
|
background: #28a745;
|
||||||
|
position: relative;
|
||||||
|
animation: moveArrow 1.5s infinite;
|
||||||
|
}
|
||||||
|
|
||||||
|
.translation-animation .arrow::after {
|
||||||
|
content: '';
|
||||||
|
position: absolute;
|
||||||
|
right: -8px;
|
||||||
|
top: -4px;
|
||||||
|
width: 0;
|
||||||
|
height: 0;
|
||||||
|
border-left: 8px solid #28a745;
|
||||||
|
border-top: 5px solid transparent;
|
||||||
|
border-bottom: 5px solid transparent;
|
||||||
|
}
|
||||||
|
|
||||||
|
@keyframes moveArrow {
|
||||||
|
0%, 100% {
|
||||||
|
transform: translateX(0);
|
||||||
|
}
|
||||||
|
50% {
|
||||||
|
transform: translateX(10px);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Processing text animation */
|
||||||
|
.processing-text {
|
||||||
|
display: inline-block;
|
||||||
|
position: relative;
|
||||||
|
font-style: italic;
|
||||||
|
color: #6c757d;
|
||||||
|
}
|
||||||
|
|
||||||
|
.processing-text::after {
|
||||||
|
content: '';
|
||||||
|
position: absolute;
|
||||||
|
bottom: -2px;
|
||||||
|
left: 0;
|
||||||
|
width: 100%;
|
||||||
|
height: 2px;
|
||||||
|
background: linear-gradient(90deg,
|
||||||
|
transparent 0%,
|
||||||
|
#007bff 50%,
|
||||||
|
transparent 100%);
|
||||||
|
animation: processLine 2s linear infinite;
|
||||||
|
}
|
||||||
|
|
||||||
|
@keyframes processLine {
|
||||||
|
0% {
|
||||||
|
transform: translateX(-100%);
|
||||||
|
}
|
||||||
|
100% {
|
||||||
|
transform: translateX(100%);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Fade in animation for results */
|
||||||
|
.fade-in {
|
||||||
|
animation: fadeIn 0.5s ease-in;
|
||||||
|
}
|
||||||
|
|
||||||
|
@keyframes fadeIn {
|
||||||
|
from {
|
||||||
|
opacity: 0;
|
||||||
|
transform: translateY(10px);
|
||||||
|
}
|
||||||
|
to {
|
||||||
|
opacity: 1;
|
||||||
|
transform: translateY(0);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Pulse animation for buttons */
|
||||||
|
.btn-pulse {
|
||||||
|
animation: pulse 2s infinite;
|
||||||
|
}
|
||||||
|
|
||||||
|
@keyframes pulse {
|
||||||
|
0% {
|
||||||
|
box-shadow: 0 0 0 0 rgba(0, 123, 255, 0.7);
|
||||||
|
}
|
||||||
|
70% {
|
||||||
|
box-shadow: 0 0 0 10px rgba(0, 123, 255, 0);
|
||||||
|
}
|
||||||
|
100% {
|
||||||
|
box-shadow: 0 0 0 0 rgba(0, 123, 255, 0);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Loading overlay */
|
||||||
|
.loading-overlay {
|
||||||
|
position: fixed;
|
||||||
|
top: 0;
|
||||||
|
left: 0;
|
||||||
|
right: 0;
|
||||||
|
bottom: 0;
|
||||||
|
background: rgba(255, 255, 255, 0.9);
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
z-index: 9999;
|
||||||
|
opacity: 0;
|
||||||
|
pointer-events: none;
|
||||||
|
transition: opacity 0.3s ease;
|
||||||
|
}
|
||||||
|
|
||||||
|
.loading-overlay.active {
|
||||||
|
opacity: 1;
|
||||||
|
pointer-events: all;
|
||||||
|
}
|
||||||
|
|
||||||
|
.loading-content {
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.loading-content .spinner-custom {
|
||||||
|
margin-bottom: 20px;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Status indicator animations */
|
||||||
|
.status-indicator {
|
||||||
|
transition: all 0.3s ease;
|
||||||
|
}
|
||||||
|
|
||||||
|
.status-indicator.processing {
|
||||||
|
font-weight: 500;
|
||||||
|
color: #007bff;
|
||||||
|
}
|
||||||
|
|
||||||
|
.status-indicator.success {
|
||||||
|
color: #28a745;
|
||||||
|
}
|
||||||
|
|
||||||
|
.status-indicator.error {
|
||||||
|
color: #dc3545;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Card loading state */
|
||||||
|
.card-loading {
|
||||||
|
position: relative;
|
||||||
|
overflow: hidden;
|
||||||
|
}
|
||||||
|
|
||||||
|
.card-loading::after {
|
||||||
|
content: '';
|
||||||
|
position: absolute;
|
||||||
|
top: 0;
|
||||||
|
left: -100%;
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
background: linear-gradient(
|
||||||
|
90deg,
|
||||||
|
transparent,
|
||||||
|
rgba(255, 255, 255, 0.4),
|
||||||
|
transparent
|
||||||
|
);
|
||||||
|
animation: shimmer 2s infinite;
|
||||||
|
}
|
||||||
|
|
||||||
|
@keyframes shimmer {
|
||||||
|
100% {
|
||||||
|
left: 100%;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Text skeleton loader */
|
||||||
|
.skeleton-loader {
|
||||||
|
background: #eee;
|
||||||
|
background: linear-gradient(90deg, #eee 25%, #f5f5f5 50%, #eee 75%);
|
||||||
|
background-size: 200% 100%;
|
||||||
|
animation: loading 1.5s infinite;
|
||||||
|
border-radius: 4px;
|
||||||
|
height: 20px;
|
||||||
|
margin: 10px 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
@keyframes loading {
|
||||||
|
0% {
|
||||||
|
background-position: 200% 0;
|
||||||
|
}
|
||||||
|
100% {
|
||||||
|
background-position: -200% 0;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Audio playing animation */
|
||||||
|
.audio-playing {
|
||||||
|
display: inline-flex;
|
||||||
|
align-items: flex-end;
|
||||||
|
gap: 2px;
|
||||||
|
height: 20px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.audio-playing span {
|
||||||
|
width: 3px;
|
||||||
|
background: #28a745;
|
||||||
|
animation: audioBar 0.5s ease-in-out infinite alternate;
|
||||||
|
}
|
||||||
|
|
||||||
|
.audio-playing span:nth-child(1) {
|
||||||
|
height: 40%;
|
||||||
|
animation-delay: 0s;
|
||||||
|
}
|
||||||
|
|
||||||
|
.audio-playing span:nth-child(2) {
|
||||||
|
height: 60%;
|
||||||
|
animation-delay: 0.1s;
|
||||||
|
}
|
||||||
|
|
||||||
|
.audio-playing span:nth-child(3) {
|
||||||
|
height: 80%;
|
||||||
|
animation-delay: 0.2s;
|
||||||
|
}
|
||||||
|
|
||||||
|
.audio-playing span:nth-child(4) {
|
||||||
|
height: 60%;
|
||||||
|
animation-delay: 0.3s;
|
||||||
|
}
|
||||||
|
|
||||||
|
.audio-playing span:nth-child(5) {
|
||||||
|
height: 40%;
|
||||||
|
animation-delay: 0.4s;
|
||||||
|
}
|
||||||
|
|
||||||
|
@keyframes audioBar {
|
||||||
|
to {
|
||||||
|
height: 100%;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Smooth transitions */
|
||||||
|
.btn {
|
||||||
|
transition: all 0.3s ease;
|
||||||
|
}
|
||||||
|
|
||||||
|
.card {
|
||||||
|
transition: transform 0.3s ease, box-shadow 0.3s ease;
|
||||||
|
}
|
||||||
|
|
||||||
|
.card:hover {
|
||||||
|
transform: translateY(-2px);
|
||||||
|
box-shadow: 0 6px 12px rgba(0, 0, 0, 0.15);
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Success notification */
|
||||||
|
.success-notification {
|
||||||
|
position: fixed;
|
||||||
|
top: 20px;
|
||||||
|
left: 50%;
|
||||||
|
transform: translateX(-50%);
|
||||||
|
background-color: #28a745;
|
||||||
|
color: white;
|
||||||
|
padding: 12px 24px;
|
||||||
|
border-radius: 8px;
|
||||||
|
box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
gap: 10px;
|
||||||
|
z-index: 9999;
|
||||||
|
opacity: 0;
|
||||||
|
transition: opacity 0.3s ease, transform 0.3s ease;
|
||||||
|
pointer-events: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
.success-notification.show {
|
||||||
|
opacity: 1;
|
||||||
|
transform: translateX(-50%) translateY(0);
|
||||||
|
pointer-events: all;
|
||||||
|
}
|
||||||
|
|
||||||
|
.success-notification i {
|
||||||
|
font-size: 18px;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Mobile optimizations */
|
||||||
|
@media (max-width: 768px) {
|
||||||
|
.loading-overlay {
|
||||||
|
background: rgba(255, 255, 255, 0.95);
|
||||||
|
}
|
||||||
|
|
||||||
|
.spinner-custom,
|
||||||
|
.recording-wave {
|
||||||
|
transform: scale(0.8);
|
||||||
|
}
|
||||||
|
|
||||||
|
.success-notification {
|
||||||
|
width: 90%;
|
||||||
|
max-width: 300px;
|
||||||
|
font-size: 14px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Streaming translation styles */
|
||||||
|
.streaming-text {
|
||||||
|
position: relative;
|
||||||
|
min-height: 1.5em;
|
||||||
|
}
|
||||||
|
|
||||||
|
.streaming-active::after {
|
||||||
|
content: '▊';
|
||||||
|
display: inline-block;
|
||||||
|
animation: cursor-blink 1s infinite;
|
||||||
|
color: #007bff;
|
||||||
|
font-weight: bold;
|
||||||
|
}
|
||||||
|
|
||||||
|
@keyframes cursor-blink {
|
||||||
|
0%, 49% {
|
||||||
|
opacity: 1;
|
||||||
|
}
|
||||||
|
50%, 100% {
|
||||||
|
opacity: 0;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Smooth text appearance for streaming */
|
||||||
|
.streaming-text {
|
||||||
|
transition: all 0.1s ease-out;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Multi-speaker styles */
|
||||||
|
.speaker-button {
|
||||||
|
position: relative;
|
||||||
|
padding: 8px 16px;
|
||||||
|
border-radius: 20px;
|
||||||
|
border: 2px solid;
|
||||||
|
background-color: white;
|
||||||
|
font-weight: 500;
|
||||||
|
transition: all 0.3s ease;
|
||||||
|
min-width: 120px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.speaker-button.active {
|
||||||
|
color: white !important;
|
||||||
|
transform: scale(1.05);
|
||||||
|
box-shadow: 0 2px 8px rgba(0,0,0,0.2);
|
||||||
|
}
|
||||||
|
|
||||||
|
.speaker-avatar {
|
||||||
|
display: inline-flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
width: 30px;
|
||||||
|
height: 30px;
|
||||||
|
border-radius: 50%;
|
||||||
|
background-color: rgba(255,255,255,0.3);
|
||||||
|
color: inherit;
|
||||||
|
font-weight: bold;
|
||||||
|
font-size: 12px;
|
||||||
|
margin-right: 8px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.speaker-button.active .speaker-avatar {
|
||||||
|
background-color: rgba(255,255,255,0.3);
|
||||||
|
}
|
||||||
|
|
||||||
|
.conversation-entry {
|
||||||
|
margin-bottom: 16px;
|
||||||
|
padding: 12px;
|
||||||
|
border-radius: 12px;
|
||||||
|
background-color: #f8f9fa;
|
||||||
|
position: relative;
|
||||||
|
animation: slideIn 0.3s ease-out;
|
||||||
|
}
|
||||||
|
|
||||||
|
@keyframes slideIn {
|
||||||
|
from {
|
||||||
|
opacity: 0;
|
||||||
|
transform: translateY(10px);
|
||||||
|
}
|
||||||
|
to {
|
||||||
|
opacity: 1;
|
||||||
|
transform: translateY(0);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.conversation-speaker {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
margin-bottom: 8px;
|
||||||
|
font-weight: 600;
|
||||||
|
}
|
||||||
|
|
||||||
|
.conversation-speaker-avatar {
|
||||||
|
display: inline-flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
width: 25px;
|
||||||
|
height: 25px;
|
||||||
|
border-radius: 50%;
|
||||||
|
color: white;
|
||||||
|
font-size: 11px;
|
||||||
|
margin-right: 8px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.conversation-text {
|
||||||
|
margin-left: 33px;
|
||||||
|
line-height: 1.5;
|
||||||
|
}
|
||||||
|
|
||||||
|
.conversation-time {
|
||||||
|
font-size: 0.8rem;
|
||||||
|
color: #6c757d;
|
||||||
|
margin-left: auto;
|
||||||
|
}
|
||||||
|
|
||||||
|
.conversation-translation {
|
||||||
|
font-style: italic;
|
||||||
|
opacity: 0.9;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Speaker list responsive */
|
||||||
|
@media (max-width: 768px) {
|
||||||
|
.speaker-button {
|
||||||
|
min-width: 100px;
|
||||||
|
padding: 6px 12px;
|
||||||
|
font-size: 0.9rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.speaker-avatar {
|
||||||
|
width: 25px;
|
||||||
|
height: 25px;
|
||||||
|
font-size: 10px;
|
||||||
|
}
|
||||||
|
}
|
600
static/js/app.js
600
static/js/app.js
@ -1,600 +0,0 @@
|
|||||||
// Main application JavaScript with PWA support
|
|
||||||
document.addEventListener('DOMContentLoaded', function() {
|
|
||||||
// Register service worker
|
|
||||||
if ('serviceWorker' in navigator) {
|
|
||||||
registerServiceWorker();
|
|
||||||
}
|
|
||||||
|
|
||||||
// Initialize app
|
|
||||||
initApp();
|
|
||||||
|
|
||||||
// Check for PWA installation prompts
|
|
||||||
initInstallPrompt();
|
|
||||||
});
|
|
||||||
|
|
||||||
// Service Worker Registration
|
|
||||||
async function registerServiceWorker() {
|
|
||||||
try {
|
|
||||||
const registration = await navigator.serviceWorker.register('/service-worker.js');
|
|
||||||
console.log('Service Worker registered with scope:', registration.scope);
|
|
||||||
|
|
||||||
// Setup periodic sync if available
|
|
||||||
if ('periodicSync' in registration) {
|
|
||||||
// Request permission for background sync
|
|
||||||
const status = await navigator.permissions.query({
|
|
||||||
name: 'periodic-background-sync',
|
|
||||||
});
|
|
||||||
|
|
||||||
if (status.state === 'granted') {
|
|
||||||
try {
|
|
||||||
// Register for background sync to check for updates
|
|
||||||
await registration.periodicSync.register('translation-updates', {
|
|
||||||
minInterval: 24 * 60 * 60 * 1000, // once per day
|
|
||||||
});
|
|
||||||
console.log('Periodic background sync registered');
|
|
||||||
} catch (error) {
|
|
||||||
console.error('Periodic background sync could not be registered:', error);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
// Setup push notification if available
|
|
||||||
if ('PushManager' in window) {
|
|
||||||
setupPushNotifications(registration);
|
|
||||||
}
|
|
||||||
} catch (error) {
|
|
||||||
console.error('Service Worker registration failed:', error);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
// Initialize the main application
|
|
||||||
function initApp() {
|
|
||||||
// DOM elements
|
|
||||||
const recordBtn = document.getElementById('recordBtn');
|
|
||||||
const translateBtn = document.getElementById('translateBtn');
|
|
||||||
const sourceText = document.getElementById('sourceText');
|
|
||||||
const translatedText = document.getElementById('translatedText');
|
|
||||||
const sourceLanguage = document.getElementById('sourceLanguage');
|
|
||||||
const targetLanguage = document.getElementById('targetLanguage');
|
|
||||||
const playSource = document.getElementById('playSource');
|
|
||||||
const playTranslation = document.getElementById('playTranslation');
|
|
||||||
const clearSource = document.getElementById('clearSource');
|
|
||||||
const clearTranslation = document.getElementById('clearTranslation');
|
|
||||||
const statusIndicator = document.getElementById('statusIndicator');
|
|
||||||
const progressContainer = document.getElementById('progressContainer');
|
|
||||||
const progressBar = document.getElementById('progressBar');
|
|
||||||
const audioPlayer = document.getElementById('audioPlayer');
|
|
||||||
const ttsServerAlert = document.getElementById('ttsServerAlert');
|
|
||||||
const ttsServerMessage = document.getElementById('ttsServerMessage');
|
|
||||||
const ttsServerUrl = document.getElementById('ttsServerUrl');
|
|
||||||
const ttsApiKey = document.getElementById('ttsApiKey');
|
|
||||||
const updateTtsServer = document.getElementById('updateTtsServer');
|
|
||||||
|
|
||||||
// Set initial values
|
|
||||||
let isRecording = false;
|
|
||||||
let mediaRecorder = null;
|
|
||||||
let audioChunks = [];
|
|
||||||
let currentSourceText = '';
|
|
||||||
let currentTranslationText = '';
|
|
||||||
let currentTtsServerUrl = '';
|
|
||||||
|
|
||||||
// Check TTS server status on page load
|
|
||||||
checkTtsServer();
|
|
||||||
|
|
||||||
// Check for saved translations in IndexedDB
|
|
||||||
loadSavedTranslations();
|
|
||||||
|
|
||||||
// Update TTS server URL and API key
|
|
||||||
updateTtsServer.addEventListener('click', function() {
|
|
||||||
const newUrl = ttsServerUrl.value.trim();
|
|
||||||
const newApiKey = ttsApiKey.value.trim();
|
|
||||||
|
|
||||||
if (!newUrl && !newApiKey) {
|
|
||||||
alert('Please provide at least one value to update');
|
|
||||||
return;
|
|
||||||
}
|
|
||||||
|
|
||||||
const updateData = {};
|
|
||||||
if (newUrl) updateData.server_url = newUrl;
|
|
||||||
if (newApiKey) updateData.api_key = newApiKey;
|
|
||||||
|
|
||||||
fetch('/update_tts_config', {
|
|
||||||
method: 'POST',
|
|
||||||
headers: {
|
|
||||||
'Content-Type': 'application/json'
|
|
||||||
},
|
|
||||||
body: JSON.stringify(updateData)
|
|
||||||
})
|
|
||||||
.then(response => response.json())
|
|
||||||
.then(data => {
|
|
||||||
if (data.success) {
|
|
||||||
statusIndicator.textContent = 'TTS configuration updated';
|
|
||||||
// Save URL to localStorage but not the API key for security
|
|
||||||
if (newUrl) localStorage.setItem('ttsServerUrl', newUrl);
|
|
||||||
// Check TTS server with new configuration
|
|
||||||
checkTtsServer();
|
|
||||||
} else {
|
|
||||||
alert('Failed to update TTS configuration: ' + data.error);
|
|
||||||
}
|
|
||||||
})
|
|
||||||
.catch(error => {
|
|
||||||
console.error('Failed to update TTS config:', error);
|
|
||||||
alert('Failed to update TTS configuration. See console for details.');
|
|
||||||
});
|
|
||||||
});
|
|
||||||
|
|
||||||
// Make sure target language is different from source
|
|
||||||
if (targetLanguage.options[0].value === sourceLanguage.value) {
|
|
||||||
targetLanguage.selectedIndex = 1;
|
|
||||||
}
|
|
||||||
|
|
||||||
// Event listeners for language selection
|
|
||||||
sourceLanguage.addEventListener('change', function() {
|
|
||||||
if (targetLanguage.value === sourceLanguage.value) {
|
|
||||||
for (let i = 0; i < targetLanguage.options.length; i++) {
|
|
||||||
if (targetLanguage.options[i].value !== sourceLanguage.value) {
|
|
||||||
targetLanguage.selectedIndex = i;
|
|
||||||
break;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
});
|
|
||||||
|
|
||||||
targetLanguage.addEventListener('change', function() {
|
|
||||||
if (targetLanguage.value === sourceLanguage.value) {
|
|
||||||
for (let i = 0; i < sourceLanguage.options.length; i++) {
|
|
||||||
if (sourceLanguage.options[i].value !== targetLanguage.value) {
|
|
||||||
sourceLanguage.selectedIndex = i;
|
|
||||||
break;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
});
|
|
||||||
|
|
||||||
// Record button click event
|
|
||||||
recordBtn.addEventListener('click', function() {
|
|
||||||
if (isRecording) {
|
|
||||||
stopRecording();
|
|
||||||
} else {
|
|
||||||
startRecording();
|
|
||||||
}
|
|
||||||
});
|
|
||||||
|
|
||||||
// Function to start recording
|
|
||||||
function startRecording() {
|
|
||||||
navigator.mediaDevices.getUserMedia({ audio: true })
|
|
||||||
.then(stream => {
|
|
||||||
mediaRecorder = new MediaRecorder(stream);
|
|
||||||
audioChunks = [];
|
|
||||||
|
|
||||||
mediaRecorder.addEventListener('dataavailable', event => {
|
|
||||||
audioChunks.push(event.data);
|
|
||||||
});
|
|
||||||
|
|
||||||
mediaRecorder.addEventListener('stop', () => {
|
|
||||||
const audioBlob = new Blob(audioChunks, { type: 'audio/wav' });
|
|
||||||
transcribeAudio(audioBlob);
|
|
||||||
});
|
|
||||||
|
|
||||||
mediaRecorder.start();
|
|
||||||
isRecording = true;
|
|
||||||
recordBtn.classList.add('recording');
|
|
||||||
recordBtn.classList.replace('btn-primary', 'btn-danger');
|
|
||||||
recordBtn.innerHTML = '<i class="fas fa-stop"></i>';
|
|
||||||
statusIndicator.textContent = 'Recording... Click to stop';
|
|
||||||
})
|
|
||||||
.catch(error => {
|
|
||||||
console.error('Error accessing microphone:', error);
|
|
||||||
alert('Error accessing microphone. Please make sure you have given permission for microphone access.');
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
// Function to stop recording
|
|
||||||
function stopRecording() {
|
|
||||||
mediaRecorder.stop();
|
|
||||||
isRecording = false;
|
|
||||||
recordBtn.classList.remove('recording');
|
|
||||||
recordBtn.classList.replace('btn-danger', 'btn-primary');
|
|
||||||
recordBtn.innerHTML = '<i class="fas fa-microphone"></i>';
|
|
||||||
statusIndicator.textContent = 'Processing audio...';
|
|
||||||
|
|
||||||
// Stop all audio tracks
|
|
||||||
mediaRecorder.stream.getTracks().forEach(track => track.stop());
|
|
||||||
}
|
|
||||||
|
|
||||||
// Function to transcribe audio
|
|
||||||
function transcribeAudio(audioBlob) {
|
|
||||||
const formData = new FormData();
|
|
||||||
formData.append('audio', audioBlob);
|
|
||||||
formData.append('source_lang', sourceLanguage.value);
|
|
||||||
|
|
||||||
showProgress();
|
|
||||||
|
|
||||||
fetch('/transcribe', {
|
|
||||||
method: 'POST',
|
|
||||||
body: formData
|
|
||||||
})
|
|
||||||
.then(response => response.json())
|
|
||||||
.then(data => {
|
|
||||||
hideProgress();
|
|
||||||
|
|
||||||
if (data.success) {
|
|
||||||
currentSourceText = data.text;
|
|
||||||
sourceText.innerHTML = `<p>${data.text}</p>`;
|
|
||||||
playSource.disabled = false;
|
|
||||||
translateBtn.disabled = false;
|
|
||||||
statusIndicator.textContent = 'Transcription complete';
|
|
||||||
|
|
||||||
// Cache the transcription in IndexedDB
|
|
||||||
saveToIndexedDB('transcriptions', {
|
|
||||||
text: data.text,
|
|
||||||
language: sourceLanguage.value,
|
|
||||||
timestamp: new Date().toISOString()
|
|
||||||
});
|
|
||||||
} else {
|
|
||||||
sourceText.innerHTML = `<p class="text-danger">Error: ${data.error}</p>`;
|
|
||||||
statusIndicator.textContent = 'Transcription failed';
|
|
||||||
}
|
|
||||||
})
|
|
||||||
.catch(error => {
|
|
||||||
hideProgress();
|
|
||||||
console.error('Transcription error:', error);
|
|
||||||
sourceText.innerHTML = `<p class="text-danger">Failed to transcribe audio. Please try again.</p>`;
|
|
||||||
statusIndicator.textContent = 'Transcription failed';
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
// Translate button click event
|
|
||||||
translateBtn.addEventListener('click', function() {
|
|
||||||
if (!currentSourceText) {
|
|
||||||
return;
|
|
||||||
}
|
|
||||||
|
|
||||||
statusIndicator.textContent = 'Translating...';
|
|
||||||
showProgress();
|
|
||||||
|
|
||||||
fetch('/translate', {
|
|
||||||
method: 'POST',
|
|
||||||
headers: {
|
|
||||||
'Content-Type': 'application/json'
|
|
||||||
},
|
|
||||||
body: JSON.stringify({
|
|
||||||
text: currentSourceText,
|
|
||||||
source_lang: sourceLanguage.value,
|
|
||||||
target_lang: targetLanguage.value
|
|
||||||
})
|
|
||||||
})
|
|
||||||
.then(response => response.json())
|
|
||||||
.then(data => {
|
|
||||||
hideProgress();
|
|
||||||
|
|
||||||
if (data.success) {
|
|
||||||
currentTranslationText = data.translation;
|
|
||||||
translatedText.innerHTML = `<p>${data.translation}</p>`;
|
|
||||||
playTranslation.disabled = false;
|
|
||||||
statusIndicator.textContent = 'Translation complete';
|
|
||||||
|
|
||||||
// Cache the translation in IndexedDB
|
|
||||||
saveToIndexedDB('translations', {
|
|
||||||
sourceText: currentSourceText,
|
|
||||||
sourceLanguage: sourceLanguage.value,
|
|
||||||
targetText: data.translation,
|
|
||||||
targetLanguage: targetLanguage.value,
|
|
||||||
timestamp: new Date().toISOString()
|
|
||||||
});
|
|
||||||
} else {
|
|
||||||
translatedText.innerHTML = `<p class="text-danger">Error: ${data.error}</p>`;
|
|
||||||
statusIndicator.textContent = 'Translation failed';
|
|
||||||
}
|
|
||||||
})
|
|
||||||
.catch(error => {
|
|
||||||
hideProgress();
|
|
||||||
console.error('Translation error:', error);
|
|
||||||
translatedText.innerHTML = `<p class="text-danger">Failed to translate. Please try again.</p>`;
|
|
||||||
statusIndicator.textContent = 'Translation failed';
|
|
||||||
});
|
|
||||||
});
|
|
||||||
|
|
||||||
// Play source text
|
|
||||||
playSource.addEventListener('click', function() {
|
|
||||||
if (!currentSourceText) return;
|
|
||||||
|
|
||||||
playAudio(currentSourceText, sourceLanguage.value);
|
|
||||||
statusIndicator.textContent = 'Playing source audio...';
|
|
||||||
});
|
|
||||||
|
|
||||||
// Play translation
|
|
||||||
playTranslation.addEventListener('click', function() {
|
|
||||||
if (!currentTranslationText) return;
|
|
||||||
|
|
||||||
playAudio(currentTranslationText, targetLanguage.value);
|
|
||||||
statusIndicator.textContent = 'Playing translation audio...';
|
|
||||||
});
|
|
||||||
|
|
||||||
// Function to play audio via TTS
|
|
||||||
function playAudio(text, language) {
|
|
||||||
showProgress();
|
|
||||||
|
|
||||||
fetch('/speak', {
|
|
||||||
method: 'POST',
|
|
||||||
headers: {
|
|
||||||
'Content-Type': 'application/json'
|
|
||||||
},
|
|
||||||
body: JSON.stringify({
|
|
||||||
text: text,
|
|
||||||
language: language
|
|
||||||
})
|
|
||||||
})
|
|
||||||
.then(response => response.json())
|
|
||||||
.then(data => {
|
|
||||||
hideProgress();
|
|
||||||
|
|
||||||
if (data.success) {
|
|
||||||
audioPlayer.src = data.audio_url;
|
|
||||||
audioPlayer.onended = function() {
|
|
||||||
statusIndicator.textContent = 'Ready';
|
|
||||||
};
|
|
||||||
audioPlayer.play();
|
|
||||||
} else {
|
|
||||||
statusIndicator.textContent = 'TTS failed';
|
|
||||||
|
|
||||||
// Show TTS server alert with error message
|
|
||||||
ttsServerAlert.classList.remove('d-none');
|
|
||||||
ttsServerAlert.classList.remove('alert-success');
|
|
||||||
ttsServerAlert.classList.add('alert-warning');
|
|
||||||
ttsServerMessage.textContent = data.error;
|
|
||||||
|
|
||||||
alert('Failed to play audio: ' + data.error);
|
|
||||||
|
|
||||||
// Check TTS server status again
|
|
||||||
checkTtsServer();
|
|
||||||
}
|
|
||||||
})
|
|
||||||
.catch(error => {
|
|
||||||
hideProgress();
|
|
||||||
console.error('TTS error:', error);
|
|
||||||
statusIndicator.textContent = 'TTS failed';
|
|
||||||
|
|
||||||
// Show TTS server alert
|
|
||||||
ttsServerAlert.classList.remove('d-none');
|
|
||||||
ttsServerAlert.classList.remove('alert-success');
|
|
||||||
ttsServerAlert.classList.add('alert-warning');
|
|
||||||
ttsServerMessage.textContent = 'Failed to connect to TTS server';
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
// Clear buttons
|
|
||||||
clearSource.addEventListener('click', function() {
|
|
||||||
sourceText.innerHTML = '<p class="text-muted">Your transcribed text will appear here...</p>';
|
|
||||||
currentSourceText = '';
|
|
||||||
playSource.disabled = true;
|
|
||||||
translateBtn.disabled = true;
|
|
||||||
});
|
|
||||||
|
|
||||||
clearTranslation.addEventListener('click', function() {
|
|
||||||
translatedText.innerHTML = '<p class="text-muted">Translation will appear here...</p>';
|
|
||||||
currentTranslationText = '';
|
|
||||||
playTranslation.disabled = true;
|
|
||||||
});
|
|
||||||
|
|
||||||
// Function to check TTS server status
|
|
||||||
function checkTtsServer() {
|
|
||||||
fetch('/check_tts_server')
|
|
||||||
.then(response => response.json())
|
|
||||||
.then(data => {
|
|
||||||
currentTtsServerUrl = data.url;
|
|
||||||
ttsServerUrl.value = currentTtsServerUrl;
|
|
||||||
|
|
||||||
// Load saved API key if available
|
|
||||||
const savedApiKey = localStorage.getItem('ttsApiKeySet');
|
|
||||||
if (savedApiKey === 'true') {
|
|
||||||
ttsApiKey.placeholder = '••••••• (API key saved)';
|
|
||||||
}
|
|
||||||
|
|
||||||
if (data.status === 'error' || data.status === 'auth_error') {
|
|
||||||
ttsServerAlert.classList.remove('d-none');
|
|
||||||
ttsServerAlert.classList.remove('alert-success');
|
|
||||||
ttsServerAlert.classList.add('alert-warning');
|
|
||||||
ttsServerMessage.textContent = data.message;
|
|
||||||
|
|
||||||
if (data.status === 'auth_error') {
|
|
||||||
ttsServerMessage.textContent = 'Authentication error with TTS server. Please check your API key.';
|
|
||||||
}
|
|
||||||
} else {
|
|
||||||
ttsServerAlert.classList.remove('d-none');
|
|
||||||
ttsServerAlert.classList.remove('alert-warning');
|
|
||||||
ttsServerAlert.classList.add('alert-success');
|
|
||||||
ttsServerMessage.textContent = 'TTS server is online and ready.';
|
|
||||||
setTimeout(() => {
|
|
||||||
ttsServerAlert.classList.add('d-none');
|
|
||||||
}, 3000);
|
|
||||||
}
|
|
||||||
})
|
|
||||||
.catch(error => {
|
|
||||||
console.error('Failed to check TTS server:', error);
|
|
||||||
ttsServerAlert.classList.remove('d-none');
|
|
||||||
ttsServerAlert.classList.remove('alert-success');
|
|
||||||
ttsServerAlert.classList.add('alert-warning');
|
|
||||||
ttsServerMessage.textContent = 'Failed to check TTS server status.';
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
// Progress indicator functions
|
|
||||||
function showProgress() {
|
|
||||||
progressContainer.classList.remove('d-none');
|
|
||||||
let progress = 0;
|
|
||||||
const interval = setInterval(() => {
|
|
||||||
progress += 5;
|
|
||||||
if (progress > 90) {
|
|
||||||
clearInterval(interval);
|
|
||||||
}
|
|
||||||
progressBar.style.width = `${progress}%`;
|
|
||||||
}, 100);
|
|
||||||
progressBar.dataset.interval = interval;
|
|
||||||
}
|
|
||||||
|
|
||||||
function hideProgress() {
|
|
||||||
const interval = progressBar.dataset.interval;
|
|
||||||
if (interval) {
|
|
||||||
clearInterval(Number(interval));
|
|
||||||
}
|
|
||||||
progressBar.style.width = '100%';
|
|
||||||
setTimeout(() => {
|
|
||||||
progressContainer.classList.add('d-none');
|
|
||||||
progressBar.style.width = '0%';
|
|
||||||
}, 500);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
// IndexedDB functions for offline data storage
|
|
||||||
function openIndexedDB() {
|
|
||||||
return new Promise((resolve, reject) => {
|
|
||||||
const request = indexedDB.open('VoiceTranslatorDB', 1);
|
|
||||||
|
|
||||||
request.onupgradeneeded = (event) => {
|
|
||||||
const db = event.target.result;
|
|
||||||
|
|
||||||
// Create stores for transcriptions and translations
|
|
||||||
if (!db.objectStoreNames.contains('transcriptions')) {
|
|
||||||
db.createObjectStore('transcriptions', { keyPath: 'timestamp' });
|
|
||||||
}
|
|
||||||
|
|
||||||
if (!db.objectStoreNames.contains('translations')) {
|
|
||||||
db.createObjectStore('translations', { keyPath: 'timestamp' });
|
|
||||||
}
|
|
||||||
};
|
|
||||||
|
|
||||||
request.onsuccess = (event) => {
|
|
||||||
resolve(event.target.result);
|
|
||||||
};
|
|
||||||
|
|
||||||
request.onerror = (event) => {
|
|
||||||
reject('IndexedDB error: ' + event.target.errorCode);
|
|
||||||
};
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
function saveToIndexedDB(storeName, data) {
|
|
||||||
openIndexedDB().then(db => {
|
|
||||||
const transaction = db.transaction([storeName], 'readwrite');
|
|
||||||
const store = transaction.objectStore(storeName);
|
|
||||||
store.add(data);
|
|
||||||
}).catch(error => {
|
|
||||||
console.error('Error saving to IndexedDB:', error);
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
function loadSavedTranslations() {
|
|
||||||
openIndexedDB().then(db => {
|
|
||||||
const transaction = db.transaction(['translations'], 'readonly');
|
|
||||||
const store = transaction.objectStore('translations');
|
|
||||||
const request = store.getAll();
|
|
||||||
|
|
||||||
request.onsuccess = (event) => {
|
|
||||||
const translations = event.target.result;
|
|
||||||
if (translations && translations.length > 0) {
|
|
||||||
// Could add a history section or recently used translations
|
|
||||||
console.log('Loaded saved translations:', translations.length);
|
|
||||||
}
|
|
||||||
};
|
|
||||||
}).catch(error => {
|
|
||||||
console.error('Error loading from IndexedDB:', error);
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
// PWA installation prompt
|
|
||||||
function initInstallPrompt() {
|
|
||||||
let deferredPrompt;
|
|
||||||
const installButton = document.createElement('button');
|
|
||||||
installButton.style.display = 'none';
|
|
||||||
installButton.classList.add('btn', 'btn-success', 'fixed-bottom', 'm-3');
|
|
||||||
installButton.innerHTML = 'Install Voice Translator <i class="fas fa-download ml-2"></i>';
|
|
||||||
document.body.appendChild(installButton);
|
|
||||||
|
|
||||||
window.addEventListener('beforeinstallprompt', (e) => {
|
|
||||||
// Prevent Chrome 67 and earlier from automatically showing the prompt
|
|
||||||
e.preventDefault();
|
|
||||||
// Stash the event so it can be triggered later
|
|
||||||
deferredPrompt = e;
|
|
||||||
// Update UI to notify the user they can add to home screen
|
|
||||||
installButton.style.display = 'block';
|
|
||||||
|
|
||||||
installButton.addEventListener('click', (e) => {
|
|
||||||
// Hide our user interface that shows our install button
|
|
||||||
installButton.style.display = 'none';
|
|
||||||
// Show the prompt
|
|
||||||
deferredPrompt.prompt();
|
|
||||||
// Wait for the user to respond to the prompt
|
|
||||||
deferredPrompt.userChoice.then((choiceResult) => {
|
|
||||||
if (choiceResult.outcome === 'accepted') {
|
|
||||||
console.log('User accepted the install prompt');
|
|
||||||
} else {
|
|
||||||
console.log('User dismissed the install prompt');
|
|
||||||
}
|
|
||||||
deferredPrompt = null;
|
|
||||||
});
|
|
||||||
});
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
// Push notification setup
|
|
||||||
function setupPushNotifications(swRegistration) {
|
|
||||||
// First check if we already have permission
|
|
||||||
if (Notification.permission === 'granted') {
|
|
||||||
console.log('Notification permission already granted');
|
|
||||||
subscribeToPushManager(swRegistration);
|
|
||||||
} else if (Notification.permission !== 'denied') {
|
|
||||||
// Otherwise, ask for permission
|
|
||||||
Notification.requestPermission().then(function(permission) {
|
|
||||||
if (permission === 'granted') {
|
|
||||||
console.log('Notification permission granted');
|
|
||||||
subscribeToPushManager(swRegistration);
|
|
||||||
}
|
|
||||||
});
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
async function subscribeToPushManager(swRegistration) {
|
|
||||||
try {
|
|
||||||
// Get the server's public key
|
|
||||||
const response = await fetch('/api/push-public-key');
|
|
||||||
const data = await response.json();
|
|
||||||
|
|
||||||
// Convert the base64 string to Uint8Array
|
|
||||||
function urlBase64ToUint8Array(base64String) {
|
|
||||||
const padding = '='.repeat((4 - base64String.length % 4) % 4);
|
|
||||||
const base64 = (base64String + padding)
|
|
||||||
.replace(/-/g, '+')
|
|
||||||
.replace(/_/g, '/');
|
|
||||||
|
|
||||||
const rawData = window.atob(base64);
|
|
||||||
const outputArray = new Uint8Array(rawData.length);
|
|
||||||
|
|
||||||
for (let i = 0; i < rawData.length; ++i) {
|
|
||||||
outputArray[i] = rawData.charCodeAt(i);
|
|
||||||
}
|
|
||||||
return outputArray;
|
|
||||||
}
|
|
||||||
|
|
||||||
const convertedVapidKey = urlBase64ToUint8Array(data.publicKey);
|
|
||||||
|
|
||||||
// Subscribe to push notifications
|
|
||||||
const subscription = await swRegistration.pushManager.subscribe({
|
|
||||||
userVisibleOnly: true,
|
|
||||||
applicationServerKey: convertedVapidKey
|
|
||||||
});
|
|
||||||
|
|
||||||
// Send the subscription details to the server
|
|
||||||
await fetch('/api/push-subscribe', {
|
|
||||||
method: 'POST',
|
|
||||||
headers: {
|
|
||||||
'Content-Type': 'application/json',
|
|
||||||
},
|
|
||||||
body: JSON.stringify(subscription)
|
|
||||||
});
|
|
||||||
|
|
||||||
console.log('User is subscribed to push notifications');
|
|
||||||
} catch (error) {
|
|
||||||
console.error('Failed to subscribe to push notifications:', error);
|
|
||||||
}
|
|
||||||
}
|
|
155
static/js/src/apiClient.ts
Normal file
155
static/js/src/apiClient.ts
Normal file
@ -0,0 +1,155 @@
|
|||||||
|
// API Client with CORS support
|
||||||
|
export interface ApiClientConfig {
|
||||||
|
baseUrl?: string;
|
||||||
|
credentials?: RequestCredentials;
|
||||||
|
headers?: HeadersInit;
|
||||||
|
}
|
||||||
|
|
||||||
|
export class ApiClient {
|
||||||
|
private static instance: ApiClient;
|
||||||
|
private config: ApiClientConfig;
|
||||||
|
|
||||||
|
private constructor() {
|
||||||
|
// Default configuration
|
||||||
|
this.config = {
|
||||||
|
baseUrl: '', // Use same origin by default
|
||||||
|
credentials: 'same-origin', // Change to 'include' for cross-origin requests
|
||||||
|
headers: {
|
||||||
|
'X-Requested-With': 'XMLHttpRequest' // Identify as AJAX request
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
// Check if we're in a cross-origin context
|
||||||
|
this.detectCrossOrigin();
|
||||||
|
}
|
||||||
|
|
||||||
|
static getInstance(): ApiClient {
|
||||||
|
if (!ApiClient.instance) {
|
||||||
|
ApiClient.instance = new ApiClient();
|
||||||
|
}
|
||||||
|
return ApiClient.instance;
|
||||||
|
}
|
||||||
|
|
||||||
|
// Detect if we're making cross-origin requests
|
||||||
|
private detectCrossOrigin(): void {
|
||||||
|
// Check if the app is loaded from a different origin
|
||||||
|
const currentScript = document.currentScript as HTMLScriptElement | null;
|
||||||
|
const scriptSrc = currentScript?.src || '';
|
||||||
|
if (scriptSrc && !scriptSrc.startsWith(window.location.origin)) {
|
||||||
|
// We're likely in a cross-origin context
|
||||||
|
this.config.credentials = 'include';
|
||||||
|
console.log('Cross-origin context detected, enabling credentials');
|
||||||
|
}
|
||||||
|
|
||||||
|
// Also check for explicit configuration in meta tags
|
||||||
|
const corsOrigin = document.querySelector('meta[name="cors-origin"]');
|
||||||
|
if (corsOrigin) {
|
||||||
|
const origin = corsOrigin.getAttribute('content');
|
||||||
|
if (origin && origin !== window.location.origin) {
|
||||||
|
this.config.baseUrl = origin;
|
||||||
|
this.config.credentials = 'include';
|
||||||
|
console.log(`Using CORS origin: ${origin}`);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// Configure the API client
|
||||||
|
configure(config: Partial<ApiClientConfig>): void {
|
||||||
|
this.config = { ...this.config, ...config };
|
||||||
|
}
|
||||||
|
|
||||||
|
// Make a fetch request with CORS support
|
||||||
|
async fetch(url: string, options: RequestInit = {}): Promise<Response> {
|
||||||
|
// Construct full URL
|
||||||
|
const fullUrl = this.config.baseUrl ? `${this.config.baseUrl}${url}` : url;
|
||||||
|
|
||||||
|
// Merge headers
|
||||||
|
const headers = new Headers(options.headers);
|
||||||
|
if (this.config.headers) {
|
||||||
|
const configHeaders = new Headers(this.config.headers);
|
||||||
|
configHeaders.forEach((value, key) => {
|
||||||
|
if (!headers.has(key)) {
|
||||||
|
headers.set(key, value);
|
||||||
|
}
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
// Merge options with defaults
|
||||||
|
const fetchOptions: RequestInit = {
|
||||||
|
...options,
|
||||||
|
headers,
|
||||||
|
credentials: options.credentials || this.config.credentials
|
||||||
|
};
|
||||||
|
|
||||||
|
// Add CORS mode if cross-origin
|
||||||
|
if (this.config.baseUrl && this.config.baseUrl !== window.location.origin) {
|
||||||
|
fetchOptions.mode = 'cors';
|
||||||
|
}
|
||||||
|
|
||||||
|
try {
|
||||||
|
const response = await fetch(fullUrl, fetchOptions);
|
||||||
|
|
||||||
|
// Check for CORS errors
|
||||||
|
if (!response.ok && response.type === 'opaque') {
|
||||||
|
throw new Error('CORS request failed - check server CORS configuration');
|
||||||
|
}
|
||||||
|
|
||||||
|
return response;
|
||||||
|
} catch (error) {
|
||||||
|
// Enhanced error handling for CORS issues
|
||||||
|
if (error instanceof TypeError && error.message.includes('Failed to fetch')) {
|
||||||
|
console.error('CORS Error: Failed to fetch. Check that:', {
|
||||||
|
requestedUrl: fullUrl,
|
||||||
|
origin: window.location.origin,
|
||||||
|
credentials: fetchOptions.credentials,
|
||||||
|
mode: fetchOptions.mode
|
||||||
|
});
|
||||||
|
throw new Error('CORS request failed. The server may not allow requests from this origin.');
|
||||||
|
}
|
||||||
|
throw error;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// Convenience methods
|
||||||
|
async get(url: string, options?: RequestInit): Promise<Response> {
|
||||||
|
return this.fetch(url, { ...options, method: 'GET' });
|
||||||
|
}
|
||||||
|
|
||||||
|
async post(url: string, body?: any, options?: RequestInit): Promise<Response> {
|
||||||
|
const init: RequestInit = { ...options, method: 'POST' };
|
||||||
|
|
||||||
|
if (body) {
|
||||||
|
if (body instanceof FormData) {
|
||||||
|
init.body = body;
|
||||||
|
} else {
|
||||||
|
init.headers = {
|
||||||
|
...init.headers,
|
||||||
|
'Content-Type': 'application/json'
|
||||||
|
};
|
||||||
|
init.body = JSON.stringify(body);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
return this.fetch(url, init);
|
||||||
|
}
|
||||||
|
|
||||||
|
// JSON convenience methods
|
||||||
|
async getJSON<T>(url: string, options?: RequestInit): Promise<T> {
|
||||||
|
const response = await this.get(url, options);
|
||||||
|
if (!response.ok) {
|
||||||
|
throw new Error(`HTTP error! status: ${response.status}`);
|
||||||
|
}
|
||||||
|
return response.json();
|
||||||
|
}
|
||||||
|
|
||||||
|
async postJSON<T>(url: string, body?: any, options?: RequestInit): Promise<T> {
|
||||||
|
const response = await this.post(url, body, options);
|
||||||
|
if (!response.ok) {
|
||||||
|
throw new Error(`HTTP error! status: ${response.status}`);
|
||||||
|
}
|
||||||
|
return response.json();
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// Export a singleton instance
|
||||||
|
export const apiClient = ApiClient.getInstance();
|
1651
static/js/src/app.ts
Normal file
1651
static/js/src/app.ts
Normal file
File diff suppressed because it is too large
Load Diff
321
static/js/src/connectionManager.ts
Normal file
321
static/js/src/connectionManager.ts
Normal file
@ -0,0 +1,321 @@
|
|||||||
|
// Connection management with retry logic
|
||||||
|
export interface ConnectionConfig {
|
||||||
|
maxRetries: number;
|
||||||
|
initialDelay: number;
|
||||||
|
maxDelay: number;
|
||||||
|
backoffMultiplier: number;
|
||||||
|
timeout: number;
|
||||||
|
onlineCheckInterval: number;
|
||||||
|
}
|
||||||
|
|
||||||
|
export interface RetryOptions {
|
||||||
|
retries?: number;
|
||||||
|
delay?: number;
|
||||||
|
onRetry?: (attempt: number, error: Error) => void;
|
||||||
|
}
|
||||||
|
|
||||||
|
export type ConnectionStatus = 'online' | 'offline' | 'connecting' | 'error';
|
||||||
|
|
||||||
|
export interface ConnectionState {
|
||||||
|
status: ConnectionStatus;
|
||||||
|
lastError?: Error;
|
||||||
|
retryCount: number;
|
||||||
|
lastOnlineTime?: Date;
|
||||||
|
}
|
||||||
|
|
||||||
|
export class ConnectionManager {
|
||||||
|
private static instance: ConnectionManager;
|
||||||
|
private config: ConnectionConfig;
|
||||||
|
private state: ConnectionState;
|
||||||
|
private listeners: Map<string, (state: ConnectionState) => void> = new Map();
|
||||||
|
private onlineCheckTimer?: number;
|
||||||
|
private reconnectTimer?: number;
|
||||||
|
|
||||||
|
private constructor() {
|
||||||
|
this.config = {
|
||||||
|
maxRetries: 3,
|
||||||
|
initialDelay: 1000, // 1 second
|
||||||
|
maxDelay: 30000, // 30 seconds
|
||||||
|
backoffMultiplier: 2,
|
||||||
|
timeout: 10000, // 10 seconds
|
||||||
|
onlineCheckInterval: 5000 // 5 seconds
|
||||||
|
};
|
||||||
|
|
||||||
|
this.state = {
|
||||||
|
status: navigator.onLine ? 'online' : 'offline',
|
||||||
|
retryCount: 0
|
||||||
|
};
|
||||||
|
|
||||||
|
this.setupEventListeners();
|
||||||
|
this.startOnlineCheck();
|
||||||
|
}
|
||||||
|
|
||||||
|
static getInstance(): ConnectionManager {
|
||||||
|
if (!ConnectionManager.instance) {
|
||||||
|
ConnectionManager.instance = new ConnectionManager();
|
||||||
|
}
|
||||||
|
return ConnectionManager.instance;
|
||||||
|
}
|
||||||
|
|
||||||
|
// Configure connection settings
|
||||||
|
configure(config: Partial<ConnectionConfig>): void {
|
||||||
|
this.config = { ...this.config, ...config };
|
||||||
|
}
|
||||||
|
|
||||||
|
// Setup browser online/offline event listeners
|
||||||
|
private setupEventListeners(): void {
|
||||||
|
window.addEventListener('online', () => {
|
||||||
|
console.log('Browser online event detected');
|
||||||
|
this.updateState({ status: 'online', retryCount: 0 });
|
||||||
|
this.checkServerConnection();
|
||||||
|
});
|
||||||
|
|
||||||
|
window.addEventListener('offline', () => {
|
||||||
|
console.log('Browser offline event detected');
|
||||||
|
this.updateState({ status: 'offline' });
|
||||||
|
});
|
||||||
|
|
||||||
|
// Listen for visibility changes to check connection when tab becomes active
|
||||||
|
document.addEventListener('visibilitychange', () => {
|
||||||
|
if (!document.hidden && this.state.status === 'offline') {
|
||||||
|
this.checkServerConnection();
|
||||||
|
}
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
// Start periodic online checking
|
||||||
|
private startOnlineCheck(): void {
|
||||||
|
this.onlineCheckTimer = window.setInterval(() => {
|
||||||
|
if (this.state.status === 'offline' || this.state.status === 'error') {
|
||||||
|
this.checkServerConnection();
|
||||||
|
}
|
||||||
|
}, this.config.onlineCheckInterval);
|
||||||
|
}
|
||||||
|
|
||||||
|
// Check actual server connection
|
||||||
|
async checkServerConnection(): Promise<boolean> {
|
||||||
|
if (!navigator.onLine) {
|
||||||
|
this.updateState({ status: 'offline' });
|
||||||
|
return false;
|
||||||
|
}
|
||||||
|
|
||||||
|
this.updateState({ status: 'connecting' });
|
||||||
|
|
||||||
|
try {
|
||||||
|
const controller = new AbortController();
|
||||||
|
const timeoutId = setTimeout(() => controller.abort(), 5000);
|
||||||
|
|
||||||
|
const response = await fetch('/health', {
|
||||||
|
method: 'GET',
|
||||||
|
signal: controller.signal,
|
||||||
|
cache: 'no-cache'
|
||||||
|
});
|
||||||
|
|
||||||
|
clearTimeout(timeoutId);
|
||||||
|
|
||||||
|
if (response.ok) {
|
||||||
|
this.updateState({
|
||||||
|
status: 'online',
|
||||||
|
retryCount: 0,
|
||||||
|
lastOnlineTime: new Date()
|
||||||
|
});
|
||||||
|
return true;
|
||||||
|
} else {
|
||||||
|
throw new Error(`Server returned status ${response.status}`);
|
||||||
|
}
|
||||||
|
} catch (error) {
|
||||||
|
this.updateState({
|
||||||
|
status: 'error',
|
||||||
|
lastError: error as Error
|
||||||
|
});
|
||||||
|
return false;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// Retry a failed request with exponential backoff
|
||||||
|
async retryRequest<T>(
|
||||||
|
request: () => Promise<T>,
|
||||||
|
options: RetryOptions = {}
|
||||||
|
): Promise<T> {
|
||||||
|
const {
|
||||||
|
retries = this.config.maxRetries,
|
||||||
|
delay = this.config.initialDelay,
|
||||||
|
onRetry
|
||||||
|
} = options;
|
||||||
|
|
||||||
|
let lastError: Error;
|
||||||
|
|
||||||
|
for (let attempt = 0; attempt <= retries; attempt++) {
|
||||||
|
try {
|
||||||
|
// Check if we're online before attempting
|
||||||
|
if (!navigator.onLine) {
|
||||||
|
throw new Error('No internet connection');
|
||||||
|
}
|
||||||
|
|
||||||
|
// Add timeout to request
|
||||||
|
const result = await this.withTimeout(request(), this.config.timeout);
|
||||||
|
|
||||||
|
// Success - reset retry count
|
||||||
|
if (this.state.retryCount > 0) {
|
||||||
|
this.updateState({ retryCount: 0 });
|
||||||
|
}
|
||||||
|
|
||||||
|
return result;
|
||||||
|
} catch (error) {
|
||||||
|
lastError = error as Error;
|
||||||
|
|
||||||
|
// Don't retry if offline
|
||||||
|
if (!navigator.onLine) {
|
||||||
|
this.updateState({ status: 'offline' });
|
||||||
|
throw new Error('Request failed: No internet connection');
|
||||||
|
}
|
||||||
|
|
||||||
|
// Don't retry on client errors (4xx)
|
||||||
|
if (this.isClientError(error)) {
|
||||||
|
throw error;
|
||||||
|
}
|
||||||
|
|
||||||
|
// Call retry callback if provided
|
||||||
|
if (onRetry && attempt < retries) {
|
||||||
|
onRetry(attempt + 1, lastError);
|
||||||
|
}
|
||||||
|
|
||||||
|
// If we have retries left, wait and try again
|
||||||
|
if (attempt < retries) {
|
||||||
|
const backoffDelay = Math.min(
|
||||||
|
delay * Math.pow(this.config.backoffMultiplier, attempt),
|
||||||
|
this.config.maxDelay
|
||||||
|
);
|
||||||
|
|
||||||
|
console.log(`Retry attempt ${attempt + 1}/${retries} after ${backoffDelay}ms`);
|
||||||
|
|
||||||
|
// Update retry count in state
|
||||||
|
this.updateState({ retryCount: attempt + 1 });
|
||||||
|
|
||||||
|
await this.delay(backoffDelay);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// All retries exhausted
|
||||||
|
this.updateState({
|
||||||
|
status: 'error',
|
||||||
|
lastError: lastError!
|
||||||
|
});
|
||||||
|
|
||||||
|
throw new Error(`Request failed after ${retries} retries: ${lastError!.message}`);
|
||||||
|
}
|
||||||
|
|
||||||
|
// Add timeout to a promise
|
||||||
|
private withTimeout<T>(promise: Promise<T>, timeout: number): Promise<T> {
|
||||||
|
return Promise.race([
|
||||||
|
promise,
|
||||||
|
new Promise<T>((_, reject) => {
|
||||||
|
setTimeout(() => reject(new Error('Request timeout')), timeout);
|
||||||
|
})
|
||||||
|
]);
|
||||||
|
}
|
||||||
|
|
||||||
|
// Check if error is a client error (4xx)
|
||||||
|
private isClientError(error: any): boolean {
|
||||||
|
if (error.response && error.response.status >= 400 && error.response.status < 500) {
|
||||||
|
return true;
|
||||||
|
}
|
||||||
|
|
||||||
|
// Check for specific error messages that shouldn't be retried
|
||||||
|
const message = error.message?.toLowerCase() || '';
|
||||||
|
const noRetryErrors = ['unauthorized', 'forbidden', 'bad request', 'not found'];
|
||||||
|
|
||||||
|
return noRetryErrors.some(e => message.includes(e));
|
||||||
|
}
|
||||||
|
|
||||||
|
// Delay helper
|
||||||
|
private delay(ms: number): Promise<void> {
|
||||||
|
return new Promise(resolve => setTimeout(resolve, ms));
|
||||||
|
}
|
||||||
|
|
||||||
|
// Update connection state
|
||||||
|
private updateState(updates: Partial<ConnectionState>): void {
|
||||||
|
this.state = { ...this.state, ...updates };
|
||||||
|
this.notifyListeners();
|
||||||
|
}
|
||||||
|
|
||||||
|
// Subscribe to connection state changes
|
||||||
|
subscribe(id: string, callback: (state: ConnectionState) => void): void {
|
||||||
|
this.listeners.set(id, callback);
|
||||||
|
// Immediately call with current state
|
||||||
|
callback(this.state);
|
||||||
|
}
|
||||||
|
|
||||||
|
// Unsubscribe from connection state changes
|
||||||
|
unsubscribe(id: string): void {
|
||||||
|
this.listeners.delete(id);
|
||||||
|
}
|
||||||
|
|
||||||
|
// Notify all listeners of state change
|
||||||
|
private notifyListeners(): void {
|
||||||
|
this.listeners.forEach(callback => callback(this.state));
|
||||||
|
}
|
||||||
|
|
||||||
|
// Get current connection state
|
||||||
|
getState(): ConnectionState {
|
||||||
|
return { ...this.state };
|
||||||
|
}
|
||||||
|
|
||||||
|
// Check if currently online
|
||||||
|
isOnline(): boolean {
|
||||||
|
return this.state.status === 'online';
|
||||||
|
}
|
||||||
|
|
||||||
|
// Manual reconnect attempt
|
||||||
|
async reconnect(): Promise<boolean> {
|
||||||
|
console.log('Manual reconnect requested');
|
||||||
|
return this.checkServerConnection();
|
||||||
|
}
|
||||||
|
|
||||||
|
// Cleanup
|
||||||
|
destroy(): void {
|
||||||
|
if (this.onlineCheckTimer) {
|
||||||
|
clearInterval(this.onlineCheckTimer);
|
||||||
|
}
|
||||||
|
if (this.reconnectTimer) {
|
||||||
|
clearTimeout(this.reconnectTimer);
|
||||||
|
}
|
||||||
|
this.listeners.clear();
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// Helper function for retrying fetch requests
|
||||||
|
export async function fetchWithRetry(
|
||||||
|
url: string,
|
||||||
|
options: RequestInit = {},
|
||||||
|
retryOptions: RetryOptions = {}
|
||||||
|
): Promise<Response> {
|
||||||
|
const connectionManager = ConnectionManager.getInstance();
|
||||||
|
|
||||||
|
return connectionManager.retryRequest(async () => {
|
||||||
|
const response = await fetch(url, options);
|
||||||
|
|
||||||
|
if (!response.ok && response.status >= 500) {
|
||||||
|
// Server error - throw to trigger retry
|
||||||
|
throw new Error(`Server error: ${response.status}`);
|
||||||
|
}
|
||||||
|
|
||||||
|
return response;
|
||||||
|
}, retryOptions);
|
||||||
|
}
|
||||||
|
|
||||||
|
// Helper function for retrying JSON requests
|
||||||
|
export async function fetchJSONWithRetry<T>(
|
||||||
|
url: string,
|
||||||
|
options: RequestInit = {},
|
||||||
|
retryOptions: RetryOptions = {}
|
||||||
|
): Promise<T> {
|
||||||
|
const response = await fetchWithRetry(url, options, retryOptions);
|
||||||
|
|
||||||
|
if (!response.ok) {
|
||||||
|
throw new Error(`HTTP error! status: ${response.status}`);
|
||||||
|
}
|
||||||
|
|
||||||
|
return response.json();
|
||||||
|
}
|
325
static/js/src/connectionUI.ts
Normal file
325
static/js/src/connectionUI.ts
Normal file
@ -0,0 +1,325 @@
|
|||||||
|
// Connection status UI component
|
||||||
|
import { ConnectionManager, ConnectionState } from './connectionManager';
|
||||||
|
import { RequestQueueManager } from './requestQueue';
|
||||||
|
|
||||||
|
export class ConnectionUI {
|
||||||
|
private static instance: ConnectionUI;
|
||||||
|
private connectionManager: ConnectionManager;
|
||||||
|
private queueManager: RequestQueueManager;
|
||||||
|
private statusElement: HTMLElement | null = null;
|
||||||
|
private retryButton: HTMLButtonElement | null = null;
|
||||||
|
private offlineMessage: HTMLElement | null = null;
|
||||||
|
|
||||||
|
private constructor() {
|
||||||
|
this.connectionManager = ConnectionManager.getInstance();
|
||||||
|
this.queueManager = RequestQueueManager.getInstance();
|
||||||
|
this.createUI();
|
||||||
|
this.subscribeToConnectionChanges();
|
||||||
|
}
|
||||||
|
|
||||||
|
static getInstance(): ConnectionUI {
|
||||||
|
if (!ConnectionUI.instance) {
|
||||||
|
ConnectionUI.instance = new ConnectionUI();
|
||||||
|
}
|
||||||
|
return ConnectionUI.instance;
|
||||||
|
}
|
||||||
|
|
||||||
|
private createUI(): void {
|
||||||
|
// Create connection status indicator
|
||||||
|
this.statusElement = document.createElement('div');
|
||||||
|
this.statusElement.id = 'connectionStatus';
|
||||||
|
this.statusElement.className = 'connection-status';
|
||||||
|
this.statusElement.innerHTML = `
|
||||||
|
<span class="connection-icon"></span>
|
||||||
|
<span class="connection-text">Checking connection...</span>
|
||||||
|
`;
|
||||||
|
|
||||||
|
// Create offline message banner
|
||||||
|
this.offlineMessage = document.createElement('div');
|
||||||
|
this.offlineMessage.id = 'offlineMessage';
|
||||||
|
this.offlineMessage.className = 'offline-message';
|
||||||
|
this.offlineMessage.innerHTML = `
|
||||||
|
<div class="offline-content">
|
||||||
|
<i class="fas fa-wifi-slash"></i>
|
||||||
|
<span class="offline-text">You're offline. Some features may be limited.</span>
|
||||||
|
<button class="btn btn-sm btn-outline-light retry-connection">
|
||||||
|
<i class="fas fa-sync"></i> Retry
|
||||||
|
</button>
|
||||||
|
<div class="queued-info" style="display: none;">
|
||||||
|
<small class="queued-count"></small>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
`;
|
||||||
|
this.offlineMessage.style.display = 'none';
|
||||||
|
|
||||||
|
// Add to page
|
||||||
|
document.body.appendChild(this.statusElement);
|
||||||
|
document.body.appendChild(this.offlineMessage);
|
||||||
|
|
||||||
|
// Get retry button reference
|
||||||
|
this.retryButton = this.offlineMessage.querySelector('.retry-connection') as HTMLButtonElement;
|
||||||
|
this.retryButton?.addEventListener('click', () => this.handleRetry());
|
||||||
|
|
||||||
|
// Add CSS if not already present
|
||||||
|
if (!document.getElementById('connection-ui-styles')) {
|
||||||
|
const style = document.createElement('style');
|
||||||
|
style.id = 'connection-ui-styles';
|
||||||
|
style.textContent = `
|
||||||
|
.connection-status {
|
||||||
|
position: fixed;
|
||||||
|
bottom: 20px;
|
||||||
|
right: 20px;
|
||||||
|
background: rgba(0, 0, 0, 0.8);
|
||||||
|
color: white;
|
||||||
|
padding: 8px 16px;
|
||||||
|
border-radius: 20px;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
gap: 8px;
|
||||||
|
font-size: 14px;
|
||||||
|
z-index: 1000;
|
||||||
|
transition: all 0.3s ease;
|
||||||
|
opacity: 0;
|
||||||
|
transform: translateY(10px);
|
||||||
|
}
|
||||||
|
|
||||||
|
.connection-status.visible {
|
||||||
|
opacity: 1;
|
||||||
|
transform: translateY(0);
|
||||||
|
}
|
||||||
|
|
||||||
|
.connection-status.online {
|
||||||
|
background: rgba(40, 167, 69, 0.9);
|
||||||
|
}
|
||||||
|
|
||||||
|
.connection-status.offline {
|
||||||
|
background: rgba(220, 53, 69, 0.9);
|
||||||
|
}
|
||||||
|
|
||||||
|
.connection-status.connecting {
|
||||||
|
background: rgba(255, 193, 7, 0.9);
|
||||||
|
}
|
||||||
|
|
||||||
|
.connection-icon::before {
|
||||||
|
content: '●';
|
||||||
|
display: inline-block;
|
||||||
|
animation: pulse 2s infinite;
|
||||||
|
}
|
||||||
|
|
||||||
|
.connection-status.connecting .connection-icon::before {
|
||||||
|
animation: spin 1s linear infinite;
|
||||||
|
content: '↻';
|
||||||
|
}
|
||||||
|
|
||||||
|
@keyframes pulse {
|
||||||
|
0%, 100% { opacity: 1; }
|
||||||
|
50% { opacity: 0.5; }
|
||||||
|
}
|
||||||
|
|
||||||
|
@keyframes spin {
|
||||||
|
from { transform: rotate(0deg); }
|
||||||
|
to { transform: rotate(360deg); }
|
||||||
|
}
|
||||||
|
|
||||||
|
.offline-message {
|
||||||
|
position: fixed;
|
||||||
|
top: 0;
|
||||||
|
left: 0;
|
||||||
|
right: 0;
|
||||||
|
background: #dc3545;
|
||||||
|
color: white;
|
||||||
|
padding: 12px;
|
||||||
|
text-align: center;
|
||||||
|
z-index: 1001;
|
||||||
|
transform: translateY(-100%);
|
||||||
|
transition: transform 0.3s ease;
|
||||||
|
}
|
||||||
|
|
||||||
|
.offline-message.show {
|
||||||
|
transform: translateY(0);
|
||||||
|
}
|
||||||
|
|
||||||
|
.offline-content {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
gap: 12px;
|
||||||
|
flex-wrap: wrap;
|
||||||
|
}
|
||||||
|
|
||||||
|
.offline-content i {
|
||||||
|
font-size: 20px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.retry-connection {
|
||||||
|
border-color: white;
|
||||||
|
color: white;
|
||||||
|
}
|
||||||
|
|
||||||
|
.retry-connection:hover {
|
||||||
|
background: white;
|
||||||
|
color: #dc3545;
|
||||||
|
}
|
||||||
|
|
||||||
|
.queued-info {
|
||||||
|
margin-left: 12px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.queued-count {
|
||||||
|
opacity: 0.9;
|
||||||
|
}
|
||||||
|
|
||||||
|
@media (max-width: 768px) {
|
||||||
|
.connection-status {
|
||||||
|
bottom: 10px;
|
||||||
|
right: 10px;
|
||||||
|
font-size: 12px;
|
||||||
|
padding: 6px 12px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.offline-content {
|
||||||
|
font-size: 14px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
`;
|
||||||
|
document.head.appendChild(style);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
private subscribeToConnectionChanges(): void {
|
||||||
|
this.connectionManager.subscribe('connection-ui', (state: ConnectionState) => {
|
||||||
|
this.updateUI(state);
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
private updateUI(state: ConnectionState): void {
|
||||||
|
if (!this.statusElement || !this.offlineMessage) return;
|
||||||
|
|
||||||
|
const statusText = this.statusElement.querySelector('.connection-text') as HTMLElement;
|
||||||
|
|
||||||
|
// Update status element
|
||||||
|
this.statusElement.className = `connection-status visible ${state.status}`;
|
||||||
|
|
||||||
|
switch (state.status) {
|
||||||
|
case 'online':
|
||||||
|
statusText.textContent = 'Connected';
|
||||||
|
this.hideOfflineMessage();
|
||||||
|
// Hide status after 3 seconds when online
|
||||||
|
setTimeout(() => {
|
||||||
|
if (this.connectionManager.getState().status === 'online') {
|
||||||
|
this.statusElement?.classList.remove('visible');
|
||||||
|
}
|
||||||
|
}, 3000);
|
||||||
|
break;
|
||||||
|
|
||||||
|
case 'offline':
|
||||||
|
statusText.textContent = 'Offline';
|
||||||
|
this.showOfflineMessage();
|
||||||
|
this.updateQueuedInfo();
|
||||||
|
break;
|
||||||
|
|
||||||
|
case 'connecting':
|
||||||
|
statusText.textContent = 'Reconnecting...';
|
||||||
|
if (this.retryButton) {
|
||||||
|
this.retryButton.disabled = true;
|
||||||
|
this.retryButton.innerHTML = '<i class="fas fa-spinner fa-spin"></i> Connecting...';
|
||||||
|
}
|
||||||
|
break;
|
||||||
|
|
||||||
|
case 'error':
|
||||||
|
statusText.textContent = `Connection error${state.retryCount > 0 ? ` (Retry ${state.retryCount})` : ''}`;
|
||||||
|
this.showOfflineMessage();
|
||||||
|
this.updateQueuedInfo();
|
||||||
|
if (this.retryButton) {
|
||||||
|
this.retryButton.disabled = false;
|
||||||
|
this.retryButton.innerHTML = '<i class="fas fa-sync"></i> Retry';
|
||||||
|
}
|
||||||
|
break;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
private showOfflineMessage(): void {
|
||||||
|
if (this.offlineMessage) {
|
||||||
|
this.offlineMessage.style.display = 'block';
|
||||||
|
setTimeout(() => {
|
||||||
|
this.offlineMessage?.classList.add('show');
|
||||||
|
}, 10);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
private hideOfflineMessage(): void {
|
||||||
|
if (this.offlineMessage) {
|
||||||
|
this.offlineMessage.classList.remove('show');
|
||||||
|
setTimeout(() => {
|
||||||
|
if (this.offlineMessage) {
|
||||||
|
this.offlineMessage.style.display = 'none';
|
||||||
|
}
|
||||||
|
}, 300);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
private updateQueuedInfo(): void {
|
||||||
|
const queueStatus = this.queueManager.getStatus();
|
||||||
|
const queuedByType = this.queueManager.getQueuedByType();
|
||||||
|
const queuedInfo = this.offlineMessage?.querySelector('.queued-info') as HTMLElement;
|
||||||
|
const queuedCount = this.offlineMessage?.querySelector('.queued-count') as HTMLElement;
|
||||||
|
|
||||||
|
if (queuedInfo && queuedCount) {
|
||||||
|
const totalQueued = queueStatus.queueLength + queueStatus.activeRequests;
|
||||||
|
|
||||||
|
if (totalQueued > 0) {
|
||||||
|
queuedInfo.style.display = 'block';
|
||||||
|
const parts = [];
|
||||||
|
|
||||||
|
if (queuedByType.transcribe > 0) {
|
||||||
|
parts.push(`${queuedByType.transcribe} transcription${queuedByType.transcribe > 1 ? 's' : ''}`);
|
||||||
|
}
|
||||||
|
if (queuedByType.translate > 0) {
|
||||||
|
parts.push(`${queuedByType.translate} translation${queuedByType.translate > 1 ? 's' : ''}`);
|
||||||
|
}
|
||||||
|
if (queuedByType.tts > 0) {
|
||||||
|
parts.push(`${queuedByType.tts} audio generation${queuedByType.tts > 1 ? 's' : ''}`);
|
||||||
|
}
|
||||||
|
|
||||||
|
queuedCount.textContent = `${totalQueued} request${totalQueued > 1 ? 's' : ''} queued${parts.length > 0 ? ': ' + parts.join(', ') : ''}`;
|
||||||
|
} else {
|
||||||
|
queuedInfo.style.display = 'none';
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
private async handleRetry(): Promise<void> {
|
||||||
|
if (this.retryButton) {
|
||||||
|
this.retryButton.disabled = true;
|
||||||
|
this.retryButton.innerHTML = '<i class="fas fa-spinner fa-spin"></i> Connecting...';
|
||||||
|
}
|
||||||
|
|
||||||
|
const success = await this.connectionManager.reconnect();
|
||||||
|
|
||||||
|
if (!success && this.retryButton) {
|
||||||
|
this.retryButton.disabled = false;
|
||||||
|
this.retryButton.innerHTML = '<i class="fas fa-sync"></i> Retry';
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// Public method to show temporary connection message
|
||||||
|
showTemporaryMessage(message: string, type: 'success' | 'error' | 'warning' = 'success'): void {
|
||||||
|
if (!this.statusElement) return;
|
||||||
|
|
||||||
|
const statusText = this.statusElement.querySelector('.connection-text') as HTMLElement;
|
||||||
|
const originalClass = this.statusElement.className;
|
||||||
|
const originalText = statusText.textContent;
|
||||||
|
|
||||||
|
// Update appearance based on type
|
||||||
|
this.statusElement.className = `connection-status visible ${type === 'success' ? 'online' : type === 'error' ? 'offline' : 'connecting'}`;
|
||||||
|
statusText.textContent = message;
|
||||||
|
|
||||||
|
// Reset after 3 seconds
|
||||||
|
setTimeout(() => {
|
||||||
|
if (this.statusElement && statusText) {
|
||||||
|
this.statusElement.className = originalClass;
|
||||||
|
statusText.textContent = originalText || '';
|
||||||
|
}
|
||||||
|
}, 3000);
|
||||||
|
}
|
||||||
|
}
|
286
static/js/src/errorBoundary.ts
Normal file
286
static/js/src/errorBoundary.ts
Normal file
@ -0,0 +1,286 @@
|
|||||||
|
// Error boundary implementation for better error handling
|
||||||
|
export interface ErrorInfo {
|
||||||
|
message: string;
|
||||||
|
stack?: string;
|
||||||
|
component?: string;
|
||||||
|
timestamp: number;
|
||||||
|
userAgent: string;
|
||||||
|
url: string;
|
||||||
|
}
|
||||||
|
|
||||||
|
export class ErrorBoundary {
|
||||||
|
private static instance: ErrorBoundary;
|
||||||
|
private errorLog: ErrorInfo[] = [];
|
||||||
|
private maxErrorLog = 50;
|
||||||
|
private errorHandlers: Map<string, (error: Error, errorInfo: ErrorInfo) => void> = new Map();
|
||||||
|
private globalErrorHandler: ((error: Error, errorInfo: ErrorInfo) => void) | null = null;
|
||||||
|
|
||||||
|
private constructor() {
|
||||||
|
this.setupGlobalErrorHandlers();
|
||||||
|
}
|
||||||
|
|
||||||
|
static getInstance(): ErrorBoundary {
|
||||||
|
if (!ErrorBoundary.instance) {
|
||||||
|
ErrorBoundary.instance = new ErrorBoundary();
|
||||||
|
}
|
||||||
|
return ErrorBoundary.instance;
|
||||||
|
}
|
||||||
|
|
||||||
|
private setupGlobalErrorHandlers(): void {
|
||||||
|
// Handle unhandled errors
|
||||||
|
window.addEventListener('error', (event: ErrorEvent) => {
|
||||||
|
const errorInfo: ErrorInfo = {
|
||||||
|
message: event.message,
|
||||||
|
stack: event.error?.stack,
|
||||||
|
timestamp: Date.now(),
|
||||||
|
userAgent: navigator.userAgent,
|
||||||
|
url: window.location.href,
|
||||||
|
component: 'global'
|
||||||
|
};
|
||||||
|
|
||||||
|
this.logError(event.error || new Error(event.message), errorInfo);
|
||||||
|
this.handleError(event.error || new Error(event.message), errorInfo);
|
||||||
|
|
||||||
|
// Prevent default error handling
|
||||||
|
event.preventDefault();
|
||||||
|
});
|
||||||
|
|
||||||
|
// Handle unhandled promise rejections
|
||||||
|
window.addEventListener('unhandledrejection', (event: PromiseRejectionEvent) => {
|
||||||
|
const error = new Error(event.reason?.message || 'Unhandled Promise Rejection');
|
||||||
|
const errorInfo: ErrorInfo = {
|
||||||
|
message: error.message,
|
||||||
|
stack: event.reason?.stack,
|
||||||
|
timestamp: Date.now(),
|
||||||
|
userAgent: navigator.userAgent,
|
||||||
|
url: window.location.href,
|
||||||
|
component: 'promise'
|
||||||
|
};
|
||||||
|
|
||||||
|
this.logError(error, errorInfo);
|
||||||
|
this.handleError(error, errorInfo);
|
||||||
|
|
||||||
|
// Prevent default error handling
|
||||||
|
event.preventDefault();
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
// Wrap a function with error boundary
|
||||||
|
wrap<T extends (...args: any[]) => any>(
|
||||||
|
fn: T,
|
||||||
|
component: string,
|
||||||
|
fallback?: (...args: Parameters<T>) => ReturnType<T>
|
||||||
|
): T {
|
||||||
|
return ((...args: Parameters<T>): ReturnType<T> => {
|
||||||
|
try {
|
||||||
|
const result = fn(...args);
|
||||||
|
|
||||||
|
// Handle async functions
|
||||||
|
if (result instanceof Promise) {
|
||||||
|
return result.catch((error: Error) => {
|
||||||
|
const errorInfo: ErrorInfo = {
|
||||||
|
message: error.message,
|
||||||
|
stack: error.stack,
|
||||||
|
component,
|
||||||
|
timestamp: Date.now(),
|
||||||
|
userAgent: navigator.userAgent,
|
||||||
|
url: window.location.href
|
||||||
|
};
|
||||||
|
|
||||||
|
this.logError(error, errorInfo);
|
||||||
|
this.handleError(error, errorInfo);
|
||||||
|
|
||||||
|
if (fallback) {
|
||||||
|
return fallback(...args) as ReturnType<T>;
|
||||||
|
}
|
||||||
|
throw error;
|
||||||
|
}) as ReturnType<T>;
|
||||||
|
}
|
||||||
|
|
||||||
|
return result;
|
||||||
|
} catch (error: any) {
|
||||||
|
const errorInfo: ErrorInfo = {
|
||||||
|
message: error.message,
|
||||||
|
stack: error.stack,
|
||||||
|
component,
|
||||||
|
timestamp: Date.now(),
|
||||||
|
userAgent: navigator.userAgent,
|
||||||
|
url: window.location.href
|
||||||
|
};
|
||||||
|
|
||||||
|
this.logError(error, errorInfo);
|
||||||
|
this.handleError(error, errorInfo);
|
||||||
|
|
||||||
|
if (fallback) {
|
||||||
|
return fallback(...args);
|
||||||
|
}
|
||||||
|
throw error;
|
||||||
|
}
|
||||||
|
}) as T;
|
||||||
|
}
|
||||||
|
|
||||||
|
// Wrap async functions specifically
|
||||||
|
wrapAsync<T extends (...args: any[]) => Promise<any>>(
|
||||||
|
fn: T,
|
||||||
|
component: string,
|
||||||
|
fallback?: (...args: Parameters<T>) => ReturnType<T>
|
||||||
|
): T {
|
||||||
|
return (async (...args: Parameters<T>) => {
|
||||||
|
try {
|
||||||
|
return await fn(...args);
|
||||||
|
} catch (error: any) {
|
||||||
|
const errorInfo: ErrorInfo = {
|
||||||
|
message: error.message,
|
||||||
|
stack: error.stack,
|
||||||
|
component,
|
||||||
|
timestamp: Date.now(),
|
||||||
|
userAgent: navigator.userAgent,
|
||||||
|
url: window.location.href
|
||||||
|
};
|
||||||
|
|
||||||
|
this.logError(error, errorInfo);
|
||||||
|
this.handleError(error, errorInfo);
|
||||||
|
|
||||||
|
if (fallback) {
|
||||||
|
return fallback(...args);
|
||||||
|
}
|
||||||
|
throw error;
|
||||||
|
}
|
||||||
|
}) as T;
|
||||||
|
}
|
||||||
|
|
||||||
|
// Register component-specific error handler
|
||||||
|
registerErrorHandler(component: string, handler: (error: Error, errorInfo: ErrorInfo) => void): void {
|
||||||
|
this.errorHandlers.set(component, handler);
|
||||||
|
}
|
||||||
|
|
||||||
|
// Set global error handler
|
||||||
|
setGlobalErrorHandler(handler: (error: Error, errorInfo: ErrorInfo) => void): void {
|
||||||
|
this.globalErrorHandler = handler;
|
||||||
|
}
|
||||||
|
|
||||||
|
private logError(error: Error, errorInfo: ErrorInfo): void {
|
||||||
|
// Add to error log
|
||||||
|
this.errorLog.push(errorInfo);
|
||||||
|
|
||||||
|
// Keep only recent errors
|
||||||
|
if (this.errorLog.length > this.maxErrorLog) {
|
||||||
|
this.errorLog.shift();
|
||||||
|
}
|
||||||
|
|
||||||
|
// Log to console in development
|
||||||
|
console.error(`[${errorInfo.component}] Error:`, error);
|
||||||
|
console.error('Error Info:', errorInfo);
|
||||||
|
|
||||||
|
// Send to monitoring service if available
|
||||||
|
this.sendToMonitoring(error, errorInfo);
|
||||||
|
}
|
||||||
|
|
||||||
|
private handleError(error: Error, errorInfo: ErrorInfo): void {
|
||||||
|
// Check for component-specific handler
|
||||||
|
const componentHandler = this.errorHandlers.get(errorInfo.component || '');
|
||||||
|
if (componentHandler) {
|
||||||
|
componentHandler(error, errorInfo);
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
// Use global handler if set
|
||||||
|
if (this.globalErrorHandler) {
|
||||||
|
this.globalErrorHandler(error, errorInfo);
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
// Default error handling
|
||||||
|
this.showErrorNotification(error, errorInfo);
|
||||||
|
}
|
||||||
|
|
||||||
|
private showErrorNotification(error: Error, errorInfo: ErrorInfo): void {
|
||||||
|
// Create error notification
|
||||||
|
const notification = document.createElement('div');
|
||||||
|
notification.className = 'alert alert-danger alert-dismissible fade show position-fixed bottom-0 end-0 m-3';
|
||||||
|
notification.style.zIndex = '9999';
|
||||||
|
notification.style.maxWidth = '400px';
|
||||||
|
|
||||||
|
const isUserFacing = this.isUserFacingError(error);
|
||||||
|
const message = isUserFacing ? error.message : 'An unexpected error occurred. Please try again.';
|
||||||
|
|
||||||
|
notification.innerHTML = `
|
||||||
|
<strong><i class="fas fa-exclamation-circle"></i> Error${errorInfo.component ? ` in ${errorInfo.component}` : ''}</strong>
|
||||||
|
<p class="mb-0">${message}</p>
|
||||||
|
${!isUserFacing ? '<small class="text-muted">The error has been logged for investigation.</small>' : ''}
|
||||||
|
<button type="button" class="btn-close" data-bs-dismiss="alert"></button>
|
||||||
|
`;
|
||||||
|
|
||||||
|
document.body.appendChild(notification);
|
||||||
|
|
||||||
|
// Auto-dismiss after 10 seconds
|
||||||
|
setTimeout(() => {
|
||||||
|
if (notification.parentNode) {
|
||||||
|
notification.remove();
|
||||||
|
}
|
||||||
|
}, 10000);
|
||||||
|
}
|
||||||
|
|
||||||
|
private isUserFacingError(error: Error): boolean {
|
||||||
|
// Determine if error should be shown to user as-is
|
||||||
|
const userFacingMessages = [
|
||||||
|
'rate limit',
|
||||||
|
'network',
|
||||||
|
'offline',
|
||||||
|
'not found',
|
||||||
|
'unauthorized',
|
||||||
|
'forbidden',
|
||||||
|
'timeout',
|
||||||
|
'invalid'
|
||||||
|
];
|
||||||
|
|
||||||
|
const message = error.message.toLowerCase();
|
||||||
|
return userFacingMessages.some(msg => message.includes(msg));
|
||||||
|
}
|
||||||
|
|
||||||
|
private async sendToMonitoring(error: Error, errorInfo: ErrorInfo): Promise<void> {
|
||||||
|
// Only send errors in production
|
||||||
|
if (window.location.hostname === 'localhost' || window.location.hostname === '127.0.0.1') {
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
try {
|
||||||
|
// Send error to backend monitoring endpoint
|
||||||
|
await fetch('/api/log-error', {
|
||||||
|
method: 'POST',
|
||||||
|
headers: {
|
||||||
|
'Content-Type': 'application/json'
|
||||||
|
},
|
||||||
|
body: JSON.stringify({
|
||||||
|
error: {
|
||||||
|
message: error.message,
|
||||||
|
stack: error.stack,
|
||||||
|
name: error.name
|
||||||
|
},
|
||||||
|
errorInfo
|
||||||
|
})
|
||||||
|
});
|
||||||
|
} catch (monitoringError) {
|
||||||
|
// Fail silently - don't create error loop
|
||||||
|
console.error('Failed to send error to monitoring:', monitoringError);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// Get error log for debugging
|
||||||
|
getErrorLog(): ErrorInfo[] {
|
||||||
|
return [...this.errorLog];
|
||||||
|
}
|
||||||
|
|
||||||
|
// Clear error log
|
||||||
|
clearErrorLog(): void {
|
||||||
|
this.errorLog = [];
|
||||||
|
}
|
||||||
|
|
||||||
|
// Check if component has recent errors
|
||||||
|
hasRecentErrors(component: string, timeWindow: number = 60000): boolean {
|
||||||
|
const cutoff = Date.now() - timeWindow;
|
||||||
|
return this.errorLog.some(
|
||||||
|
error => error.component === component && error.timestamp > cutoff
|
||||||
|
);
|
||||||
|
}
|
||||||
|
}
|
309
static/js/src/memoryManager.ts
Normal file
309
static/js/src/memoryManager.ts
Normal file
@ -0,0 +1,309 @@
|
|||||||
|
/**
|
||||||
|
* Memory management utilities for preventing leaks in audio handling
|
||||||
|
*/
|
||||||
|
|
||||||
|
export class MemoryManager {
|
||||||
|
private static instance: MemoryManager;
|
||||||
|
private audioContexts: Set<AudioContext> = new Set();
|
||||||
|
private objectURLs: Set<string> = new Set();
|
||||||
|
private mediaStreams: Set<MediaStream> = new Set();
|
||||||
|
private intervals: Set<number> = new Set();
|
||||||
|
private timeouts: Set<number> = new Set();
|
||||||
|
|
||||||
|
private constructor() {
|
||||||
|
// Set up periodic cleanup
|
||||||
|
this.startPeriodicCleanup();
|
||||||
|
|
||||||
|
// Clean up on page unload
|
||||||
|
window.addEventListener('beforeunload', () => this.cleanup());
|
||||||
|
}
|
||||||
|
|
||||||
|
static getInstance(): MemoryManager {
|
||||||
|
if (!MemoryManager.instance) {
|
||||||
|
MemoryManager.instance = new MemoryManager();
|
||||||
|
}
|
||||||
|
return MemoryManager.instance;
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Register an AudioContext for cleanup
|
||||||
|
*/
|
||||||
|
registerAudioContext(context: AudioContext): void {
|
||||||
|
this.audioContexts.add(context);
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Register an object URL for cleanup
|
||||||
|
*/
|
||||||
|
registerObjectURL(url: string): void {
|
||||||
|
this.objectURLs.add(url);
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Register a MediaStream for cleanup
|
||||||
|
*/
|
||||||
|
registerMediaStream(stream: MediaStream): void {
|
||||||
|
this.mediaStreams.add(stream);
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Register an interval for cleanup
|
||||||
|
*/
|
||||||
|
registerInterval(id: number): void {
|
||||||
|
this.intervals.add(id);
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Register a timeout for cleanup
|
||||||
|
*/
|
||||||
|
registerTimeout(id: number): void {
|
||||||
|
this.timeouts.add(id);
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Clean up a specific AudioContext
|
||||||
|
*/
|
||||||
|
cleanupAudioContext(context: AudioContext): void {
|
||||||
|
if (context.state !== 'closed') {
|
||||||
|
context.close().catch(console.error);
|
||||||
|
}
|
||||||
|
this.audioContexts.delete(context);
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Clean up a specific object URL
|
||||||
|
*/
|
||||||
|
cleanupObjectURL(url: string): void {
|
||||||
|
URL.revokeObjectURL(url);
|
||||||
|
this.objectURLs.delete(url);
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Clean up a specific MediaStream
|
||||||
|
*/
|
||||||
|
cleanupMediaStream(stream: MediaStream): void {
|
||||||
|
stream.getTracks().forEach(track => {
|
||||||
|
track.stop();
|
||||||
|
});
|
||||||
|
this.mediaStreams.delete(stream);
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Clean up all resources
|
||||||
|
*/
|
||||||
|
cleanup(): void {
|
||||||
|
// Clean up audio contexts
|
||||||
|
this.audioContexts.forEach(context => {
|
||||||
|
if (context.state !== 'closed') {
|
||||||
|
context.close().catch(console.error);
|
||||||
|
}
|
||||||
|
});
|
||||||
|
this.audioContexts.clear();
|
||||||
|
|
||||||
|
// Clean up object URLs
|
||||||
|
this.objectURLs.forEach(url => {
|
||||||
|
URL.revokeObjectURL(url);
|
||||||
|
});
|
||||||
|
this.objectURLs.clear();
|
||||||
|
|
||||||
|
// Clean up media streams
|
||||||
|
this.mediaStreams.forEach(stream => {
|
||||||
|
stream.getTracks().forEach(track => {
|
||||||
|
track.stop();
|
||||||
|
});
|
||||||
|
});
|
||||||
|
this.mediaStreams.clear();
|
||||||
|
|
||||||
|
// Clear intervals and timeouts
|
||||||
|
this.intervals.forEach(id => clearInterval(id));
|
||||||
|
this.intervals.clear();
|
||||||
|
|
||||||
|
this.timeouts.forEach(id => clearTimeout(id));
|
||||||
|
this.timeouts.clear();
|
||||||
|
|
||||||
|
console.log('Memory cleanup completed');
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Get memory usage statistics
|
||||||
|
*/
|
||||||
|
getStats(): MemoryStats {
|
||||||
|
return {
|
||||||
|
audioContexts: this.audioContexts.size,
|
||||||
|
objectURLs: this.objectURLs.size,
|
||||||
|
mediaStreams: this.mediaStreams.size,
|
||||||
|
intervals: this.intervals.size,
|
||||||
|
timeouts: this.timeouts.size
|
||||||
|
};
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Start periodic cleanup of orphaned resources
|
||||||
|
*/
|
||||||
|
private startPeriodicCleanup(): void {
|
||||||
|
setInterval(() => {
|
||||||
|
// Clean up closed audio contexts
|
||||||
|
this.audioContexts.forEach(context => {
|
||||||
|
if (context.state === 'closed') {
|
||||||
|
this.audioContexts.delete(context);
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
// Clean up stopped media streams
|
||||||
|
this.mediaStreams.forEach(stream => {
|
||||||
|
const activeTracks = stream.getTracks().filter(track => track.readyState === 'live');
|
||||||
|
if (activeTracks.length === 0) {
|
||||||
|
this.mediaStreams.delete(stream);
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
// Log stats in development
|
||||||
|
if (process.env.NODE_ENV === 'development') {
|
||||||
|
const stats = this.getStats();
|
||||||
|
if (Object.values(stats).some(v => v > 0)) {
|
||||||
|
console.log('Memory manager stats:', stats);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}, 30000); // Every 30 seconds
|
||||||
|
|
||||||
|
// Don't track this interval to avoid self-reference
|
||||||
|
// It will be cleared on page unload
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
interface MemoryStats {
|
||||||
|
audioContexts: number;
|
||||||
|
objectURLs: number;
|
||||||
|
mediaStreams: number;
|
||||||
|
intervals: number;
|
||||||
|
timeouts: number;
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Wrapper for safe audio blob handling
|
||||||
|
*/
|
||||||
|
export class AudioBlobHandler {
|
||||||
|
private blob: Blob;
|
||||||
|
private objectURL?: string;
|
||||||
|
private memoryManager: MemoryManager;
|
||||||
|
|
||||||
|
constructor(blob: Blob) {
|
||||||
|
this.blob = blob;
|
||||||
|
this.memoryManager = MemoryManager.getInstance();
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Get object URL (creates one if needed)
|
||||||
|
*/
|
||||||
|
getObjectURL(): string {
|
||||||
|
if (!this.objectURL) {
|
||||||
|
this.objectURL = URL.createObjectURL(this.blob);
|
||||||
|
this.memoryManager.registerObjectURL(this.objectURL);
|
||||||
|
}
|
||||||
|
return this.objectURL;
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Get the blob
|
||||||
|
*/
|
||||||
|
getBlob(): Blob {
|
||||||
|
return this.blob;
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Clean up resources
|
||||||
|
*/
|
||||||
|
cleanup(): void {
|
||||||
|
if (this.objectURL) {
|
||||||
|
this.memoryManager.cleanupObjectURL(this.objectURL);
|
||||||
|
this.objectURL = undefined;
|
||||||
|
}
|
||||||
|
// Help garbage collection
|
||||||
|
(this.blob as any) = null;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Safe MediaRecorder wrapper
|
||||||
|
*/
|
||||||
|
export class SafeMediaRecorder {
|
||||||
|
private mediaRecorder?: MediaRecorder;
|
||||||
|
private stream?: MediaStream;
|
||||||
|
private chunks: Blob[] = [];
|
||||||
|
private memoryManager: MemoryManager;
|
||||||
|
|
||||||
|
constructor() {
|
||||||
|
this.memoryManager = MemoryManager.getInstance();
|
||||||
|
}
|
||||||
|
|
||||||
|
async start(constraints: MediaStreamConstraints = { audio: true }): Promise<void> {
|
||||||
|
// Clean up any existing recorder
|
||||||
|
this.cleanup();
|
||||||
|
|
||||||
|
this.stream = await navigator.mediaDevices.getUserMedia(constraints);
|
||||||
|
this.memoryManager.registerMediaStream(this.stream);
|
||||||
|
|
||||||
|
const options = {
|
||||||
|
mimeType: MediaRecorder.isTypeSupported('audio/webm;codecs=opus')
|
||||||
|
? 'audio/webm;codecs=opus'
|
||||||
|
: 'audio/webm'
|
||||||
|
};
|
||||||
|
|
||||||
|
this.mediaRecorder = new MediaRecorder(this.stream, options);
|
||||||
|
this.chunks = [];
|
||||||
|
|
||||||
|
this.mediaRecorder.ondataavailable = (event) => {
|
||||||
|
if (event.data.size > 0) {
|
||||||
|
this.chunks.push(event.data);
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
this.mediaRecorder.start();
|
||||||
|
}
|
||||||
|
|
||||||
|
stop(): Promise<Blob> {
|
||||||
|
return new Promise((resolve, reject) => {
|
||||||
|
if (!this.mediaRecorder) {
|
||||||
|
reject(new Error('MediaRecorder not initialized'));
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
this.mediaRecorder.onstop = () => {
|
||||||
|
const blob = new Blob(this.chunks, {
|
||||||
|
type: this.mediaRecorder?.mimeType || 'audio/webm'
|
||||||
|
});
|
||||||
|
resolve(blob);
|
||||||
|
|
||||||
|
// Clean up after delivering the blob
|
||||||
|
setTimeout(() => this.cleanup(), 100);
|
||||||
|
};
|
||||||
|
|
||||||
|
this.mediaRecorder.stop();
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
cleanup(): void {
|
||||||
|
if (this.stream) {
|
||||||
|
this.memoryManager.cleanupMediaStream(this.stream);
|
||||||
|
this.stream = undefined;
|
||||||
|
}
|
||||||
|
|
||||||
|
if (this.mediaRecorder) {
|
||||||
|
if (this.mediaRecorder.state !== 'inactive') {
|
||||||
|
try {
|
||||||
|
this.mediaRecorder.stop();
|
||||||
|
} catch (e) {
|
||||||
|
// Ignore errors
|
||||||
|
}
|
||||||
|
}
|
||||||
|
this.mediaRecorder = undefined;
|
||||||
|
}
|
||||||
|
|
||||||
|
// Clear chunks
|
||||||
|
this.chunks = [];
|
||||||
|
}
|
||||||
|
|
||||||
|
isRecording(): boolean {
|
||||||
|
return this.mediaRecorder?.state === 'recording';
|
||||||
|
}
|
||||||
|
}
|
147
static/js/src/performanceMonitor.ts
Normal file
147
static/js/src/performanceMonitor.ts
Normal file
@ -0,0 +1,147 @@
|
|||||||
|
// Performance monitoring for translation latency
|
||||||
|
export class PerformanceMonitor {
|
||||||
|
private static instance: PerformanceMonitor;
|
||||||
|
private metrics: Map<string, number[]> = new Map();
|
||||||
|
private timers: Map<string, number> = new Map();
|
||||||
|
|
||||||
|
private constructor() {}
|
||||||
|
|
||||||
|
static getInstance(): PerformanceMonitor {
|
||||||
|
if (!PerformanceMonitor.instance) {
|
||||||
|
PerformanceMonitor.instance = new PerformanceMonitor();
|
||||||
|
}
|
||||||
|
return PerformanceMonitor.instance;
|
||||||
|
}
|
||||||
|
|
||||||
|
// Start timing an operation
|
||||||
|
startTimer(operation: string): void {
|
||||||
|
this.timers.set(operation, performance.now());
|
||||||
|
}
|
||||||
|
|
||||||
|
// End timing and record the duration
|
||||||
|
endTimer(operation: string): number {
|
||||||
|
const startTime = this.timers.get(operation);
|
||||||
|
if (!startTime) {
|
||||||
|
console.warn(`No start time found for operation: ${operation}`);
|
||||||
|
return 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
const duration = performance.now() - startTime;
|
||||||
|
this.recordMetric(operation, duration);
|
||||||
|
this.timers.delete(operation);
|
||||||
|
|
||||||
|
return duration;
|
||||||
|
}
|
||||||
|
|
||||||
|
// Record a metric value
|
||||||
|
recordMetric(name: string, value: number): void {
|
||||||
|
if (!this.metrics.has(name)) {
|
||||||
|
this.metrics.set(name, []);
|
||||||
|
}
|
||||||
|
|
||||||
|
const values = this.metrics.get(name)!;
|
||||||
|
values.push(value);
|
||||||
|
|
||||||
|
// Keep only last 100 values
|
||||||
|
if (values.length > 100) {
|
||||||
|
values.shift();
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// Get average metric value
|
||||||
|
getAverageMetric(name: string): number {
|
||||||
|
const values = this.metrics.get(name);
|
||||||
|
if (!values || values.length === 0) {
|
||||||
|
return 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
const sum = values.reduce((a, b) => a + b, 0);
|
||||||
|
return sum / values.length;
|
||||||
|
}
|
||||||
|
|
||||||
|
// Get time to first byte (TTFB) for streaming
|
||||||
|
measureTTFB(operation: string, firstByteTime: number): number {
|
||||||
|
const startTime = this.timers.get(operation);
|
||||||
|
if (!startTime) {
|
||||||
|
return 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
const ttfb = firstByteTime - startTime;
|
||||||
|
this.recordMetric(`${operation}_ttfb`, ttfb);
|
||||||
|
return ttfb;
|
||||||
|
}
|
||||||
|
|
||||||
|
// Get performance summary
|
||||||
|
getPerformanceSummary(): {
|
||||||
|
streaming: {
|
||||||
|
avgTotalTime: number;
|
||||||
|
avgTTFB: number;
|
||||||
|
count: number;
|
||||||
|
};
|
||||||
|
regular: {
|
||||||
|
avgTotalTime: number;
|
||||||
|
count: number;
|
||||||
|
};
|
||||||
|
improvement: {
|
||||||
|
ttfbReduction: number;
|
||||||
|
perceivedLatencyReduction: number;
|
||||||
|
};
|
||||||
|
} {
|
||||||
|
const streamingTotal = this.getAverageMetric('streaming_translation');
|
||||||
|
const streamingTTFB = this.getAverageMetric('streaming_translation_ttfb');
|
||||||
|
const streamingCount = this.metrics.get('streaming_translation')?.length || 0;
|
||||||
|
|
||||||
|
const regularTotal = this.getAverageMetric('regular_translation');
|
||||||
|
const regularCount = this.metrics.get('regular_translation')?.length || 0;
|
||||||
|
|
||||||
|
// Calculate improvements
|
||||||
|
const ttfbReduction = regularTotal > 0 && streamingTTFB > 0
|
||||||
|
? ((regularTotal - streamingTTFB) / regularTotal) * 100
|
||||||
|
: 0;
|
||||||
|
|
||||||
|
// Perceived latency is based on TTFB for streaming vs total time for regular
|
||||||
|
const perceivedLatencyReduction = ttfbReduction;
|
||||||
|
|
||||||
|
return {
|
||||||
|
streaming: {
|
||||||
|
avgTotalTime: streamingTotal,
|
||||||
|
avgTTFB: streamingTTFB,
|
||||||
|
count: streamingCount
|
||||||
|
},
|
||||||
|
regular: {
|
||||||
|
avgTotalTime: regularTotal,
|
||||||
|
count: regularCount
|
||||||
|
},
|
||||||
|
improvement: {
|
||||||
|
ttfbReduction: Math.round(ttfbReduction),
|
||||||
|
perceivedLatencyReduction: Math.round(perceivedLatencyReduction)
|
||||||
|
}
|
||||||
|
};
|
||||||
|
}
|
||||||
|
|
||||||
|
// Log performance stats to console
|
||||||
|
logPerformanceStats(): void {
|
||||||
|
const summary = this.getPerformanceSummary();
|
||||||
|
|
||||||
|
console.group('Translation Performance Stats');
|
||||||
|
console.log('Streaming Translation:');
|
||||||
|
console.log(` Average Total Time: ${summary.streaming.avgTotalTime.toFixed(2)}ms`);
|
||||||
|
console.log(` Average TTFB: ${summary.streaming.avgTTFB.toFixed(2)}ms`);
|
||||||
|
console.log(` Sample Count: ${summary.streaming.count}`);
|
||||||
|
|
||||||
|
console.log('Regular Translation:');
|
||||||
|
console.log(` Average Total Time: ${summary.regular.avgTotalTime.toFixed(2)}ms`);
|
||||||
|
console.log(` Sample Count: ${summary.regular.count}`);
|
||||||
|
|
||||||
|
console.log('Improvements:');
|
||||||
|
console.log(` TTFB Reduction: ${summary.improvement.ttfbReduction}%`);
|
||||||
|
console.log(` Perceived Latency Reduction: ${summary.improvement.perceivedLatencyReduction}%`);
|
||||||
|
console.groupEnd();
|
||||||
|
}
|
||||||
|
|
||||||
|
// Clear all metrics
|
||||||
|
clearMetrics(): void {
|
||||||
|
this.metrics.clear();
|
||||||
|
this.timers.clear();
|
||||||
|
}
|
||||||
|
}
|
333
static/js/src/requestQueue.ts
Normal file
333
static/js/src/requestQueue.ts
Normal file
@ -0,0 +1,333 @@
|
|||||||
|
// Request queue and throttling manager
|
||||||
|
import { ConnectionManager, ConnectionState } from './connectionManager';
|
||||||
|
|
||||||
|
export interface QueuedRequest {
|
||||||
|
id: string;
|
||||||
|
type: 'transcribe' | 'translate' | 'tts';
|
||||||
|
request: () => Promise<any>;
|
||||||
|
resolve: (value: any) => void;
|
||||||
|
reject: (reason?: any) => void;
|
||||||
|
retryCount: number;
|
||||||
|
priority: number;
|
||||||
|
timestamp: number;
|
||||||
|
}
|
||||||
|
|
||||||
|
export class RequestQueueManager {
|
||||||
|
private static instance: RequestQueueManager;
|
||||||
|
private queue: QueuedRequest[] = [];
|
||||||
|
private activeRequests: Map<string, QueuedRequest> = new Map();
|
||||||
|
private maxConcurrent = 2; // Maximum concurrent requests
|
||||||
|
private maxRetries = 3;
|
||||||
|
private retryDelay = 1000; // Base retry delay in ms
|
||||||
|
private isProcessing = false;
|
||||||
|
private connectionManager: ConnectionManager;
|
||||||
|
private isPaused = false;
|
||||||
|
|
||||||
|
// Rate limiting
|
||||||
|
private requestHistory: number[] = [];
|
||||||
|
private maxRequestsPerMinute = 30;
|
||||||
|
private maxRequestsPerSecond = 2;
|
||||||
|
|
||||||
|
private constructor() {
|
||||||
|
this.connectionManager = ConnectionManager.getInstance();
|
||||||
|
|
||||||
|
// Subscribe to connection state changes
|
||||||
|
this.connectionManager.subscribe('request-queue', (state: ConnectionState) => {
|
||||||
|
this.handleConnectionStateChange(state);
|
||||||
|
});
|
||||||
|
|
||||||
|
// Start processing queue
|
||||||
|
this.startProcessing();
|
||||||
|
}
|
||||||
|
|
||||||
|
static getInstance(): RequestQueueManager {
|
||||||
|
if (!RequestQueueManager.instance) {
|
||||||
|
RequestQueueManager.instance = new RequestQueueManager();
|
||||||
|
}
|
||||||
|
return RequestQueueManager.instance;
|
||||||
|
}
|
||||||
|
|
||||||
|
// Add request to queue
|
||||||
|
async enqueue<T>(
|
||||||
|
type: 'transcribe' | 'translate' | 'tts',
|
||||||
|
request: () => Promise<T>,
|
||||||
|
priority: number = 5
|
||||||
|
): Promise<T> {
|
||||||
|
// Check rate limits
|
||||||
|
if (!this.checkRateLimits()) {
|
||||||
|
throw new Error('Rate limit exceeded. Please slow down.');
|
||||||
|
}
|
||||||
|
|
||||||
|
return new Promise((resolve, reject) => {
|
||||||
|
const id = this.generateId();
|
||||||
|
const queuedRequest: QueuedRequest = {
|
||||||
|
id,
|
||||||
|
type,
|
||||||
|
request,
|
||||||
|
resolve,
|
||||||
|
reject,
|
||||||
|
retryCount: 0,
|
||||||
|
priority,
|
||||||
|
timestamp: Date.now()
|
||||||
|
};
|
||||||
|
|
||||||
|
// Add to queue based on priority
|
||||||
|
this.addToQueue(queuedRequest);
|
||||||
|
|
||||||
|
// Log queue status
|
||||||
|
console.log(`Request queued: ${type}, Queue size: ${this.queue.length}, Active: ${this.activeRequests.size}`);
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
private addToQueue(request: QueuedRequest): void {
|
||||||
|
// Insert based on priority (higher priority first)
|
||||||
|
const insertIndex = this.queue.findIndex(item => item.priority < request.priority);
|
||||||
|
if (insertIndex === -1) {
|
||||||
|
this.queue.push(request);
|
||||||
|
} else {
|
||||||
|
this.queue.splice(insertIndex, 0, request);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
private checkRateLimits(): boolean {
|
||||||
|
const now = Date.now();
|
||||||
|
|
||||||
|
// Clean old entries
|
||||||
|
this.requestHistory = this.requestHistory.filter(
|
||||||
|
time => now - time < 60000 // Keep last minute
|
||||||
|
);
|
||||||
|
|
||||||
|
// Check per-second limit
|
||||||
|
const lastSecond = this.requestHistory.filter(
|
||||||
|
time => now - time < 1000
|
||||||
|
).length;
|
||||||
|
|
||||||
|
if (lastSecond >= this.maxRequestsPerSecond) {
|
||||||
|
console.warn('Per-second rate limit reached');
|
||||||
|
return false;
|
||||||
|
}
|
||||||
|
|
||||||
|
// Check per-minute limit
|
||||||
|
if (this.requestHistory.length >= this.maxRequestsPerMinute) {
|
||||||
|
console.warn('Per-minute rate limit reached');
|
||||||
|
return false;
|
||||||
|
}
|
||||||
|
|
||||||
|
// Record this request
|
||||||
|
this.requestHistory.push(now);
|
||||||
|
return true;
|
||||||
|
}
|
||||||
|
|
||||||
|
private async startProcessing(): Promise<void> {
|
||||||
|
if (this.isProcessing) return;
|
||||||
|
this.isProcessing = true;
|
||||||
|
|
||||||
|
while (true) {
|
||||||
|
await this.processQueue();
|
||||||
|
await this.delay(100); // Check queue every 100ms
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
private async processQueue(): Promise<void> {
|
||||||
|
// Check if we're paused or can't process more requests
|
||||||
|
if (this.isPaused || this.activeRequests.size >= this.maxConcurrent || this.queue.length === 0) {
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
// Check if we're online
|
||||||
|
if (!this.connectionManager.isOnline()) {
|
||||||
|
console.log('Queue processing paused - offline');
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
// Get next request
|
||||||
|
const request = this.queue.shift();
|
||||||
|
if (!request) return;
|
||||||
|
|
||||||
|
// Mark as active
|
||||||
|
this.activeRequests.set(request.id, request);
|
||||||
|
|
||||||
|
try {
|
||||||
|
// Execute request with connection manager retry logic
|
||||||
|
const result = await this.connectionManager.retryRequest(
|
||||||
|
request.request,
|
||||||
|
{
|
||||||
|
retries: this.maxRetries - request.retryCount,
|
||||||
|
delay: this.calculateRetryDelay(request.retryCount + 1),
|
||||||
|
onRetry: (attempt, error) => {
|
||||||
|
console.log(`Retry ${attempt} for ${request.type}: ${error.message}`);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
);
|
||||||
|
|
||||||
|
request.resolve(result);
|
||||||
|
console.log(`Request completed: ${request.type}`);
|
||||||
|
} catch (error) {
|
||||||
|
console.error(`Request failed after retries: ${request.type}`, error);
|
||||||
|
|
||||||
|
// Check if it's a connection error and we should queue for later
|
||||||
|
if (this.isConnectionError(error) && request.retryCount < this.maxRetries) {
|
||||||
|
request.retryCount++;
|
||||||
|
console.log(`Re-queuing ${request.type} due to connection error`);
|
||||||
|
|
||||||
|
// Re-queue with higher priority
|
||||||
|
request.priority = Math.max(request.priority + 1, 10);
|
||||||
|
this.addToQueue(request);
|
||||||
|
} else {
|
||||||
|
// Non-recoverable error or max retries reached
|
||||||
|
request.reject(error);
|
||||||
|
}
|
||||||
|
} finally {
|
||||||
|
// Remove from active
|
||||||
|
this.activeRequests.delete(request.id);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// Note: shouldRetry logic is now handled by ConnectionManager
|
||||||
|
// Keeping for reference but not used directly
|
||||||
|
|
||||||
|
private calculateRetryDelay(retryCount: number): number {
|
||||||
|
// Exponential backoff with jitter
|
||||||
|
const baseDelay = this.retryDelay * Math.pow(2, retryCount - 1);
|
||||||
|
const jitter = Math.random() * 0.3 * baseDelay; // 30% jitter
|
||||||
|
return Math.min(baseDelay + jitter, 30000); // Max 30 seconds
|
||||||
|
}
|
||||||
|
|
||||||
|
private generateId(): string {
|
||||||
|
return `${Date.now()}-${Math.random().toString(36).substr(2, 9)}`;
|
||||||
|
}
|
||||||
|
|
||||||
|
private delay(ms: number): Promise<void> {
|
||||||
|
return new Promise(resolve => setTimeout(resolve, ms));
|
||||||
|
}
|
||||||
|
|
||||||
|
// Get queue status
|
||||||
|
getStatus(): {
|
||||||
|
queueLength: number;
|
||||||
|
activeRequests: number;
|
||||||
|
requestsPerMinute: number;
|
||||||
|
} {
|
||||||
|
const now = Date.now();
|
||||||
|
const recentRequests = this.requestHistory.filter(
|
||||||
|
time => now - time < 60000
|
||||||
|
).length;
|
||||||
|
|
||||||
|
return {
|
||||||
|
queueLength: this.queue.length,
|
||||||
|
activeRequests: this.activeRequests.size,
|
||||||
|
requestsPerMinute: recentRequests
|
||||||
|
};
|
||||||
|
}
|
||||||
|
|
||||||
|
// Clear queue (for emergency use)
|
||||||
|
clearQueue(): void {
|
||||||
|
this.queue.forEach(request => {
|
||||||
|
request.reject(new Error('Queue cleared'));
|
||||||
|
});
|
||||||
|
this.queue = [];
|
||||||
|
}
|
||||||
|
|
||||||
|
// Clear stuck requests (requests older than 60 seconds)
|
||||||
|
clearStuckRequests(): void {
|
||||||
|
const now = Date.now();
|
||||||
|
const stuckThreshold = 60000; // 60 seconds
|
||||||
|
|
||||||
|
// Clear stuck active requests
|
||||||
|
this.activeRequests.forEach((request, id) => {
|
||||||
|
if (now - request.timestamp > stuckThreshold) {
|
||||||
|
console.warn(`Clearing stuck active request: ${request.type}`);
|
||||||
|
request.reject(new Error('Request timeout - cleared by recovery'));
|
||||||
|
this.activeRequests.delete(id);
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
// Clear old queued requests
|
||||||
|
this.queue = this.queue.filter(request => {
|
||||||
|
if (now - request.timestamp > stuckThreshold) {
|
||||||
|
console.warn(`Clearing stuck queued request: ${request.type}`);
|
||||||
|
request.reject(new Error('Request timeout - cleared by recovery'));
|
||||||
|
return false;
|
||||||
|
}
|
||||||
|
return true;
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
// Update settings
|
||||||
|
updateSettings(settings: {
|
||||||
|
maxConcurrent?: number;
|
||||||
|
maxRequestsPerMinute?: number;
|
||||||
|
maxRequestsPerSecond?: number;
|
||||||
|
}): void {
|
||||||
|
if (settings.maxConcurrent !== undefined) {
|
||||||
|
this.maxConcurrent = settings.maxConcurrent;
|
||||||
|
}
|
||||||
|
if (settings.maxRequestsPerMinute !== undefined) {
|
||||||
|
this.maxRequestsPerMinute = settings.maxRequestsPerMinute;
|
||||||
|
}
|
||||||
|
if (settings.maxRequestsPerSecond !== undefined) {
|
||||||
|
this.maxRequestsPerSecond = settings.maxRequestsPerSecond;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// Handle connection state changes
|
||||||
|
private handleConnectionStateChange(state: ConnectionState): void {
|
||||||
|
console.log(`Connection state changed: ${state.status}`);
|
||||||
|
|
||||||
|
if (state.status === 'offline' || state.status === 'error') {
|
||||||
|
// Pause processing when offline
|
||||||
|
this.isPaused = true;
|
||||||
|
|
||||||
|
// Notify queued requests about offline status
|
||||||
|
if (this.queue.length > 0) {
|
||||||
|
console.log(`${this.queue.length} requests queued while offline`);
|
||||||
|
}
|
||||||
|
} else if (state.status === 'online') {
|
||||||
|
// Resume processing when back online
|
||||||
|
this.isPaused = false;
|
||||||
|
console.log('Connection restored, resuming queue processing');
|
||||||
|
|
||||||
|
// Process any queued requests
|
||||||
|
if (this.queue.length > 0) {
|
||||||
|
console.log(`Processing ${this.queue.length} queued requests`);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// Check if error is connection-related
|
||||||
|
private isConnectionError(error: any): boolean {
|
||||||
|
const errorMessage = error.message?.toLowerCase() || '';
|
||||||
|
const connectionErrors = [
|
||||||
|
'network',
|
||||||
|
'fetch',
|
||||||
|
'connection',
|
||||||
|
'timeout',
|
||||||
|
'offline',
|
||||||
|
'cors'
|
||||||
|
];
|
||||||
|
|
||||||
|
return connectionErrors.some(e => errorMessage.includes(e));
|
||||||
|
}
|
||||||
|
|
||||||
|
// Pause queue processing
|
||||||
|
pause(): void {
|
||||||
|
this.isPaused = true;
|
||||||
|
console.log('Request queue paused');
|
||||||
|
}
|
||||||
|
|
||||||
|
// Resume queue processing
|
||||||
|
resume(): void {
|
||||||
|
this.isPaused = false;
|
||||||
|
console.log('Request queue resumed');
|
||||||
|
}
|
||||||
|
|
||||||
|
// Get number of queued requests by type
|
||||||
|
getQueuedByType(): { transcribe: number; translate: number; tts: number } {
|
||||||
|
const counts = { transcribe: 0, translate: 0, tts: 0 };
|
||||||
|
|
||||||
|
this.queue.forEach(request => {
|
||||||
|
counts[request.type]++;
|
||||||
|
});
|
||||||
|
|
||||||
|
return counts;
|
||||||
|
}
|
||||||
|
}
|
270
static/js/src/speakerManager.ts
Normal file
270
static/js/src/speakerManager.ts
Normal file
@ -0,0 +1,270 @@
|
|||||||
|
// Speaker management for multi-speaker support
|
||||||
|
export interface Speaker {
|
||||||
|
id: string;
|
||||||
|
name: string;
|
||||||
|
language: string;
|
||||||
|
color: string;
|
||||||
|
avatar?: string;
|
||||||
|
isActive: boolean;
|
||||||
|
lastActiveTime?: number;
|
||||||
|
}
|
||||||
|
|
||||||
|
export interface SpeakerTranscription {
|
||||||
|
speakerId: string;
|
||||||
|
text: string;
|
||||||
|
language: string;
|
||||||
|
timestamp: number;
|
||||||
|
}
|
||||||
|
|
||||||
|
export interface ConversationEntry {
|
||||||
|
id: string;
|
||||||
|
speakerId: string;
|
||||||
|
originalText: string;
|
||||||
|
originalLanguage: string;
|
||||||
|
translations: Map<string, string>; // languageCode -> translatedText
|
||||||
|
timestamp: number;
|
||||||
|
audioUrl?: string;
|
||||||
|
}
|
||||||
|
|
||||||
|
export class SpeakerManager {
|
||||||
|
private static instance: SpeakerManager;
|
||||||
|
private speakers: Map<string, Speaker> = new Map();
|
||||||
|
private conversation: ConversationEntry[] = [];
|
||||||
|
private activeSpeakerId: string | null = null;
|
||||||
|
private maxConversationLength = 100;
|
||||||
|
|
||||||
|
// Predefined colors for speakers
|
||||||
|
private speakerColors = [
|
||||||
|
'#007bff', '#28a745', '#dc3545', '#ffc107',
|
||||||
|
'#17a2b8', '#6f42c1', '#e83e8c', '#fd7e14'
|
||||||
|
];
|
||||||
|
|
||||||
|
private constructor() {
|
||||||
|
this.loadFromLocalStorage();
|
||||||
|
}
|
||||||
|
|
||||||
|
static getInstance(): SpeakerManager {
|
||||||
|
if (!SpeakerManager.instance) {
|
||||||
|
SpeakerManager.instance = new SpeakerManager();
|
||||||
|
}
|
||||||
|
return SpeakerManager.instance;
|
||||||
|
}
|
||||||
|
|
||||||
|
// Add a new speaker
|
||||||
|
addSpeaker(name: string, language: string): Speaker {
|
||||||
|
const id = this.generateSpeakerId();
|
||||||
|
const colorIndex = this.speakers.size % this.speakerColors.length;
|
||||||
|
|
||||||
|
const speaker: Speaker = {
|
||||||
|
id,
|
||||||
|
name,
|
||||||
|
language,
|
||||||
|
color: this.speakerColors[colorIndex],
|
||||||
|
isActive: false,
|
||||||
|
avatar: this.generateAvatar(name)
|
||||||
|
};
|
||||||
|
|
||||||
|
this.speakers.set(id, speaker);
|
||||||
|
this.saveToLocalStorage();
|
||||||
|
|
||||||
|
return speaker;
|
||||||
|
}
|
||||||
|
|
||||||
|
// Update speaker
|
||||||
|
updateSpeaker(id: string, updates: Partial<Speaker>): void {
|
||||||
|
const speaker = this.speakers.get(id);
|
||||||
|
if (speaker) {
|
||||||
|
Object.assign(speaker, updates);
|
||||||
|
this.saveToLocalStorage();
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// Remove speaker
|
||||||
|
removeSpeaker(id: string): void {
|
||||||
|
this.speakers.delete(id);
|
||||||
|
if (this.activeSpeakerId === id) {
|
||||||
|
this.activeSpeakerId = null;
|
||||||
|
}
|
||||||
|
this.saveToLocalStorage();
|
||||||
|
}
|
||||||
|
|
||||||
|
// Get all speakers
|
||||||
|
getAllSpeakers(): Speaker[] {
|
||||||
|
return Array.from(this.speakers.values());
|
||||||
|
}
|
||||||
|
|
||||||
|
// Get speaker by ID
|
||||||
|
getSpeaker(id: string): Speaker | undefined {
|
||||||
|
return this.speakers.get(id);
|
||||||
|
}
|
||||||
|
|
||||||
|
// Set active speaker
|
||||||
|
setActiveSpeaker(id: string | null): void {
|
||||||
|
// Deactivate all speakers
|
||||||
|
this.speakers.forEach(speaker => {
|
||||||
|
speaker.isActive = false;
|
||||||
|
});
|
||||||
|
|
||||||
|
// Activate selected speaker
|
||||||
|
if (id && this.speakers.has(id)) {
|
||||||
|
const speaker = this.speakers.get(id)!;
|
||||||
|
speaker.isActive = true;
|
||||||
|
speaker.lastActiveTime = Date.now();
|
||||||
|
this.activeSpeakerId = id;
|
||||||
|
} else {
|
||||||
|
this.activeSpeakerId = null;
|
||||||
|
}
|
||||||
|
|
||||||
|
this.saveToLocalStorage();
|
||||||
|
}
|
||||||
|
|
||||||
|
// Get active speaker
|
||||||
|
getActiveSpeaker(): Speaker | null {
|
||||||
|
return this.activeSpeakerId ? this.speakers.get(this.activeSpeakerId) || null : null;
|
||||||
|
}
|
||||||
|
|
||||||
|
// Add conversation entry
|
||||||
|
addConversationEntry(
|
||||||
|
speakerId: string,
|
||||||
|
originalText: string,
|
||||||
|
originalLanguage: string
|
||||||
|
): ConversationEntry {
|
||||||
|
const entry: ConversationEntry = {
|
||||||
|
id: this.generateEntryId(),
|
||||||
|
speakerId,
|
||||||
|
originalText,
|
||||||
|
originalLanguage,
|
||||||
|
translations: new Map(),
|
||||||
|
timestamp: Date.now()
|
||||||
|
};
|
||||||
|
|
||||||
|
this.conversation.push(entry);
|
||||||
|
|
||||||
|
// Limit conversation length
|
||||||
|
if (this.conversation.length > this.maxConversationLength) {
|
||||||
|
this.conversation.shift();
|
||||||
|
}
|
||||||
|
|
||||||
|
this.saveToLocalStorage();
|
||||||
|
return entry;
|
||||||
|
}
|
||||||
|
|
||||||
|
// Add translation to conversation entry
|
||||||
|
addTranslation(entryId: string, language: string, translatedText: string): void {
|
||||||
|
const entry = this.conversation.find(e => e.id === entryId);
|
||||||
|
if (entry) {
|
||||||
|
entry.translations.set(language, translatedText);
|
||||||
|
this.saveToLocalStorage();
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// Get conversation for a specific language
|
||||||
|
getConversationInLanguage(language: string): Array<{
|
||||||
|
speakerId: string;
|
||||||
|
speakerName: string;
|
||||||
|
speakerColor: string;
|
||||||
|
text: string;
|
||||||
|
timestamp: number;
|
||||||
|
isOriginal: boolean;
|
||||||
|
}> {
|
||||||
|
return this.conversation.map(entry => {
|
||||||
|
const speaker = this.speakers.get(entry.speakerId);
|
||||||
|
const isOriginal = entry.originalLanguage === language;
|
||||||
|
const text = isOriginal ?
|
||||||
|
entry.originalText :
|
||||||
|
entry.translations.get(language) || `[Translating from ${entry.originalLanguage}...]`;
|
||||||
|
|
||||||
|
return {
|
||||||
|
speakerId: entry.speakerId,
|
||||||
|
speakerName: speaker?.name || 'Unknown',
|
||||||
|
speakerColor: speaker?.color || '#666',
|
||||||
|
text,
|
||||||
|
timestamp: entry.timestamp,
|
||||||
|
isOriginal
|
||||||
|
};
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
// Get full conversation history
|
||||||
|
getFullConversation(): ConversationEntry[] {
|
||||||
|
return [...this.conversation];
|
||||||
|
}
|
||||||
|
|
||||||
|
// Clear conversation
|
||||||
|
clearConversation(): void {
|
||||||
|
this.conversation = [];
|
||||||
|
this.saveToLocalStorage();
|
||||||
|
}
|
||||||
|
|
||||||
|
// Generate unique speaker ID
|
||||||
|
private generateSpeakerId(): string {
|
||||||
|
return `speaker_${Date.now()}_${Math.random().toString(36).substr(2, 9)}`;
|
||||||
|
}
|
||||||
|
|
||||||
|
// Generate unique entry ID
|
||||||
|
private generateEntryId(): string {
|
||||||
|
return `entry_${Date.now()}_${Math.random().toString(36).substr(2, 9)}`;
|
||||||
|
}
|
||||||
|
|
||||||
|
// Generate avatar initials
|
||||||
|
private generateAvatar(name: string): string {
|
||||||
|
const parts = name.trim().split(' ');
|
||||||
|
if (parts.length >= 2) {
|
||||||
|
return parts[0][0].toUpperCase() + parts[1][0].toUpperCase();
|
||||||
|
}
|
||||||
|
return name.substr(0, 2).toUpperCase();
|
||||||
|
}
|
||||||
|
|
||||||
|
// Save to localStorage
|
||||||
|
private saveToLocalStorage(): void {
|
||||||
|
try {
|
||||||
|
const data = {
|
||||||
|
speakers: Array.from(this.speakers.entries()),
|
||||||
|
conversation: this.conversation.map(entry => ({
|
||||||
|
...entry,
|
||||||
|
translations: Array.from(entry.translations.entries())
|
||||||
|
})),
|
||||||
|
activeSpeakerId: this.activeSpeakerId
|
||||||
|
};
|
||||||
|
localStorage.setItem('speakerData', JSON.stringify(data));
|
||||||
|
} catch (error) {
|
||||||
|
console.error('Failed to save speaker data:', error);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// Load from localStorage
|
||||||
|
private loadFromLocalStorage(): void {
|
||||||
|
try {
|
||||||
|
const saved = localStorage.getItem('speakerData');
|
||||||
|
if (saved) {
|
||||||
|
const data = JSON.parse(saved);
|
||||||
|
|
||||||
|
// Restore speakers
|
||||||
|
if (data.speakers) {
|
||||||
|
this.speakers = new Map(data.speakers);
|
||||||
|
}
|
||||||
|
|
||||||
|
// Restore conversation with Map translations
|
||||||
|
if (data.conversation) {
|
||||||
|
this.conversation = data.conversation.map((entry: any) => ({
|
||||||
|
...entry,
|
||||||
|
translations: new Map(entry.translations || [])
|
||||||
|
}));
|
||||||
|
}
|
||||||
|
|
||||||
|
// Restore active speaker
|
||||||
|
this.activeSpeakerId = data.activeSpeakerId || null;
|
||||||
|
}
|
||||||
|
} catch (error) {
|
||||||
|
console.error('Failed to load speaker data:', error);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// Export conversation as text
|
||||||
|
exportConversation(language: string): string {
|
||||||
|
const entries = this.getConversationInLanguage(language);
|
||||||
|
return entries.map(entry =>
|
||||||
|
`[${new Date(entry.timestamp).toLocaleTimeString()}] ${entry.speakerName}: ${entry.text}`
|
||||||
|
).join('\n');
|
||||||
|
}
|
||||||
|
}
|
250
static/js/src/streamingTranslation.ts
Normal file
250
static/js/src/streamingTranslation.ts
Normal file
@ -0,0 +1,250 @@
|
|||||||
|
// Streaming translation implementation for reduced latency
|
||||||
|
import { Validator } from './validator';
|
||||||
|
import { PerformanceMonitor } from './performanceMonitor';
|
||||||
|
|
||||||
|
export interface StreamChunk {
|
||||||
|
type: 'start' | 'chunk' | 'complete' | 'error';
|
||||||
|
text?: string;
|
||||||
|
full_text?: string;
|
||||||
|
error?: string;
|
||||||
|
source_lang?: string;
|
||||||
|
target_lang?: string;
|
||||||
|
}
|
||||||
|
|
||||||
|
export class StreamingTranslation {
|
||||||
|
private eventSource: EventSource | null = null;
|
||||||
|
private abortController: AbortController | null = null;
|
||||||
|
private performanceMonitor = PerformanceMonitor.getInstance();
|
||||||
|
private firstChunkReceived = false;
|
||||||
|
|
||||||
|
constructor(
|
||||||
|
private onChunk: (text: string) => void,
|
||||||
|
private onComplete: (fullText: string) => void,
|
||||||
|
private onError: (error: string) => void,
|
||||||
|
private onStart?: () => void
|
||||||
|
) {}
|
||||||
|
|
||||||
|
async startStreaming(
|
||||||
|
text: string,
|
||||||
|
sourceLang: string,
|
||||||
|
targetLang: string,
|
||||||
|
useStreaming: boolean = true
|
||||||
|
): Promise<void> {
|
||||||
|
// Cancel any existing stream
|
||||||
|
this.cancel();
|
||||||
|
|
||||||
|
// Validate inputs
|
||||||
|
const sanitizedText = Validator.sanitizeText(text);
|
||||||
|
if (!sanitizedText) {
|
||||||
|
this.onError('No text to translate');
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
if (!useStreaming) {
|
||||||
|
// Fall back to regular translation
|
||||||
|
await this.fallbackToRegularTranslation(sanitizedText, sourceLang, targetLang);
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
try {
|
||||||
|
// Check if browser supports EventSource
|
||||||
|
if (!window.EventSource) {
|
||||||
|
console.warn('EventSource not supported, falling back to regular translation');
|
||||||
|
await this.fallbackToRegularTranslation(sanitizedText, sourceLang, targetLang);
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
// Notify start
|
||||||
|
if (this.onStart) {
|
||||||
|
this.onStart();
|
||||||
|
}
|
||||||
|
|
||||||
|
// Start performance timing
|
||||||
|
this.performanceMonitor.startTimer('streaming_translation');
|
||||||
|
this.firstChunkReceived = false;
|
||||||
|
|
||||||
|
// Create abort controller for cleanup
|
||||||
|
this.abortController = new AbortController();
|
||||||
|
|
||||||
|
// Start streaming request
|
||||||
|
const response = await fetch('/translate/stream', {
|
||||||
|
method: 'POST',
|
||||||
|
headers: {
|
||||||
|
'Content-Type': 'application/json',
|
||||||
|
},
|
||||||
|
body: JSON.stringify({
|
||||||
|
text: sanitizedText,
|
||||||
|
source_lang: sourceLang,
|
||||||
|
target_lang: targetLang
|
||||||
|
}),
|
||||||
|
signal: this.abortController.signal
|
||||||
|
});
|
||||||
|
|
||||||
|
if (!response.ok) {
|
||||||
|
throw new Error(`HTTP error! status: ${response.status}`);
|
||||||
|
}
|
||||||
|
|
||||||
|
// Check if response is event-stream
|
||||||
|
const contentType = response.headers.get('content-type');
|
||||||
|
if (!contentType || !contentType.includes('text/event-stream')) {
|
||||||
|
throw new Error('Server does not support streaming');
|
||||||
|
}
|
||||||
|
|
||||||
|
// Process the stream
|
||||||
|
await this.processStream(response);
|
||||||
|
|
||||||
|
} catch (error: any) {
|
||||||
|
if (error.name === 'AbortError') {
|
||||||
|
console.log('Stream cancelled');
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
console.error('Streaming error:', error);
|
||||||
|
|
||||||
|
// Fall back to regular translation on error
|
||||||
|
await this.fallbackToRegularTranslation(sanitizedText, sourceLang, targetLang);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
private async processStream(response: Response): Promise<void> {
|
||||||
|
const reader = response.body?.getReader();
|
||||||
|
if (!reader) {
|
||||||
|
throw new Error('No response body');
|
||||||
|
}
|
||||||
|
|
||||||
|
const decoder = new TextDecoder();
|
||||||
|
let buffer = '';
|
||||||
|
|
||||||
|
try {
|
||||||
|
while (true) {
|
||||||
|
const { done, value } = await reader.read();
|
||||||
|
|
||||||
|
if (done) {
|
||||||
|
break;
|
||||||
|
}
|
||||||
|
|
||||||
|
buffer += decoder.decode(value, { stream: true });
|
||||||
|
|
||||||
|
// Process complete SSE messages
|
||||||
|
const lines = buffer.split('\n');
|
||||||
|
buffer = lines.pop() || ''; // Keep incomplete line in buffer
|
||||||
|
|
||||||
|
for (const line of lines) {
|
||||||
|
if (line.startsWith('data: ')) {
|
||||||
|
try {
|
||||||
|
const data = JSON.parse(line.slice(6)) as StreamChunk;
|
||||||
|
this.handleStreamChunk(data);
|
||||||
|
} catch (e) {
|
||||||
|
console.error('Failed to parse SSE data:', e);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
} finally {
|
||||||
|
reader.releaseLock();
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
private handleStreamChunk(chunk: StreamChunk): void {
|
||||||
|
switch (chunk.type) {
|
||||||
|
case 'start':
|
||||||
|
console.log('Translation started:', chunk.source_lang, '->', chunk.target_lang);
|
||||||
|
break;
|
||||||
|
|
||||||
|
case 'chunk':
|
||||||
|
if (chunk.text) {
|
||||||
|
// Record time to first byte
|
||||||
|
if (!this.firstChunkReceived) {
|
||||||
|
this.firstChunkReceived = true;
|
||||||
|
this.performanceMonitor.measureTTFB('streaming_translation', performance.now());
|
||||||
|
}
|
||||||
|
this.onChunk(chunk.text);
|
||||||
|
}
|
||||||
|
break;
|
||||||
|
|
||||||
|
case 'complete':
|
||||||
|
if (chunk.full_text) {
|
||||||
|
// End performance timing
|
||||||
|
this.performanceMonitor.endTimer('streaming_translation');
|
||||||
|
this.onComplete(chunk.full_text);
|
||||||
|
|
||||||
|
// Log performance stats periodically
|
||||||
|
if (Math.random() < 0.1) { // 10% of the time
|
||||||
|
this.performanceMonitor.logPerformanceStats();
|
||||||
|
}
|
||||||
|
}
|
||||||
|
break;
|
||||||
|
|
||||||
|
case 'error':
|
||||||
|
this.onError(chunk.error || 'Unknown streaming error');
|
||||||
|
break;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
private async fallbackToRegularTranslation(
|
||||||
|
text: string,
|
||||||
|
sourceLang: string,
|
||||||
|
targetLang: string
|
||||||
|
): Promise<void> {
|
||||||
|
try {
|
||||||
|
const response = await fetch('/translate', {
|
||||||
|
method: 'POST',
|
||||||
|
headers: {
|
||||||
|
'Content-Type': 'application/json',
|
||||||
|
},
|
||||||
|
body: JSON.stringify({
|
||||||
|
text: text,
|
||||||
|
source_lang: sourceLang,
|
||||||
|
target_lang: targetLang
|
||||||
|
})
|
||||||
|
});
|
||||||
|
|
||||||
|
if (!response.ok) {
|
||||||
|
throw new Error(`HTTP error! status: ${response.status}`);
|
||||||
|
}
|
||||||
|
|
||||||
|
const data = await response.json();
|
||||||
|
|
||||||
|
if (data.success && data.translation) {
|
||||||
|
// Simulate streaming by showing text progressively
|
||||||
|
this.simulateStreaming(data.translation);
|
||||||
|
} else {
|
||||||
|
this.onError(data.error || 'Translation failed');
|
||||||
|
}
|
||||||
|
} catch (error: any) {
|
||||||
|
this.onError(error.message || 'Translation failed');
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
private simulateStreaming(text: string): void {
|
||||||
|
// Simulate streaming for better UX even with non-streaming response
|
||||||
|
const words = text.split(' ');
|
||||||
|
let index = 0;
|
||||||
|
let accumulated = '';
|
||||||
|
|
||||||
|
const interval = setInterval(() => {
|
||||||
|
if (index >= words.length) {
|
||||||
|
clearInterval(interval);
|
||||||
|
this.onComplete(accumulated.trim());
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
const chunk = words[index] + (index < words.length - 1 ? ' ' : '');
|
||||||
|
accumulated += chunk;
|
||||||
|
this.onChunk(chunk);
|
||||||
|
index++;
|
||||||
|
}, 50); // 50ms between words for smooth appearance
|
||||||
|
}
|
||||||
|
|
||||||
|
cancel(): void {
|
||||||
|
if (this.abortController) {
|
||||||
|
this.abortController.abort();
|
||||||
|
this.abortController = null;
|
||||||
|
}
|
||||||
|
|
||||||
|
if (this.eventSource) {
|
||||||
|
this.eventSource.close();
|
||||||
|
this.eventSource = null;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
243
static/js/src/translationCache.ts
Normal file
243
static/js/src/translationCache.ts
Normal file
@ -0,0 +1,243 @@
|
|||||||
|
// Translation cache management for offline support
|
||||||
|
import { TranslationCacheEntry, CacheStats } from './types';
|
||||||
|
import { Validator } from './validator';
|
||||||
|
|
||||||
|
export class TranslationCache {
|
||||||
|
private static DB_NAME = 'VoiceTranslatorDB';
|
||||||
|
private static DB_VERSION = 2; // Increment version for cache store
|
||||||
|
private static CACHE_STORE = 'translationCache';
|
||||||
|
// private static MAX_CACHE_SIZE = 50 * 1024 * 1024; // 50MB limit - Reserved for future use
|
||||||
|
private static MAX_ENTRIES = 1000; // Maximum number of cached translations
|
||||||
|
private static CACHE_EXPIRY_DAYS = 30; // Expire entries after 30 days
|
||||||
|
|
||||||
|
// Generate cache key from input parameters
|
||||||
|
static generateCacheKey(text: string, sourceLang: string, targetLang: string): string {
|
||||||
|
// Normalize and sanitize text to create a consistent key
|
||||||
|
const normalizedText = text.trim().toLowerCase();
|
||||||
|
const sanitized = Validator.sanitizeCacheKey(normalizedText);
|
||||||
|
return `${sourceLang}:${targetLang}:${sanitized}`;
|
||||||
|
}
|
||||||
|
|
||||||
|
// Open or create the cache database
|
||||||
|
static async openDB(): Promise<IDBDatabase> {
|
||||||
|
return new Promise((resolve, reject) => {
|
||||||
|
const request = indexedDB.open(this.DB_NAME, this.DB_VERSION);
|
||||||
|
|
||||||
|
request.onupgradeneeded = (event: IDBVersionChangeEvent) => {
|
||||||
|
const db = (event.target as IDBOpenDBRequest).result;
|
||||||
|
|
||||||
|
// Create cache store if it doesn't exist
|
||||||
|
if (!db.objectStoreNames.contains(this.CACHE_STORE)) {
|
||||||
|
const store = db.createObjectStore(this.CACHE_STORE, { keyPath: 'key' });
|
||||||
|
store.createIndex('timestamp', 'timestamp', { unique: false });
|
||||||
|
store.createIndex('lastAccessed', 'lastAccessed', { unique: false });
|
||||||
|
store.createIndex('sourceLanguage', 'sourceLanguage', { unique: false });
|
||||||
|
store.createIndex('targetLanguage', 'targetLanguage', { unique: false });
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
request.onsuccess = (event: Event) => {
|
||||||
|
resolve((event.target as IDBOpenDBRequest).result);
|
||||||
|
};
|
||||||
|
|
||||||
|
request.onerror = () => {
|
||||||
|
reject('Failed to open translation cache database');
|
||||||
|
};
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
// Get cached translation
|
||||||
|
static async getCachedTranslation(
|
||||||
|
text: string,
|
||||||
|
sourceLang: string,
|
||||||
|
targetLang: string
|
||||||
|
): Promise<string | null> {
|
||||||
|
try {
|
||||||
|
const db = await this.openDB();
|
||||||
|
const transaction = db.transaction([this.CACHE_STORE], 'readwrite');
|
||||||
|
const store = transaction.objectStore(this.CACHE_STORE);
|
||||||
|
|
||||||
|
const key = this.generateCacheKey(text, sourceLang, targetLang);
|
||||||
|
const request = store.get(key);
|
||||||
|
|
||||||
|
return new Promise((resolve) => {
|
||||||
|
request.onsuccess = (event: Event) => {
|
||||||
|
const entry = (event.target as IDBRequest).result as TranslationCacheEntry;
|
||||||
|
|
||||||
|
if (entry) {
|
||||||
|
// Check if entry is not expired
|
||||||
|
const expiryTime = entry.timestamp + (this.CACHE_EXPIRY_DAYS * 24 * 60 * 60 * 1000);
|
||||||
|
if (Date.now() < expiryTime) {
|
||||||
|
// Update access count and last accessed time
|
||||||
|
entry.accessCount++;
|
||||||
|
entry.lastAccessed = Date.now();
|
||||||
|
store.put(entry);
|
||||||
|
|
||||||
|
console.log(`Cache hit for translation: ${sourceLang} -> ${targetLang}`);
|
||||||
|
resolve(entry.targetText);
|
||||||
|
} else {
|
||||||
|
// Entry expired, delete it
|
||||||
|
store.delete(key);
|
||||||
|
resolve(null);
|
||||||
|
}
|
||||||
|
} else {
|
||||||
|
resolve(null);
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
request.onerror = () => {
|
||||||
|
console.error('Failed to get cached translation');
|
||||||
|
resolve(null);
|
||||||
|
};
|
||||||
|
});
|
||||||
|
} catch (error) {
|
||||||
|
console.error('Cache lookup error:', error);
|
||||||
|
return null;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// Save translation to cache
|
||||||
|
static async cacheTranslation(
|
||||||
|
sourceText: string,
|
||||||
|
sourceLang: string,
|
||||||
|
targetText: string,
|
||||||
|
targetLang: string
|
||||||
|
): Promise<void> {
|
||||||
|
try {
|
||||||
|
const db = await this.openDB();
|
||||||
|
const transaction = db.transaction([this.CACHE_STORE], 'readwrite');
|
||||||
|
const store = transaction.objectStore(this.CACHE_STORE);
|
||||||
|
|
||||||
|
const key = this.generateCacheKey(sourceText, sourceLang, targetLang);
|
||||||
|
const entry: TranslationCacheEntry = {
|
||||||
|
key,
|
||||||
|
sourceText,
|
||||||
|
sourceLanguage: sourceLang,
|
||||||
|
targetText,
|
||||||
|
targetLanguage: targetLang,
|
||||||
|
timestamp: Date.now(),
|
||||||
|
accessCount: 1,
|
||||||
|
lastAccessed: Date.now()
|
||||||
|
};
|
||||||
|
|
||||||
|
// Check cache size before adding
|
||||||
|
await this.ensureCacheSize(db);
|
||||||
|
|
||||||
|
store.put(entry);
|
||||||
|
console.log(`Cached translation: ${sourceLang} -> ${targetLang}`);
|
||||||
|
} catch (error) {
|
||||||
|
console.error('Failed to cache translation:', error);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// Ensure cache doesn't exceed size limits
|
||||||
|
static async ensureCacheSize(db: IDBDatabase): Promise<void> {
|
||||||
|
const transaction = db.transaction([this.CACHE_STORE], 'readwrite');
|
||||||
|
const store = transaction.objectStore(this.CACHE_STORE);
|
||||||
|
|
||||||
|
// Count entries
|
||||||
|
const countRequest = store.count();
|
||||||
|
|
||||||
|
countRequest.onsuccess = async () => {
|
||||||
|
const count = countRequest.result;
|
||||||
|
|
||||||
|
if (count >= this.MAX_ENTRIES) {
|
||||||
|
// Delete least recently accessed entries
|
||||||
|
const index = store.index('lastAccessed');
|
||||||
|
const cursor = index.openCursor();
|
||||||
|
let deleted = 0;
|
||||||
|
const toDelete = Math.floor(count * 0.2); // Delete 20% of entries
|
||||||
|
|
||||||
|
cursor.onsuccess = (event: Event) => {
|
||||||
|
const cursor = (event.target as IDBRequest).result;
|
||||||
|
if (cursor && deleted < toDelete) {
|
||||||
|
cursor.delete();
|
||||||
|
deleted++;
|
||||||
|
cursor.continue();
|
||||||
|
}
|
||||||
|
};
|
||||||
|
}
|
||||||
|
};
|
||||||
|
}
|
||||||
|
|
||||||
|
// Get cache statistics
|
||||||
|
static async getCacheStats(): Promise<CacheStats> {
|
||||||
|
try {
|
||||||
|
const db = await this.openDB();
|
||||||
|
const transaction = db.transaction([this.CACHE_STORE], 'readonly');
|
||||||
|
const store = transaction.objectStore(this.CACHE_STORE);
|
||||||
|
|
||||||
|
return new Promise((resolve) => {
|
||||||
|
const stats: CacheStats = {
|
||||||
|
totalEntries: 0,
|
||||||
|
totalSize: 0,
|
||||||
|
oldestEntry: Date.now(),
|
||||||
|
newestEntry: 0
|
||||||
|
};
|
||||||
|
|
||||||
|
const countRequest = store.count();
|
||||||
|
countRequest.onsuccess = () => {
|
||||||
|
stats.totalEntries = countRequest.result;
|
||||||
|
};
|
||||||
|
|
||||||
|
const cursor = store.openCursor();
|
||||||
|
cursor.onsuccess = (event: Event) => {
|
||||||
|
const cursor = (event.target as IDBRequest).result;
|
||||||
|
if (cursor) {
|
||||||
|
const entry = cursor.value as TranslationCacheEntry;
|
||||||
|
// Estimate size (rough calculation)
|
||||||
|
stats.totalSize += (entry.sourceText.length + entry.targetText.length) * 2;
|
||||||
|
stats.oldestEntry = Math.min(stats.oldestEntry, entry.timestamp);
|
||||||
|
stats.newestEntry = Math.max(stats.newestEntry, entry.timestamp);
|
||||||
|
cursor.continue();
|
||||||
|
} else {
|
||||||
|
resolve(stats);
|
||||||
|
}
|
||||||
|
};
|
||||||
|
});
|
||||||
|
} catch (error) {
|
||||||
|
console.error('Failed to get cache stats:', error);
|
||||||
|
return {
|
||||||
|
totalEntries: 0,
|
||||||
|
totalSize: 0,
|
||||||
|
oldestEntry: 0,
|
||||||
|
newestEntry: 0
|
||||||
|
};
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// Clear all cache
|
||||||
|
static async clearCache(): Promise<void> {
|
||||||
|
try {
|
||||||
|
const db = await this.openDB();
|
||||||
|
const transaction = db.transaction([this.CACHE_STORE], 'readwrite');
|
||||||
|
const store = transaction.objectStore(this.CACHE_STORE);
|
||||||
|
store.clear();
|
||||||
|
console.log('Translation cache cleared');
|
||||||
|
} catch (error) {
|
||||||
|
console.error('Failed to clear cache:', error);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// Export cache for backup
|
||||||
|
static async exportCache(): Promise<TranslationCacheEntry[]> {
|
||||||
|
try {
|
||||||
|
const db = await this.openDB();
|
||||||
|
const transaction = db.transaction([this.CACHE_STORE], 'readonly');
|
||||||
|
const store = transaction.objectStore(this.CACHE_STORE);
|
||||||
|
const request = store.getAll();
|
||||||
|
|
||||||
|
return new Promise((resolve) => {
|
||||||
|
request.onsuccess = () => {
|
||||||
|
resolve(request.result);
|
||||||
|
};
|
||||||
|
request.onerror = () => {
|
||||||
|
resolve([]);
|
||||||
|
};
|
||||||
|
});
|
||||||
|
} catch (error) {
|
||||||
|
console.error('Failed to export cache:', error);
|
||||||
|
return [];
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
109
static/js/src/types.ts
Normal file
109
static/js/src/types.ts
Normal file
@ -0,0 +1,109 @@
|
|||||||
|
// Type definitions for Talk2Me application
|
||||||
|
|
||||||
|
export interface TranscriptionResponse {
|
||||||
|
success: boolean;
|
||||||
|
text?: string;
|
||||||
|
error?: string;
|
||||||
|
detected_language?: string;
|
||||||
|
}
|
||||||
|
|
||||||
|
export interface TranslationResponse {
|
||||||
|
success: boolean;
|
||||||
|
translation?: string;
|
||||||
|
error?: string;
|
||||||
|
}
|
||||||
|
|
||||||
|
export interface TTSResponse {
|
||||||
|
success: boolean;
|
||||||
|
audio_url?: string;
|
||||||
|
error?: string;
|
||||||
|
}
|
||||||
|
|
||||||
|
export interface TTSServerStatus {
|
||||||
|
status: 'online' | 'error' | 'auth_error';
|
||||||
|
message: string;
|
||||||
|
url: string;
|
||||||
|
code?: number;
|
||||||
|
}
|
||||||
|
|
||||||
|
export interface TTSConfigUpdate {
|
||||||
|
server_url?: string;
|
||||||
|
api_key?: string;
|
||||||
|
}
|
||||||
|
|
||||||
|
export interface TTSConfigResponse {
|
||||||
|
success: boolean;
|
||||||
|
message?: string;
|
||||||
|
url?: string;
|
||||||
|
error?: string;
|
||||||
|
}
|
||||||
|
|
||||||
|
export interface TranslationRequest {
|
||||||
|
text: string;
|
||||||
|
source_lang: string;
|
||||||
|
target_lang: string;
|
||||||
|
}
|
||||||
|
|
||||||
|
export interface TTSRequest {
|
||||||
|
text: string;
|
||||||
|
language: string;
|
||||||
|
}
|
||||||
|
|
||||||
|
export interface PushPublicKeyResponse {
|
||||||
|
publicKey: string;
|
||||||
|
}
|
||||||
|
|
||||||
|
export interface IndexedDBRecord {
|
||||||
|
timestamp: string;
|
||||||
|
}
|
||||||
|
|
||||||
|
export interface TranscriptionRecord extends IndexedDBRecord {
|
||||||
|
text: string;
|
||||||
|
language: string;
|
||||||
|
}
|
||||||
|
|
||||||
|
export interface TranslationRecord extends IndexedDBRecord {
|
||||||
|
sourceText: string;
|
||||||
|
sourceLanguage: string;
|
||||||
|
targetText: string;
|
||||||
|
targetLanguage: string;
|
||||||
|
}
|
||||||
|
|
||||||
|
export interface TranslationCacheEntry {
|
||||||
|
key: string;
|
||||||
|
sourceText: string;
|
||||||
|
sourceLanguage: string;
|
||||||
|
targetText: string;
|
||||||
|
targetLanguage: string;
|
||||||
|
timestamp: number;
|
||||||
|
accessCount: number;
|
||||||
|
lastAccessed: number;
|
||||||
|
}
|
||||||
|
|
||||||
|
export interface CacheStats {
|
||||||
|
totalEntries: number;
|
||||||
|
totalSize: number;
|
||||||
|
oldestEntry: number;
|
||||||
|
newestEntry: number;
|
||||||
|
}
|
||||||
|
|
||||||
|
// Service Worker types
|
||||||
|
export interface PeriodicSyncManager {
|
||||||
|
register(tag: string, options?: { minInterval: number }): Promise<void>;
|
||||||
|
}
|
||||||
|
|
||||||
|
export interface ServiceWorkerRegistrationExtended extends ServiceWorkerRegistration {
|
||||||
|
periodicSync?: PeriodicSyncManager;
|
||||||
|
}
|
||||||
|
|
||||||
|
// Extend window interface for PWA features
|
||||||
|
declare global {
|
||||||
|
interface Window {
|
||||||
|
deferredPrompt?: BeforeInstallPromptEvent;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
export interface BeforeInstallPromptEvent extends Event {
|
||||||
|
prompt(): Promise<void>;
|
||||||
|
userChoice: Promise<{ outcome: 'accepted' | 'dismissed' }>;
|
||||||
|
}
|
259
static/js/src/validator.ts
Normal file
259
static/js/src/validator.ts
Normal file
@ -0,0 +1,259 @@
|
|||||||
|
// Input validation and sanitization utilities
|
||||||
|
export class Validator {
|
||||||
|
// Sanitize HTML to prevent XSS attacks
|
||||||
|
static sanitizeHTML(input: string): string {
|
||||||
|
// Create a temporary div element
|
||||||
|
const temp = document.createElement('div');
|
||||||
|
temp.textContent = input;
|
||||||
|
return temp.innerHTML;
|
||||||
|
}
|
||||||
|
|
||||||
|
// Validate and sanitize text input
|
||||||
|
static sanitizeText(input: string, maxLength: number = 10000): string {
|
||||||
|
if (typeof input !== 'string') {
|
||||||
|
return '';
|
||||||
|
}
|
||||||
|
|
||||||
|
// Trim and limit length
|
||||||
|
let sanitized = input.trim().substring(0, maxLength);
|
||||||
|
|
||||||
|
// Remove null bytes
|
||||||
|
sanitized = sanitized.replace(/\0/g, '');
|
||||||
|
|
||||||
|
// Remove control characters except newlines and tabs
|
||||||
|
sanitized = sanitized.replace(/[\x00-\x08\x0B\x0C\x0E-\x1F\x7F]/g, '');
|
||||||
|
|
||||||
|
return sanitized;
|
||||||
|
}
|
||||||
|
|
||||||
|
// Validate language code
|
||||||
|
static validateLanguageCode(code: string, allowedLanguages: string[]): string | null {
|
||||||
|
if (!code || typeof code !== 'string') {
|
||||||
|
return null;
|
||||||
|
}
|
||||||
|
|
||||||
|
const sanitized = code.trim().toLowerCase();
|
||||||
|
|
||||||
|
// Check if it's in the allowed list
|
||||||
|
if (allowedLanguages.includes(sanitized) || sanitized === 'auto') {
|
||||||
|
return sanitized;
|
||||||
|
}
|
||||||
|
|
||||||
|
return null;
|
||||||
|
}
|
||||||
|
|
||||||
|
// Validate file upload
|
||||||
|
static validateAudioFile(file: File): { valid: boolean; error?: string } {
|
||||||
|
// Check if file exists
|
||||||
|
if (!file) {
|
||||||
|
return { valid: false, error: 'No file provided' };
|
||||||
|
}
|
||||||
|
|
||||||
|
// Check file size (max 25MB)
|
||||||
|
const maxSize = 25 * 1024 * 1024;
|
||||||
|
if (file.size > maxSize) {
|
||||||
|
return { valid: false, error: 'File size exceeds 25MB limit' };
|
||||||
|
}
|
||||||
|
|
||||||
|
// Check file type
|
||||||
|
const allowedTypes = [
|
||||||
|
'audio/webm',
|
||||||
|
'audio/ogg',
|
||||||
|
'audio/wav',
|
||||||
|
'audio/mp3',
|
||||||
|
'audio/mpeg',
|
||||||
|
'audio/mp4',
|
||||||
|
'audio/x-m4a',
|
||||||
|
'audio/x-wav'
|
||||||
|
];
|
||||||
|
|
||||||
|
if (!allowedTypes.includes(file.type)) {
|
||||||
|
// Check by extension as fallback
|
||||||
|
const ext = file.name.toLowerCase().split('.').pop();
|
||||||
|
const allowedExtensions = ['webm', 'ogg', 'wav', 'mp3', 'mp4', 'm4a'];
|
||||||
|
|
||||||
|
if (!ext || !allowedExtensions.includes(ext)) {
|
||||||
|
return { valid: false, error: 'Invalid audio file type' };
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
return { valid: true };
|
||||||
|
}
|
||||||
|
|
||||||
|
// Validate URL
|
||||||
|
static validateURL(url: string): string | null {
|
||||||
|
if (!url || typeof url !== 'string') {
|
||||||
|
return null;
|
||||||
|
}
|
||||||
|
|
||||||
|
try {
|
||||||
|
const parsed = new URL(url);
|
||||||
|
|
||||||
|
// Only allow http and https
|
||||||
|
if (!['http:', 'https:'].includes(parsed.protocol)) {
|
||||||
|
return null;
|
||||||
|
}
|
||||||
|
|
||||||
|
// Prevent localhost in production
|
||||||
|
if (window.location.hostname !== 'localhost' &&
|
||||||
|
(parsed.hostname === 'localhost' || parsed.hostname === '127.0.0.1')) {
|
||||||
|
return null;
|
||||||
|
}
|
||||||
|
|
||||||
|
return parsed.toString();
|
||||||
|
} catch (e) {
|
||||||
|
return null;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// Validate API key (basic format check)
|
||||||
|
static validateAPIKey(key: string): string | null {
|
||||||
|
if (!key || typeof key !== 'string') {
|
||||||
|
return null;
|
||||||
|
}
|
||||||
|
|
||||||
|
// Trim whitespace
|
||||||
|
const trimmed = key.trim();
|
||||||
|
|
||||||
|
// Check length (most API keys are 20-128 characters)
|
||||||
|
if (trimmed.length < 20 || trimmed.length > 128) {
|
||||||
|
return null;
|
||||||
|
}
|
||||||
|
|
||||||
|
// Only allow alphanumeric, dash, and underscore
|
||||||
|
if (!/^[a-zA-Z0-9\-_]+$/.test(trimmed)) {
|
||||||
|
return null;
|
||||||
|
}
|
||||||
|
|
||||||
|
return trimmed;
|
||||||
|
}
|
||||||
|
|
||||||
|
// Validate request body size
|
||||||
|
static validateRequestSize(data: any, maxSizeKB: number = 1024): boolean {
|
||||||
|
try {
|
||||||
|
const jsonString = JSON.stringify(data);
|
||||||
|
const sizeInBytes = new Blob([jsonString]).size;
|
||||||
|
return sizeInBytes <= maxSizeKB * 1024;
|
||||||
|
} catch (e) {
|
||||||
|
return false;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// Sanitize filename
|
||||||
|
static sanitizeFilename(filename: string): string {
|
||||||
|
if (!filename || typeof filename !== 'string') {
|
||||||
|
return 'file';
|
||||||
|
}
|
||||||
|
|
||||||
|
// Remove path components
|
||||||
|
let name = filename.split(/[/\\]/).pop() || 'file';
|
||||||
|
|
||||||
|
// Remove dangerous characters
|
||||||
|
name = name.replace(/[^a-zA-Z0-9.\-_]/g, '_');
|
||||||
|
|
||||||
|
// Limit length
|
||||||
|
if (name.length > 255) {
|
||||||
|
const ext = name.split('.').pop();
|
||||||
|
const base = name.substring(0, 250 - (ext ? ext.length + 1 : 0));
|
||||||
|
name = ext ? `${base}.${ext}` : base;
|
||||||
|
}
|
||||||
|
|
||||||
|
return name;
|
||||||
|
}
|
||||||
|
|
||||||
|
// Validate settings object
|
||||||
|
static validateSettings(settings: any): { valid: boolean; sanitized?: any; errors?: string[] } {
|
||||||
|
const errors: string[] = [];
|
||||||
|
const sanitized: any = {};
|
||||||
|
|
||||||
|
// Validate notification settings
|
||||||
|
if (settings.notificationsEnabled !== undefined) {
|
||||||
|
sanitized.notificationsEnabled = Boolean(settings.notificationsEnabled);
|
||||||
|
}
|
||||||
|
|
||||||
|
if (settings.notifyTranscription !== undefined) {
|
||||||
|
sanitized.notifyTranscription = Boolean(settings.notifyTranscription);
|
||||||
|
}
|
||||||
|
|
||||||
|
if (settings.notifyTranslation !== undefined) {
|
||||||
|
sanitized.notifyTranslation = Boolean(settings.notifyTranslation);
|
||||||
|
}
|
||||||
|
|
||||||
|
if (settings.notifyErrors !== undefined) {
|
||||||
|
sanitized.notifyErrors = Boolean(settings.notifyErrors);
|
||||||
|
}
|
||||||
|
|
||||||
|
// Validate offline mode
|
||||||
|
if (settings.offlineMode !== undefined) {
|
||||||
|
sanitized.offlineMode = Boolean(settings.offlineMode);
|
||||||
|
}
|
||||||
|
|
||||||
|
// Validate TTS settings
|
||||||
|
if (settings.ttsServerUrl !== undefined) {
|
||||||
|
const url = this.validateURL(settings.ttsServerUrl);
|
||||||
|
if (settings.ttsServerUrl && !url) {
|
||||||
|
errors.push('Invalid TTS server URL');
|
||||||
|
} else {
|
||||||
|
sanitized.ttsServerUrl = url;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
if (settings.ttsApiKey !== undefined) {
|
||||||
|
const key = this.validateAPIKey(settings.ttsApiKey);
|
||||||
|
if (settings.ttsApiKey && !key) {
|
||||||
|
errors.push('Invalid API key format');
|
||||||
|
} else {
|
||||||
|
sanitized.ttsApiKey = key;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
return {
|
||||||
|
valid: errors.length === 0,
|
||||||
|
sanitized: errors.length === 0 ? sanitized : undefined,
|
||||||
|
errors: errors.length > 0 ? errors : undefined
|
||||||
|
};
|
||||||
|
}
|
||||||
|
|
||||||
|
// Rate limiting check
|
||||||
|
private static requestCounts: Map<string, number[]> = new Map();
|
||||||
|
|
||||||
|
static checkRateLimit(
|
||||||
|
action: string,
|
||||||
|
maxRequests: number = 10,
|
||||||
|
windowMs: number = 60000
|
||||||
|
): boolean {
|
||||||
|
const now = Date.now();
|
||||||
|
const key = action;
|
||||||
|
|
||||||
|
if (!this.requestCounts.has(key)) {
|
||||||
|
this.requestCounts.set(key, []);
|
||||||
|
}
|
||||||
|
|
||||||
|
const timestamps = this.requestCounts.get(key)!;
|
||||||
|
|
||||||
|
// Remove old timestamps
|
||||||
|
const cutoff = now - windowMs;
|
||||||
|
const recent = timestamps.filter(t => t > cutoff);
|
||||||
|
|
||||||
|
// Check if limit exceeded
|
||||||
|
if (recent.length >= maxRequests) {
|
||||||
|
return false;
|
||||||
|
}
|
||||||
|
|
||||||
|
// Add current timestamp
|
||||||
|
recent.push(now);
|
||||||
|
this.requestCounts.set(key, recent);
|
||||||
|
|
||||||
|
return true;
|
||||||
|
}
|
||||||
|
|
||||||
|
// Validate translation cache key
|
||||||
|
static sanitizeCacheKey(key: string): string {
|
||||||
|
if (!key || typeof key !== 'string') {
|
||||||
|
return '';
|
||||||
|
}
|
||||||
|
|
||||||
|
// Remove special characters that might cause issues
|
||||||
|
return key.replace(/[^\w\s-]/gi, '').substring(0, 500);
|
||||||
|
}
|
||||||
|
}
|
@ -1,5 +1,5 @@
|
|||||||
{
|
{
|
||||||
"name": "Voice Language Translator",
|
"name": "Talk2Me",
|
||||||
"short_name": "Translator",
|
"short_name": "Translator",
|
||||||
"description": "Translate spoken language between multiple languages with speech input and output",
|
"description": "Translate spoken language between multiple languages with speech input and output",
|
||||||
"start_url": "/",
|
"start_url": "/",
|
||||||
|
@ -1,13 +1,15 @@
|
|||||||
// Service Worker for Voice Language Translator PWA
|
// Service Worker for Talk2Me PWA
|
||||||
|
|
||||||
const CACHE_NAME = 'voice-translator-v1';
|
const CACHE_NAME = 'voice-translator-v1';
|
||||||
const ASSETS_TO_CACHE = [
|
const ASSETS_TO_CACHE = [
|
||||||
'/',
|
'/',
|
||||||
'/static/css/styles.css',
|
'/static/css/styles.css',
|
||||||
'/static/js/app.js',
|
'/static/js/dist/app.js',
|
||||||
'/static/icons/icon-192x192.png',
|
'/static/icons/icon-192x192.png',
|
||||||
'/static/icons/icon-512x512.png',
|
'/static/icons/icon-512x512.png',
|
||||||
'/static/icons/favicon.ico'
|
'/static/icons/favicon.ico',
|
||||||
|
'https://cdn.jsdelivr.net/npm/bootstrap@5.3.0-alpha1/dist/css/bootstrap.min.css',
|
||||||
|
'https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0/css/all.min.css'
|
||||||
];
|
];
|
||||||
|
|
||||||
// Install event - cache essential assets
|
// Install event - cache essential assets
|
||||||
@ -90,15 +92,34 @@ self.addEventListener('fetch', (event) => {
|
|||||||
|
|
||||||
// Handle push notifications
|
// Handle push notifications
|
||||||
self.addEventListener('push', (event) => {
|
self.addEventListener('push', (event) => {
|
||||||
|
if (!event.data) {
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
const data = event.data.json();
|
const data = event.data.json();
|
||||||
const options = {
|
const options = {
|
||||||
body: data.body || 'New translation available',
|
body: data.body || 'New translation available',
|
||||||
icon: '/static/icons/icon-192x192.png',
|
icon: data.icon || '/static/icons/icon-192x192.png',
|
||||||
badge: '/static/icons/badge-72x72.png',
|
badge: data.badge || '/static/icons/icon-192x192.png',
|
||||||
vibrate: [100, 50, 100],
|
vibrate: [100, 50, 100],
|
||||||
|
tag: data.tag || 'talk2me-notification',
|
||||||
|
requireInteraction: false,
|
||||||
|
silent: false,
|
||||||
data: {
|
data: {
|
||||||
url: data.url || '/'
|
url: data.url || '/',
|
||||||
|
...data.data
|
||||||
|
},
|
||||||
|
actions: [
|
||||||
|
{
|
||||||
|
action: 'view',
|
||||||
|
title: 'View',
|
||||||
|
icon: '/static/icons/icon-192x192.png'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
action: 'close',
|
||||||
|
title: 'Close'
|
||||||
}
|
}
|
||||||
|
]
|
||||||
};
|
};
|
||||||
|
|
||||||
event.waitUntil(
|
event.waitUntil(
|
||||||
@ -109,7 +130,55 @@ self.addEventListener('push', (event) => {
|
|||||||
// Handle notification click
|
// Handle notification click
|
||||||
self.addEventListener('notificationclick', (event) => {
|
self.addEventListener('notificationclick', (event) => {
|
||||||
event.notification.close();
|
event.notification.close();
|
||||||
|
|
||||||
|
if (event.action === 'close') {
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
const urlToOpen = event.notification.data.url || '/';
|
||||||
|
|
||||||
event.waitUntil(
|
event.waitUntil(
|
||||||
clients.openWindow(event.notification.data.url)
|
clients.matchAll({
|
||||||
|
type: 'window',
|
||||||
|
includeUncontrolled: true
|
||||||
|
}).then((windowClients) => {
|
||||||
|
// Check if there's already a window/tab with the app open
|
||||||
|
for (let client of windowClients) {
|
||||||
|
if (client.url === urlToOpen && 'focus' in client) {
|
||||||
|
return client.focus();
|
||||||
|
}
|
||||||
|
}
|
||||||
|
// If not, open a new window/tab
|
||||||
|
if (clients.openWindow) {
|
||||||
|
return clients.openWindow(urlToOpen);
|
||||||
|
}
|
||||||
|
})
|
||||||
);
|
);
|
||||||
});
|
});
|
||||||
|
|
||||||
|
// Handle periodic background sync
|
||||||
|
self.addEventListener('periodicsync', (event) => {
|
||||||
|
if (event.tag === 'translation-updates') {
|
||||||
|
event.waitUntil(checkForUpdates());
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
async function checkForUpdates() {
|
||||||
|
// Check for app updates or send usage statistics
|
||||||
|
try {
|
||||||
|
const response = await fetch('/api/check-updates');
|
||||||
|
if (response.ok) {
|
||||||
|
const data = await response.json();
|
||||||
|
if (data.hasUpdate) {
|
||||||
|
self.registration.showNotification('Update Available', {
|
||||||
|
body: 'A new version of Voice Translator is available!',
|
||||||
|
icon: '/static/icons/icon-192x192.png',
|
||||||
|
badge: '/static/icons/icon-192x192.png',
|
||||||
|
tag: 'update-notification'
|
||||||
|
});
|
||||||
|
}
|
||||||
|
}
|
||||||
|
} catch (error) {
|
||||||
|
console.error('Failed to check for updates:', error);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
66
talk2me.service
Normal file
66
talk2me.service
Normal file
@ -0,0 +1,66 @@
|
|||||||
|
[Unit]
|
||||||
|
Description=Talk2Me Real-time Translation Service
|
||||||
|
Documentation=https://github.com/your-repo/talk2me
|
||||||
|
After=network.target
|
||||||
|
|
||||||
|
[Service]
|
||||||
|
Type=notify
|
||||||
|
User=talk2me
|
||||||
|
Group=talk2me
|
||||||
|
WorkingDirectory=/opt/talk2me
|
||||||
|
Environment="PATH=/opt/talk2me/venv/bin"
|
||||||
|
Environment="FLASK_ENV=production"
|
||||||
|
Environment="PYTHONUNBUFFERED=1"
|
||||||
|
|
||||||
|
# Production environment variables
|
||||||
|
EnvironmentFile=-/opt/talk2me/.env
|
||||||
|
|
||||||
|
# Gunicorn command with production settings
|
||||||
|
ExecStart=/opt/talk2me/venv/bin/gunicorn \
|
||||||
|
--config /opt/talk2me/gunicorn_config.py \
|
||||||
|
--error-logfile /var/log/talk2me/gunicorn-error.log \
|
||||||
|
--access-logfile /var/log/talk2me/gunicorn-access.log \
|
||||||
|
--log-level info \
|
||||||
|
wsgi:application
|
||||||
|
|
||||||
|
# Reload via SIGHUP
|
||||||
|
ExecReload=/bin/kill -s HUP $MAINPID
|
||||||
|
|
||||||
|
# Graceful stop
|
||||||
|
KillMode=mixed
|
||||||
|
TimeoutStopSec=30
|
||||||
|
|
||||||
|
# Restart policy
|
||||||
|
Restart=always
|
||||||
|
RestartSec=10
|
||||||
|
StartLimitBurst=3
|
||||||
|
StartLimitInterval=60
|
||||||
|
|
||||||
|
# Security settings
|
||||||
|
NoNewPrivileges=true
|
||||||
|
PrivateTmp=true
|
||||||
|
ProtectSystem=strict
|
||||||
|
ProtectHome=true
|
||||||
|
ProtectKernelTunables=true
|
||||||
|
ProtectKernelModules=true
|
||||||
|
ProtectControlGroups=true
|
||||||
|
RestrictRealtime=true
|
||||||
|
RestrictSUIDSGID=true
|
||||||
|
LockPersonality=true
|
||||||
|
|
||||||
|
# Allow writing to specific directories
|
||||||
|
ReadWritePaths=/var/log/talk2me /tmp/talk2me_uploads
|
||||||
|
|
||||||
|
# Resource limits
|
||||||
|
LimitNOFILE=65536
|
||||||
|
LimitNPROC=4096
|
||||||
|
|
||||||
|
# Memory limits (adjust based on your system)
|
||||||
|
MemoryLimit=4G
|
||||||
|
MemoryHigh=3G
|
||||||
|
|
||||||
|
# CPU limits (optional)
|
||||||
|
# CPUQuota=200%
|
||||||
|
|
||||||
|
[Install]
|
||||||
|
WantedBy=multi-user.target
|
@ -3,7 +3,7 @@
|
|||||||
<head>
|
<head>
|
||||||
<meta charset="UTF-8">
|
<meta charset="UTF-8">
|
||||||
<meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no">
|
<meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no">
|
||||||
<title>Voice Language Translator</title>
|
<title>Talk2Me</title>
|
||||||
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0-alpha1/dist/css/bootstrap.min.css" rel="stylesheet">
|
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0-alpha1/dist/css/bootstrap.min.css" rel="stylesheet">
|
||||||
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0/css/all.min.css">
|
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0/css/all.min.css">
|
||||||
<link rel="icon" href="/favicon.ico" sizes="any">
|
<link rel="icon" href="/favicon.ico" sizes="any">
|
||||||
@ -74,6 +74,7 @@
|
|||||||
background-color: #f8f9fa;
|
background-color: #f8f9fa;
|
||||||
border-radius: 10px;
|
border-radius: 10px;
|
||||||
margin-bottom: 15px;
|
margin-bottom: 15px;
|
||||||
|
position: relative;
|
||||||
}
|
}
|
||||||
.btn-action {
|
.btn-action {
|
||||||
border-radius: 10px;
|
border-radius: 10px;
|
||||||
@ -121,9 +122,28 @@
|
|||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
<div class="container">
|
<div class="container">
|
||||||
<h1 class="text-center mb-4">Voice Language Translator</h1>
|
<h1 class="text-center mb-4">Talk2Me</h1>
|
||||||
<!--<p class="text-center text-muted">Powered by Gemma 3, Whisper & Edge TTS</p>-->
|
<!--<p class="text-center text-muted">Powered by Gemma 3, Whisper & Edge TTS</p>-->
|
||||||
|
|
||||||
|
<!-- Multi-speaker toolbar -->
|
||||||
|
<div id="speakerToolbar" class="card mb-3" style="display: none;">
|
||||||
|
<div class="card-body p-2">
|
||||||
|
<div class="d-flex align-items-center justify-content-between flex-wrap">
|
||||||
|
<div class="d-flex align-items-center gap-2 mb-2 mb-md-0">
|
||||||
|
<button id="addSpeakerBtn" class="btn btn-sm btn-outline-primary">
|
||||||
|
<i class="fas fa-user-plus"></i> Add Speaker
|
||||||
|
</button>
|
||||||
|
<button id="toggleMultiSpeaker" class="btn btn-sm btn-secondary">
|
||||||
|
<i class="fas fa-users"></i> Multi-Speaker: <span id="multiSpeakerStatus">OFF</span>
|
||||||
|
</button>
|
||||||
|
</div>
|
||||||
|
<div id="speakerList" class="d-flex gap-2 flex-wrap">
|
||||||
|
<!-- Speaker buttons will be added here dynamically -->
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
<div class="row">
|
<div class="row">
|
||||||
<div class="col-md-6 mb-3">
|
<div class="col-md-6 mb-3">
|
||||||
<div class="card">
|
<div class="card">
|
||||||
@ -132,6 +152,7 @@
|
|||||||
</div>
|
</div>
|
||||||
<div class="card-body">
|
<div class="card-body">
|
||||||
<select id="sourceLanguage" class="form-select language-select mb-3">
|
<select id="sourceLanguage" class="form-select language-select mb-3">
|
||||||
|
<option value="auto">Auto-detect</option>
|
||||||
{% for language in languages %}
|
{% for language in languages %}
|
||||||
<option value="{{ language }}">{{ language }}</option>
|
<option value="{{ language }}">{{ language }}</option>
|
||||||
{% endfor %}
|
{% endfor %}
|
||||||
@ -183,6 +204,13 @@
|
|||||||
<i class="fas fa-microphone"></i>
|
<i class="fas fa-microphone"></i>
|
||||||
</button>
|
</button>
|
||||||
<p class="status-indicator" id="statusIndicator">Click to start recording</p>
|
<p class="status-indicator" id="statusIndicator">Click to start recording</p>
|
||||||
|
<!-- Queue Status Indicator -->
|
||||||
|
<div id="queueStatus" class="text-center mt-2" style="display: none;">
|
||||||
|
<small class="text-muted">
|
||||||
|
<i class="fas fa-list"></i> Queue: <span id="queueLength">0</span> |
|
||||||
|
<i class="fas fa-sync"></i> Active: <span id="activeRequests">0</span>
|
||||||
|
</small>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="text-center mt-3">
|
<div class="text-center mt-3">
|
||||||
@ -197,284 +225,180 @@
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
<!-- Multi-speaker conversation view -->
|
||||||
|
<div id="conversationView" class="card mt-4" style="display: none;">
|
||||||
|
<div class="card-header bg-info text-white d-flex justify-content-between align-items-center">
|
||||||
|
<h5 class="mb-0">Conversation</h5>
|
||||||
|
<div>
|
||||||
|
<button id="exportConversation" class="btn btn-sm btn-light">
|
||||||
|
<i class="fas fa-download"></i> Export
|
||||||
|
</button>
|
||||||
|
<button id="clearConversation" class="btn btn-sm btn-light">
|
||||||
|
<i class="fas fa-trash"></i> Clear
|
||||||
|
</button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="card-body" style="max-height: 400px; overflow-y: auto;">
|
||||||
|
<div id="conversationContent">
|
||||||
|
<!-- Conversation entries will be added here -->
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
<audio id="audioPlayer" style="display: none;"></audio>
|
<audio id="audioPlayer" style="display: none;"></audio>
|
||||||
|
|
||||||
|
<!-- TTS Server Configuration Alert -->
|
||||||
|
<div id="ttsServerAlert" class="alert alert-warning d-none" role="alert">
|
||||||
|
<strong>TTS Server Status:</strong> <span id="ttsServerMessage">Checking...</span>
|
||||||
|
<div class="mt-2">
|
||||||
|
<input type="text" id="ttsServerUrl" class="form-control mb-2" placeholder="TTS Server URL">
|
||||||
|
<input type="password" id="ttsApiKey" class="form-control mb-2" placeholder="API Key">
|
||||||
|
<button id="updateTtsServer" class="btn btn-sm btn-primary">Update Configuration</button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- Loading Overlay -->
|
||||||
|
<div id="loadingOverlay" class="loading-overlay">
|
||||||
|
<div class="loading-content">
|
||||||
|
<div class="spinner-custom"></div>
|
||||||
|
<p id="loadingText" class="mt-3">Processing...</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- Notification Settings -->
|
||||||
|
<div class="position-fixed bottom-0 end-0 p-3" style="z-index: 5">
|
||||||
|
<div id="notificationPrompt" class="toast" role="alert" aria-live="assertive" aria-atomic="true">
|
||||||
|
<div class="toast-header">
|
||||||
|
<i class="fas fa-bell text-primary me-2"></i>
|
||||||
|
<strong class="me-auto">Enable Notifications</strong>
|
||||||
|
<button type="button" class="btn-close" data-bs-dismiss="toast" aria-label="Close"></button>
|
||||||
|
</div>
|
||||||
|
<div class="toast-body">
|
||||||
|
Get notified when translations are complete!
|
||||||
|
<div class="mt-2">
|
||||||
|
<button type="button" class="btn btn-sm btn-primary" id="enableNotifications">Enable</button>
|
||||||
|
<button type="button" class="btn btn-sm btn-secondary" data-bs-dismiss="toast">Not now</button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- Success Toast -->
|
||||||
|
<div id="successToast" class="toast align-items-center text-white bg-success border-0" role="alert" aria-live="assertive" aria-atomic="true">
|
||||||
|
<div class="d-flex">
|
||||||
|
<div class="toast-body">
|
||||||
|
<i class="fas fa-check-circle me-2"></i>
|
||||||
|
<span id="successMessage">Settings saved successfully!</span>
|
||||||
|
</div>
|
||||||
|
<button type="button" class="btn-close btn-close-white me-2 m-auto" data-bs-dismiss="toast" aria-label="Close"></button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- Settings Modal -->
|
||||||
|
<div class="modal fade" id="settingsModal" tabindex="-1" aria-labelledby="settingsModalLabel" aria-hidden="true">
|
||||||
|
<div class="modal-dialog">
|
||||||
|
<div class="modal-content">
|
||||||
|
<div class="modal-header">
|
||||||
|
<h5 class="modal-title" id="settingsModalLabel">Settings</h5>
|
||||||
|
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
|
||||||
|
</div>
|
||||||
|
<div class="modal-body">
|
||||||
|
<h6>Notifications</h6>
|
||||||
|
<div class="form-check form-switch">
|
||||||
|
<input class="form-check-input" type="checkbox" id="notificationToggle">
|
||||||
|
<label class="form-check-label" for="notificationToggle">
|
||||||
|
Enable push notifications
|
||||||
|
</label>
|
||||||
|
</div>
|
||||||
|
<p class="text-muted small mt-2">Get notified when transcriptions and translations complete</p>
|
||||||
|
|
||||||
|
<hr>
|
||||||
|
|
||||||
|
<h6>Notification Types</h6>
|
||||||
|
<div class="form-check">
|
||||||
|
<input class="form-check-input" type="checkbox" id="notifyTranscription" checked>
|
||||||
|
<label class="form-check-label" for="notifyTranscription">
|
||||||
|
Transcription complete
|
||||||
|
</label>
|
||||||
|
</div>
|
||||||
|
<div class="form-check">
|
||||||
|
<input class="form-check-input" type="checkbox" id="notifyTranslation" checked>
|
||||||
|
<label class="form-check-label" for="notifyTranslation">
|
||||||
|
Translation complete
|
||||||
|
</label>
|
||||||
|
</div>
|
||||||
|
<div class="form-check">
|
||||||
|
<input class="form-check-input" type="checkbox" id="notifyErrors">
|
||||||
|
<label class="form-check-label" for="notifyErrors">
|
||||||
|
Error notifications
|
||||||
|
</label>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<hr>
|
||||||
|
|
||||||
|
<h6 class="mb-3">Translation Settings</h6>
|
||||||
|
<div class="form-check form-switch mb-3">
|
||||||
|
<input class="form-check-input" type="checkbox" id="streamingTranslation" checked>
|
||||||
|
<label class="form-check-label" for="streamingTranslation">
|
||||||
|
Enable streaming translation
|
||||||
|
<small class="text-muted d-block">Shows translation as it's generated for faster feedback</small>
|
||||||
|
</label>
|
||||||
|
</div>
|
||||||
|
<div class="form-check form-switch mb-3">
|
||||||
|
<input class="form-check-input" type="checkbox" id="multiSpeakerMode">
|
||||||
|
<label class="form-check-label" for="multiSpeakerMode">
|
||||||
|
Enable multi-speaker mode
|
||||||
|
<small class="text-muted d-block">Track multiple speakers in conversations</small>
|
||||||
|
</label>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<hr>
|
||||||
|
|
||||||
|
<h6>Offline Cache</h6>
|
||||||
|
<div class="mb-3">
|
||||||
|
<div class="d-flex justify-content-between align-items-center mb-2">
|
||||||
|
<span>Cached translations:</span>
|
||||||
|
<span id="cacheCount" class="badge bg-primary">0</span>
|
||||||
|
</div>
|
||||||
|
<div class="d-flex justify-content-between align-items-center mb-2">
|
||||||
|
<span>Cache size:</span>
|
||||||
|
<span id="cacheSize" class="badge bg-secondary">0 KB</span>
|
||||||
|
</div>
|
||||||
|
<div class="form-check form-switch mb-2">
|
||||||
|
<input class="form-check-input" type="checkbox" id="offlineMode" checked>
|
||||||
|
<label class="form-check-label" for="offlineMode">
|
||||||
|
Enable offline caching
|
||||||
|
</label>
|
||||||
|
</div>
|
||||||
|
<button type="button" class="btn btn-sm btn-outline-danger" id="clearCache">
|
||||||
|
<i class="fas fa-trash"></i> Clear Cache
|
||||||
|
</button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="modal-footer">
|
||||||
|
<div id="settingsSaveStatus" class="text-success me-auto" style="display: none;">
|
||||||
|
<i class="fas fa-check-circle"></i> Saved!
|
||||||
|
</div>
|
||||||
|
<button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Close</button>
|
||||||
|
<button type="button" class="btn btn-primary" id="saveSettings">Save settings</button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- Settings Button -->
|
||||||
|
<button type="button" class="btn btn-outline-secondary position-fixed top-0 end-0 m-3" data-bs-toggle="modal" data-bs-target="#settingsModal">
|
||||||
|
<i class="fas fa-cog"></i>
|
||||||
|
</button>
|
||||||
|
|
||||||
|
<!-- Simple Success Notification -->
|
||||||
|
<div id="successNotification" class="success-notification">
|
||||||
|
<i class="fas fa-check-circle"></i>
|
||||||
|
<span id="successText">Settings saved successfully!</span>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0-alpha1/dist/js/bootstrap.bundle.min.js"></script>
|
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0-alpha1/dist/js/bootstrap.bundle.min.js"></script>
|
||||||
<script>
|
<script src="/static/js/dist/app.js"></script>
|
||||||
document.addEventListener('DOMContentLoaded', function() {
|
|
||||||
// DOM elements
|
|
||||||
const recordBtn = document.getElementById('recordBtn');
|
|
||||||
const translateBtn = document.getElementById('translateBtn');
|
|
||||||
const sourceText = document.getElementById('sourceText');
|
|
||||||
const translatedText = document.getElementById('translatedText');
|
|
||||||
const sourceLanguage = document.getElementById('sourceLanguage');
|
|
||||||
const targetLanguage = document.getElementById('targetLanguage');
|
|
||||||
const playSource = document.getElementById('playSource');
|
|
||||||
const playTranslation = document.getElementById('playTranslation');
|
|
||||||
const clearSource = document.getElementById('clearSource');
|
|
||||||
const clearTranslation = document.getElementById('clearTranslation');
|
|
||||||
const statusIndicator = document.getElementById('statusIndicator');
|
|
||||||
const progressContainer = document.getElementById('progressContainer');
|
|
||||||
const progressBar = document.getElementById('progressBar');
|
|
||||||
const audioPlayer = document.getElementById('audioPlayer');
|
|
||||||
|
|
||||||
// Set initial values
|
|
||||||
let isRecording = false;
|
|
||||||
let mediaRecorder = null;
|
|
||||||
let audioChunks = [];
|
|
||||||
let currentSourceText = '';
|
|
||||||
let currentTranslationText = '';
|
|
||||||
|
|
||||||
// Make sure target language is different from source
|
|
||||||
if (targetLanguage.options[0].value === sourceLanguage.value) {
|
|
||||||
targetLanguage.selectedIndex = 1;
|
|
||||||
}
|
|
||||||
|
|
||||||
// Event listeners for language selection
|
|
||||||
sourceLanguage.addEventListener('change', function() {
|
|
||||||
if (targetLanguage.value === sourceLanguage.value) {
|
|
||||||
for (let i = 0; i < targetLanguage.options.length; i++) {
|
|
||||||
if (targetLanguage.options[i].value !== sourceLanguage.value) {
|
|
||||||
targetLanguage.selectedIndex = i;
|
|
||||||
break;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
});
|
|
||||||
|
|
||||||
targetLanguage.addEventListener('change', function() {
|
|
||||||
if (targetLanguage.value === sourceLanguage.value) {
|
|
||||||
for (let i = 0; i < sourceLanguage.options.length; i++) {
|
|
||||||
if (sourceLanguage.options[i].value !== targetLanguage.value) {
|
|
||||||
sourceLanguage.selectedIndex = i;
|
|
||||||
break;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
});
|
|
||||||
|
|
||||||
// Record button click event
|
|
||||||
recordBtn.addEventListener('click', function() {
|
|
||||||
if (isRecording) {
|
|
||||||
stopRecording();
|
|
||||||
} else {
|
|
||||||
startRecording();
|
|
||||||
}
|
|
||||||
});
|
|
||||||
|
|
||||||
// Function to start recording
|
|
||||||
function startRecording() {
|
|
||||||
navigator.mediaDevices.getUserMedia({ audio: true })
|
|
||||||
.then(stream => {
|
|
||||||
mediaRecorder = new MediaRecorder(stream);
|
|
||||||
audioChunks = [];
|
|
||||||
|
|
||||||
mediaRecorder.addEventListener('dataavailable', event => {
|
|
||||||
audioChunks.push(event.data);
|
|
||||||
});
|
|
||||||
|
|
||||||
mediaRecorder.addEventListener('stop', () => {
|
|
||||||
const audioBlob = new Blob(audioChunks, { type: 'audio/wav' });
|
|
||||||
transcribeAudio(audioBlob);
|
|
||||||
});
|
|
||||||
|
|
||||||
mediaRecorder.start();
|
|
||||||
isRecording = true;
|
|
||||||
recordBtn.classList.add('recording');
|
|
||||||
recordBtn.classList.replace('btn-primary', 'btn-danger');
|
|
||||||
recordBtn.innerHTML = '<i class="fas fa-stop"></i>';
|
|
||||||
statusIndicator.textContent = 'Recording... Click to stop';
|
|
||||||
})
|
|
||||||
.catch(error => {
|
|
||||||
console.error('Error accessing microphone:', error);
|
|
||||||
alert('Error accessing microphone. Please make sure you have given permission for microphone access.');
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
// Function to stop recording
|
|
||||||
function stopRecording() {
|
|
||||||
mediaRecorder.stop();
|
|
||||||
isRecording = false;
|
|
||||||
recordBtn.classList.remove('recording');
|
|
||||||
recordBtn.classList.replace('btn-danger', 'btn-primary');
|
|
||||||
recordBtn.innerHTML = '<i class="fas fa-microphone"></i>';
|
|
||||||
statusIndicator.textContent = 'Processing audio...';
|
|
||||||
|
|
||||||
// Stop all audio tracks
|
|
||||||
mediaRecorder.stream.getTracks().forEach(track => track.stop());
|
|
||||||
}
|
|
||||||
|
|
||||||
// Function to transcribe audio
|
|
||||||
function transcribeAudio(audioBlob) {
|
|
||||||
const formData = new FormData();
|
|
||||||
formData.append('audio', audioBlob);
|
|
||||||
formData.append('source_lang', sourceLanguage.value);
|
|
||||||
|
|
||||||
showProgress();
|
|
||||||
|
|
||||||
fetch('/transcribe', {
|
|
||||||
method: 'POST',
|
|
||||||
body: formData
|
|
||||||
})
|
|
||||||
.then(response => response.json())
|
|
||||||
.then(data => {
|
|
||||||
hideProgress();
|
|
||||||
|
|
||||||
if (data.success) {
|
|
||||||
currentSourceText = data.text;
|
|
||||||
sourceText.innerHTML = `<p>${data.text}</p>`;
|
|
||||||
playSource.disabled = false;
|
|
||||||
translateBtn.disabled = false;
|
|
||||||
statusIndicator.textContent = 'Transcription complete';
|
|
||||||
} else {
|
|
||||||
sourceText.innerHTML = `<p class="text-danger">Error: ${data.error}</p>`;
|
|
||||||
statusIndicator.textContent = 'Transcription failed';
|
|
||||||
}
|
|
||||||
})
|
|
||||||
.catch(error => {
|
|
||||||
hideProgress();
|
|
||||||
console.error('Transcription error:', error);
|
|
||||||
sourceText.innerHTML = `<p class="text-danger">Failed to transcribe audio. Please try again.</p>`;
|
|
||||||
statusIndicator.textContent = 'Transcription failed';
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
// Translate button click event
|
|
||||||
translateBtn.addEventListener('click', function() {
|
|
||||||
if (!currentSourceText) {
|
|
||||||
return;
|
|
||||||
}
|
|
||||||
|
|
||||||
statusIndicator.textContent = 'Translating...';
|
|
||||||
showProgress();
|
|
||||||
|
|
||||||
fetch('/translate', {
|
|
||||||
method: 'POST',
|
|
||||||
headers: {
|
|
||||||
'Content-Type': 'application/json'
|
|
||||||
},
|
|
||||||
body: JSON.stringify({
|
|
||||||
text: currentSourceText,
|
|
||||||
source_lang: sourceLanguage.value,
|
|
||||||
target_lang: targetLanguage.value
|
|
||||||
})
|
|
||||||
})
|
|
||||||
.then(response => response.json())
|
|
||||||
.then(data => {
|
|
||||||
hideProgress();
|
|
||||||
|
|
||||||
if (data.success) {
|
|
||||||
currentTranslationText = data.translation;
|
|
||||||
translatedText.innerHTML = `<p>${data.translation}</p>`;
|
|
||||||
playTranslation.disabled = false;
|
|
||||||
statusIndicator.textContent = 'Translation complete';
|
|
||||||
} else {
|
|
||||||
translatedText.innerHTML = `<p class="text-danger">Error: ${data.error}</p>`;
|
|
||||||
statusIndicator.textContent = 'Translation failed';
|
|
||||||
}
|
|
||||||
})
|
|
||||||
.catch(error => {
|
|
||||||
hideProgress();
|
|
||||||
console.error('Translation error:', error);
|
|
||||||
translatedText.innerHTML = `<p class="text-danger">Failed to translate. Please try again.</p>`;
|
|
||||||
statusIndicator.textContent = 'Translation failed';
|
|
||||||
});
|
|
||||||
});
|
|
||||||
|
|
||||||
// Play source text
|
|
||||||
playSource.addEventListener('click', function() {
|
|
||||||
if (!currentSourceText) return;
|
|
||||||
|
|
||||||
playAudio(currentSourceText, sourceLanguage.value);
|
|
||||||
statusIndicator.textContent = 'Playing source audio...';
|
|
||||||
});
|
|
||||||
|
|
||||||
// Play translation
|
|
||||||
playTranslation.addEventListener('click', function() {
|
|
||||||
if (!currentTranslationText) return;
|
|
||||||
|
|
||||||
playAudio(currentTranslationText, targetLanguage.value);
|
|
||||||
statusIndicator.textContent = 'Playing translation audio...';
|
|
||||||
});
|
|
||||||
|
|
||||||
// Function to play audio via TTS
|
|
||||||
function playAudio(text, language) {
|
|
||||||
showProgress();
|
|
||||||
|
|
||||||
fetch('/speak', {
|
|
||||||
method: 'POST',
|
|
||||||
headers: {
|
|
||||||
'Content-Type': 'application/json'
|
|
||||||
},
|
|
||||||
body: JSON.stringify({
|
|
||||||
text: text,
|
|
||||||
language: language
|
|
||||||
})
|
|
||||||
})
|
|
||||||
.then(response => response.json())
|
|
||||||
.then(data => {
|
|
||||||
hideProgress();
|
|
||||||
|
|
||||||
if (data.success) {
|
|
||||||
audioPlayer.src = data.audio_url;
|
|
||||||
audioPlayer.onended = function() {
|
|
||||||
statusIndicator.textContent = 'Ready';
|
|
||||||
};
|
|
||||||
audioPlayer.play();
|
|
||||||
} else {
|
|
||||||
statusIndicator.textContent = 'TTS failed';
|
|
||||||
alert('Failed to play audio: ' + data.error);
|
|
||||||
}
|
|
||||||
})
|
|
||||||
.catch(error => {
|
|
||||||
hideProgress();
|
|
||||||
console.error('TTS error:', error);
|
|
||||||
statusIndicator.textContent = 'TTS failed';
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
// Clear buttons
|
|
||||||
clearSource.addEventListener('click', function() {
|
|
||||||
sourceText.innerHTML = '<p class="text-muted">Your transcribed text will appear here...</p>';
|
|
||||||
currentSourceText = '';
|
|
||||||
playSource.disabled = true;
|
|
||||||
translateBtn.disabled = true;
|
|
||||||
});
|
|
||||||
|
|
||||||
clearTranslation.addEventListener('click', function() {
|
|
||||||
translatedText.innerHTML = '<p class="text-muted">Translation will appear here...</p>';
|
|
||||||
currentTranslationText = '';
|
|
||||||
playTranslation.disabled = true;
|
|
||||||
});
|
|
||||||
|
|
||||||
// Progress indicator functions
|
|
||||||
function showProgress() {
|
|
||||||
progressContainer.classList.remove('d-none');
|
|
||||||
let progress = 0;
|
|
||||||
const interval = setInterval(() => {
|
|
||||||
progress += 5;
|
|
||||||
if (progress > 90) {
|
|
||||||
clearInterval(interval);
|
|
||||||
}
|
|
||||||
progressBar.style.width = `${progress}%`;
|
|
||||||
}, 100);
|
|
||||||
progressBar.dataset.interval = interval;
|
|
||||||
}
|
|
||||||
|
|
||||||
function hideProgress() {
|
|
||||||
const interval = progressBar.dataset.interval;
|
|
||||||
if (interval) {
|
|
||||||
clearInterval(Number(interval));
|
|
||||||
}
|
|
||||||
progressBar.style.width = '100%';
|
|
||||||
setTimeout(() => {
|
|
||||||
progressContainer.classList.add('d-none');
|
|
||||||
progressBar.style.width = '0%';
|
|
||||||
}, 500);
|
|
||||||
}
|
|
||||||
});
|
|
||||||
</script>
|
|
||||||
<script src="/static/js/app.js"></script>
|
|
||||||
</body>
|
</body>
|
||||||
</html>
|
</html>
|
||||||
|
41
tsconfig.json
Normal file
41
tsconfig.json
Normal file
@ -0,0 +1,41 @@
|
|||||||
|
{
|
||||||
|
"compilerOptions": {
|
||||||
|
"target": "ES2020",
|
||||||
|
"module": "ES2020",
|
||||||
|
"lib": ["ES2020", "DOM", "DOM.Iterable"],
|
||||||
|
"outDir": "./static/js/dist",
|
||||||
|
"rootDir": "./static/js/src",
|
||||||
|
"strict": true,
|
||||||
|
"esModuleInterop": true,
|
||||||
|
"skipLibCheck": true,
|
||||||
|
"forceConsistentCasingInFileNames": true,
|
||||||
|
"moduleResolution": "node",
|
||||||
|
"resolveJsonModule": true,
|
||||||
|
"declaration": true,
|
||||||
|
"declarationMap": true,
|
||||||
|
"sourceMap": true,
|
||||||
|
"removeComments": false,
|
||||||
|
"noEmitOnError": true,
|
||||||
|
"noImplicitAny": true,
|
||||||
|
"noImplicitThis": true,
|
||||||
|
"noUnusedLocals": true,
|
||||||
|
"noUnusedParameters": true,
|
||||||
|
"noImplicitReturns": true,
|
||||||
|
"noFallthroughCasesInSwitch": true,
|
||||||
|
"strictNullChecks": true,
|
||||||
|
"strictFunctionTypes": true,
|
||||||
|
"strictBindCallApply": true,
|
||||||
|
"strictPropertyInitialization": true,
|
||||||
|
"allowJs": false,
|
||||||
|
"types": [
|
||||||
|
"node"
|
||||||
|
]
|
||||||
|
},
|
||||||
|
"include": [
|
||||||
|
"static/js/src/**/*"
|
||||||
|
],
|
||||||
|
"exclude": [
|
||||||
|
"node_modules",
|
||||||
|
"static/js/dist"
|
||||||
|
]
|
||||||
|
}
|
@ -1,78 +0,0 @@
|
|||||||
#!/usr/bin/env python
|
|
||||||
"""
|
|
||||||
TTS Debug Script - Tests connection to the OpenAI TTS server
|
|
||||||
"""
|
|
||||||
|
|
||||||
import os
|
|
||||||
import sys
|
|
||||||
import json
|
|
||||||
import requests
|
|
||||||
from argparse import ArgumentParser
|
|
||||||
|
|
||||||
def test_tts_connection(server_url, api_key, text="Hello, this is a test message"):
|
|
||||||
"""Test connection to the TTS server"""
|
|
||||||
|
|
||||||
headers = {
|
|
||||||
"Content-Type": "application/json",
|
|
||||||
"Authorization": f"Bearer {api_key}"
|
|
||||||
}
|
|
||||||
|
|
||||||
payload = {
|
|
||||||
"input": text,
|
|
||||||
"voice": "echo",
|
|
||||||
"response_format": "mp3",
|
|
||||||
"speed": 1.0
|
|
||||||
}
|
|
||||||
|
|
||||||
print(f"Sending request to: {server_url}")
|
|
||||||
print(f"Headers: {headers}")
|
|
||||||
print(f"Payload: {json.dumps(payload, indent=2)}")
|
|
||||||
|
|
||||||
try:
|
|
||||||
response = requests.post(
|
|
||||||
server_url,
|
|
||||||
headers=headers,
|
|
||||||
json=payload,
|
|
||||||
timeout=15
|
|
||||||
)
|
|
||||||
|
|
||||||
print(f"Response status code: {response.status_code}")
|
|
||||||
|
|
||||||
if response.status_code == 200:
|
|
||||||
print("Success! Received audio data")
|
|
||||||
# Save to file
|
|
||||||
output_file = "tts_test_output.mp3"
|
|
||||||
with open(output_file, "wb") as f:
|
|
||||||
f.write(response.content)
|
|
||||||
print(f"Saved audio to {output_file}")
|
|
||||||
return True
|
|
||||||
else:
|
|
||||||
print("Error in response")
|
|
||||||
try:
|
|
||||||
error_data = response.json()
|
|
||||||
print(f"Error details: {json.dumps(error_data, indent=2)}")
|
|
||||||
except:
|
|
||||||
print(f"Raw response: {response.text[:500]}")
|
|
||||||
return False
|
|
||||||
|
|
||||||
except Exception as e:
|
|
||||||
print(f"Error during request: {str(e)}")
|
|
||||||
return False
|
|
||||||
|
|
||||||
def main():
|
|
||||||
parser = ArgumentParser(description="Test connection to OpenAI TTS server")
|
|
||||||
parser.add_argument("--url", default="http://localhost:5050/v1/audio/speech", help="TTS server URL")
|
|
||||||
parser.add_argument("--key", default=os.environ.get("TTS_API_KEY", ""), help="API key")
|
|
||||||
parser.add_argument("--text", default="Hello, this is a test message", help="Text to synthesize")
|
|
||||||
|
|
||||||
args = parser.parse_args()
|
|
||||||
|
|
||||||
if not args.key:
|
|
||||||
print("Error: API key is required. Use --key argument or set TTS_API_KEY environment variable.")
|
|
||||||
return 1
|
|
||||||
|
|
||||||
success = test_tts_connection(args.url, args.key, args.text)
|
|
||||||
return 0 if success else 1
|
|
||||||
|
|
||||||
if __name__ == "__main__":
|
|
||||||
sys.exit(main())
|
|
Binary file not shown.
243
validators.py
Normal file
243
validators.py
Normal file
@ -0,0 +1,243 @@
|
|||||||
|
"""
|
||||||
|
Input validation and sanitization for the Talk2Me application
|
||||||
|
"""
|
||||||
|
import re
|
||||||
|
import html
|
||||||
|
from typing import Optional, Dict, Any, Tuple
|
||||||
|
import os
|
||||||
|
|
||||||
|
class Validators:
|
||||||
|
# Maximum sizes
|
||||||
|
MAX_TEXT_LENGTH = 10000
|
||||||
|
MAX_AUDIO_SIZE = 25 * 1024 * 1024 # 25MB
|
||||||
|
MAX_URL_LENGTH = 2048
|
||||||
|
MAX_API_KEY_LENGTH = 128
|
||||||
|
|
||||||
|
# Allowed audio formats
|
||||||
|
ALLOWED_AUDIO_EXTENSIONS = {'.webm', '.ogg', '.wav', '.mp3', '.mp4', '.m4a'}
|
||||||
|
ALLOWED_AUDIO_MIMETYPES = {
|
||||||
|
'audio/webm', 'audio/ogg', 'audio/wav', 'audio/mp3',
|
||||||
|
'audio/mpeg', 'audio/mp4', 'audio/x-m4a', 'audio/x-wav'
|
||||||
|
}
|
||||||
|
|
||||||
|
@staticmethod
|
||||||
|
def sanitize_text(text: str, max_length: int = None) -> str:
|
||||||
|
"""Sanitize text input by removing dangerous characters"""
|
||||||
|
if not isinstance(text, str):
|
||||||
|
return ""
|
||||||
|
|
||||||
|
if max_length is None:
|
||||||
|
max_length = Validators.MAX_TEXT_LENGTH
|
||||||
|
|
||||||
|
# Trim and limit length
|
||||||
|
text = text.strip()[:max_length]
|
||||||
|
|
||||||
|
# Remove null bytes
|
||||||
|
text = text.replace('\x00', '')
|
||||||
|
|
||||||
|
# Remove control characters except newlines and tabs
|
||||||
|
text = re.sub(r'[\x00-\x08\x0B\x0C\x0E-\x1F\x7F]', '', text)
|
||||||
|
|
||||||
|
return text
|
||||||
|
|
||||||
|
@staticmethod
|
||||||
|
def sanitize_html(text: str) -> str:
|
||||||
|
"""Escape HTML to prevent XSS"""
|
||||||
|
if not isinstance(text, str):
|
||||||
|
return ""
|
||||||
|
return html.escape(text)
|
||||||
|
|
||||||
|
@staticmethod
|
||||||
|
def validate_language_code(code: str, allowed_languages: set) -> Optional[str]:
|
||||||
|
"""Validate language code against allowed list"""
|
||||||
|
if not code or not isinstance(code, str):
|
||||||
|
return None
|
||||||
|
|
||||||
|
code = code.strip().lower()
|
||||||
|
|
||||||
|
# Check if it's in the allowed list or is 'auto'
|
||||||
|
if code in allowed_languages or code == 'auto':
|
||||||
|
return code
|
||||||
|
|
||||||
|
return None
|
||||||
|
|
||||||
|
@staticmethod
|
||||||
|
def validate_audio_file(file_storage) -> Tuple[bool, Optional[str]]:
|
||||||
|
"""Validate uploaded audio file"""
|
||||||
|
if not file_storage:
|
||||||
|
return False, "No file provided"
|
||||||
|
|
||||||
|
# Check file size
|
||||||
|
file_storage.seek(0, os.SEEK_END)
|
||||||
|
size = file_storage.tell()
|
||||||
|
file_storage.seek(0)
|
||||||
|
|
||||||
|
if size > Validators.MAX_AUDIO_SIZE:
|
||||||
|
return False, f"File size exceeds {Validators.MAX_AUDIO_SIZE // (1024*1024)}MB limit"
|
||||||
|
|
||||||
|
# Check file extension
|
||||||
|
if file_storage.filename:
|
||||||
|
ext = os.path.splitext(file_storage.filename.lower())[1]
|
||||||
|
if ext not in Validators.ALLOWED_AUDIO_EXTENSIONS:
|
||||||
|
return False, "Invalid audio file type"
|
||||||
|
|
||||||
|
# Check MIME type if available
|
||||||
|
if hasattr(file_storage, 'content_type') and file_storage.content_type:
|
||||||
|
if file_storage.content_type not in Validators.ALLOWED_AUDIO_MIMETYPES:
|
||||||
|
# Allow generic application/octet-stream as browsers sometimes use this
|
||||||
|
if file_storage.content_type != 'application/octet-stream':
|
||||||
|
return False, "Invalid audio MIME type"
|
||||||
|
|
||||||
|
return True, None
|
||||||
|
|
||||||
|
@staticmethod
|
||||||
|
def validate_url(url: str) -> Optional[str]:
|
||||||
|
"""Validate and sanitize URL"""
|
||||||
|
if not url or not isinstance(url, str):
|
||||||
|
return None
|
||||||
|
|
||||||
|
url = url.strip()
|
||||||
|
|
||||||
|
# Check length
|
||||||
|
if len(url) > Validators.MAX_URL_LENGTH:
|
||||||
|
return None
|
||||||
|
|
||||||
|
# Basic URL pattern check
|
||||||
|
url_pattern = re.compile(
|
||||||
|
r'^https?://' # http:// or https://
|
||||||
|
r'(?:(?:[A-Z0-9](?:[A-Z0-9-]{0,61}[A-Z0-9])?\.)+[A-Z]{2,6}\.?|' # domain...
|
||||||
|
r'localhost|' # localhost...
|
||||||
|
r'\d{1,3}\.\d{1,3}\.\d{1,3}\.\d{1,3}|' # ...or ipv4
|
||||||
|
r'\[?[A-F0-9]*:[A-F0-9:]+\]?)' # ...or ipv6
|
||||||
|
r'(?::\d+)?' # optional port
|
||||||
|
r'(?:/?|[/?]\S+)$', re.IGNORECASE)
|
||||||
|
|
||||||
|
if not url_pattern.match(url):
|
||||||
|
return None
|
||||||
|
|
||||||
|
# Prevent some common injection attempts
|
||||||
|
dangerous_patterns = [
|
||||||
|
'javascript:', 'data:', 'vbscript:', 'file:', 'about:', 'chrome:'
|
||||||
|
]
|
||||||
|
if any(pattern in url.lower() for pattern in dangerous_patterns):
|
||||||
|
return None
|
||||||
|
|
||||||
|
return url
|
||||||
|
|
||||||
|
@staticmethod
|
||||||
|
def validate_api_key(key: str) -> Optional[str]:
|
||||||
|
"""Validate API key format"""
|
||||||
|
if not key or not isinstance(key, str):
|
||||||
|
return None
|
||||||
|
|
||||||
|
key = key.strip()
|
||||||
|
|
||||||
|
# Check length
|
||||||
|
if len(key) < 20 or len(key) > Validators.MAX_API_KEY_LENGTH:
|
||||||
|
return None
|
||||||
|
|
||||||
|
# Only allow alphanumeric, dash, and underscore
|
||||||
|
if not re.match(r'^[a-zA-Z0-9\-_]+$', key):
|
||||||
|
return None
|
||||||
|
|
||||||
|
return key
|
||||||
|
|
||||||
|
@staticmethod
|
||||||
|
def sanitize_filename(filename: str) -> str:
|
||||||
|
"""Sanitize filename to prevent directory traversal"""
|
||||||
|
if not filename or not isinstance(filename, str):
|
||||||
|
return "file"
|
||||||
|
|
||||||
|
# Remove any path components
|
||||||
|
filename = os.path.basename(filename)
|
||||||
|
|
||||||
|
# Remove dangerous characters
|
||||||
|
filename = re.sub(r'[^a-zA-Z0-9.\-_]', '_', filename)
|
||||||
|
|
||||||
|
# Limit length
|
||||||
|
if len(filename) > 255:
|
||||||
|
name, ext = os.path.splitext(filename)
|
||||||
|
max_name_length = 255 - len(ext)
|
||||||
|
filename = name[:max_name_length] + ext
|
||||||
|
|
||||||
|
# Don't allow hidden files
|
||||||
|
if filename.startswith('.'):
|
||||||
|
filename = '_' + filename[1:]
|
||||||
|
|
||||||
|
return filename or "file"
|
||||||
|
|
||||||
|
@staticmethod
|
||||||
|
def validate_json_size(data: Dict[str, Any], max_size_kb: int = 1024) -> bool:
|
||||||
|
"""Check if JSON data size is within limits"""
|
||||||
|
try:
|
||||||
|
import json
|
||||||
|
json_str = json.dumps(data)
|
||||||
|
size_kb = len(json_str.encode('utf-8')) / 1024
|
||||||
|
return size_kb <= max_size_kb
|
||||||
|
except:
|
||||||
|
return False
|
||||||
|
|
||||||
|
@staticmethod
|
||||||
|
def validate_settings(settings: Dict[str, Any]) -> Tuple[bool, Dict[str, Any], list]:
|
||||||
|
"""Validate settings object"""
|
||||||
|
errors = []
|
||||||
|
sanitized = {}
|
||||||
|
|
||||||
|
# Boolean settings
|
||||||
|
bool_settings = [
|
||||||
|
'notificationsEnabled', 'notifyTranscription',
|
||||||
|
'notifyTranslation', 'notifyErrors', 'offlineMode'
|
||||||
|
]
|
||||||
|
|
||||||
|
for setting in bool_settings:
|
||||||
|
if setting in settings:
|
||||||
|
sanitized[setting] = bool(settings[setting])
|
||||||
|
|
||||||
|
# URL validation
|
||||||
|
if 'ttsServerUrl' in settings and settings['ttsServerUrl']:
|
||||||
|
url = Validators.validate_url(settings['ttsServerUrl'])
|
||||||
|
if not url:
|
||||||
|
errors.append('Invalid TTS server URL')
|
||||||
|
else:
|
||||||
|
sanitized['ttsServerUrl'] = url
|
||||||
|
|
||||||
|
# API key validation
|
||||||
|
if 'ttsApiKey' in settings and settings['ttsApiKey']:
|
||||||
|
key = Validators.validate_api_key(settings['ttsApiKey'])
|
||||||
|
if not key:
|
||||||
|
errors.append('Invalid API key format')
|
||||||
|
else:
|
||||||
|
sanitized['ttsApiKey'] = key
|
||||||
|
|
||||||
|
return len(errors) == 0, sanitized, errors
|
||||||
|
|
||||||
|
@staticmethod
|
||||||
|
def rate_limit_check(identifier: str, action: str, max_requests: int = 10,
|
||||||
|
window_seconds: int = 60, storage: Dict = None) -> bool:
|
||||||
|
"""
|
||||||
|
Simple rate limiting check
|
||||||
|
Returns True if request is allowed, False if rate limited
|
||||||
|
"""
|
||||||
|
import time
|
||||||
|
|
||||||
|
if storage is None:
|
||||||
|
return True # Can't track without storage
|
||||||
|
|
||||||
|
key = f"{identifier}:{action}"
|
||||||
|
current_time = time.time()
|
||||||
|
window_start = current_time - window_seconds
|
||||||
|
|
||||||
|
# Get or create request list
|
||||||
|
if key not in storage:
|
||||||
|
storage[key] = []
|
||||||
|
|
||||||
|
# Remove old requests outside the window
|
||||||
|
storage[key] = [t for t in storage[key] if t > window_start]
|
||||||
|
|
||||||
|
# Check if limit exceeded
|
||||||
|
if len(storage[key]) >= max_requests:
|
||||||
|
return False
|
||||||
|
|
||||||
|
# Add current request
|
||||||
|
storage[key].append(current_time)
|
||||||
|
return True
|
39
whisper_config.py
Normal file
39
whisper_config.py
Normal file
@ -0,0 +1,39 @@
|
|||||||
|
"""
|
||||||
|
Whisper Model Configuration and Optimization Settings
|
||||||
|
"""
|
||||||
|
|
||||||
|
# Model selection based on available resources
|
||||||
|
# Available models: tiny, base, small, medium, large
|
||||||
|
MODEL_SIZE = "base" # ~140MB, good balance of speed and accuracy
|
||||||
|
|
||||||
|
# GPU Optimization Settings
|
||||||
|
GPU_OPTIMIZATIONS = {
|
||||||
|
"enable_tf32": True, # TensorFloat-32 for Ampere GPUs
|
||||||
|
"enable_cudnn_benchmark": True, # Auto-tune convolution algorithms
|
||||||
|
"use_fp16": True, # Half precision for faster inference
|
||||||
|
"pre_allocate_memory": True, # Reduce memory fragmentation
|
||||||
|
"warm_up_gpu": True # Cache CUDA kernels on startup
|
||||||
|
}
|
||||||
|
|
||||||
|
# Transcription Settings for Speed
|
||||||
|
TRANSCRIBE_OPTIONS = {
|
||||||
|
"task": "transcribe",
|
||||||
|
"temperature": 0, # Disable sampling
|
||||||
|
"best_of": 1, # No beam search
|
||||||
|
"beam_size": 1, # Single beam
|
||||||
|
"condition_on_previous_text": False, # Faster inference
|
||||||
|
"compression_ratio_threshold": 2.4,
|
||||||
|
"logprob_threshold": -1.0,
|
||||||
|
"no_speech_threshold": 0.6,
|
||||||
|
"word_timestamps": False # Disable if not needed
|
||||||
|
}
|
||||||
|
|
||||||
|
# Memory Management
|
||||||
|
MEMORY_SETTINGS = {
|
||||||
|
"clear_cache_after_transcribe": True,
|
||||||
|
"force_garbage_collection": True,
|
||||||
|
"max_concurrent_transcriptions": 1 # Prevent memory overflow
|
||||||
|
}
|
||||||
|
|
||||||
|
# Performance Monitoring
|
||||||
|
ENABLE_PERFORMANCE_LOGGING = True
|
34
wsgi.py
Normal file
34
wsgi.py
Normal file
@ -0,0 +1,34 @@
|
|||||||
|
#!/usr/bin/env python3
|
||||||
|
"""
|
||||||
|
WSGI entry point for production deployment
|
||||||
|
"""
|
||||||
|
import os
|
||||||
|
import sys
|
||||||
|
from pathlib import Path
|
||||||
|
|
||||||
|
# Add the project directory to the Python path
|
||||||
|
project_root = Path(__file__).parent.absolute()
|
||||||
|
sys.path.insert(0, str(project_root))
|
||||||
|
|
||||||
|
# Set production environment
|
||||||
|
os.environ['FLASK_ENV'] = 'production'
|
||||||
|
|
||||||
|
# Import and configure the Flask app
|
||||||
|
from app import app
|
||||||
|
|
||||||
|
# Production configuration overrides
|
||||||
|
app.config.update(
|
||||||
|
DEBUG=False,
|
||||||
|
TESTING=False,
|
||||||
|
# Ensure proper secret key is set in production
|
||||||
|
SECRET_KEY=os.environ.get('SECRET_KEY', app.config.get('SECRET_KEY'))
|
||||||
|
)
|
||||||
|
|
||||||
|
# Create the WSGI application
|
||||||
|
application = app
|
||||||
|
|
||||||
|
if __name__ == '__main__':
|
||||||
|
# This is only for development/testing
|
||||||
|
# In production, use: gunicorn wsgi:application
|
||||||
|
print("Warning: Running WSGI directly. Use a proper WSGI server in production!")
|
||||||
|
application.run(host='0.0.0.0', port=5005)
|
Loading…
Reference in New Issue
Block a user