# Frontend-API-Konfiguration für separates Backend

## Übersicht

Das Frontend wurde konfiguriert, um mit einem Backend auf einem separaten Server unter `https://192.168.0.105:443` zu kommunizieren.

## Durchgeführte Änderungen

### 1. API-Basis-URL-Konfiguration (`frontend/src/utils/api-config.ts`)

**Primäre Backend-URL**: `https://192.168.0.105:443`

**Fallback-URLs**:
- `https://192.168.0.105` (ohne expliziten Port)
- `https://raspberrypi` (lokaler Raspberry Pi Fallback)

### 2. SSL-Zertifikat-Handling

- Selbstsignierte Zertifikate werden automatisch akzeptiert
- `NODE_TLS_REJECT_UNAUTHORIZED = '0'` für Development

### 3. API-Endpunkt-Konfiguration

Alle API-Endpunkte wurden angepasst:

```typescript
export const API_ENDPOINTS = {
  PRINTERS: 'https://192.168.0.105:443/api/printers',
  JOBS: 'https://192.168.0.105:443/api/jobs',
  USERS: 'https://192.168.0.105:443/api/users',
  HEALTH: 'https://192.168.0.105:443/health',
  AUTH: {
    LOGIN: 'https://192.168.0.105:443/api/auth/login',
    CALLBACK: 'https://192.168.0.105:443/api/auth/callback',
  }
};
```

### 4. Fallback-Mechanismus

Das Frontend verfügt über einen robusten Fallback-Mechanismus:

1. **Primäre Verbindung**: `https://192.168.0.105:443`
2. **Fallback 1**: `https://192.168.0.105` (Port 443 automatisch)
3. **Fallback 2**: `https://raspberrypi` (lokaler Pi)

### 5. Health Check Integration

Der Health Check wurde angepasst, um die Backend-Konnektivität zu überwachen:

```typescript
// Health Check prüft Backend unter https://192.168.0.105:443/health
const backendStatus = await fetch(`${backendUrl}/health`);
```

## Environment-Variablen (optional)

Falls gewünscht, kann die Backend-URL über Environment-Variablen überschrieben werden:

```bash
# .env.local
NEXT_PUBLIC_API_URL=https://192.168.0.105:443
NODE_TLS_REJECT_UNAUTHORIZED=0
```

## Netzwerk-Konfiguration

### Backend-Server-Anforderungen

1. **HTTPS aktiviert** auf Port 443
2. **CORS konfiguriert** für Frontend-Domain
3. **SSL-Zertifikat** (selbstsigniert oder gültig)
4. **API-Endpunkte** verfügbar unter `/api/*`
5. **Health Check** verfügbar unter `/health`

### Firewall-Regeln

```bash
# Backend-Server (192.168.0.105)
sudo ufw allow 443/tcp
sudo ufw allow from 192.168.0.0/24 to any port 443
```

## Entwicklung und Testing

### Backend-Verbindung testen

```bash
# SSL-Verbindung testen
curl -k https://192.168.0.105:443/health

# API-Endpunkte testen
curl -k https://192.168.0.105:443/api/printers
curl -k https://192.168.0.105:443/api/jobs
```

### Frontend-Server starten

```bash
cd frontend
pnpm install
pnpm dev
```

Das Frontend läuft auf `http://localhost:3000` und verbindet sich automatisch mit dem Backend unter `https://192.168.0.105:443`.

## Fehlerbehebung

### SSL-Zertifikat-Probleme

Falls SSL-Zertifikat-Fehler auftreten:

1. **Browser**: Besuche `https://192.168.0.105:443` und akzeptiere das Zertifikat manuell
2. **curl**: Verwende `-k` Flag für unsichere Verbindungen
3. **fetch**: `NODE_TLS_REJECT_UNAUTHORIZED=0` ist bereits gesetzt

### Verbindungsprobleme

1. **Netzwerk**: Prüfe ob `192.168.0.105` erreichbar ist
2. **Port**: Stelle sicher, dass Port 443 geöffnet ist
3. **Backend**: Prüfe ob Backend-Service läuft
4. **Logs**: Prüfe Browser-Konsole und Backend-Logs

### Fallback-Testing

Das Frontend versucht automatisch Fallback-URLs:

```javascript
// In Browser-Konsole testen
console.log('API_BASE_URL:', API_BASE_URL);
fetch('/api/health').then(r => r.json()).then(console.log);
```

## Produktions-Deployment

### Umgebungsspezifische Konfiguration

```bash
# Production
NEXT_PUBLIC_API_URL=https://192.168.0.105:443

# Staging
NEXT_PUBLIC_API_URL=https://staging-backend:443

# Development
NEXT_PUBLIC_API_URL=https://localhost:5000
```

### Docker-Deployment

```yaml
# docker-compose.yml
services:
  frontend:
    build: ./frontend
    environment:
      - NEXT_PUBLIC_API_URL=https://192.168.0.105:443
    ports:
      - "3000:3000"
```

---

**Status**: ✅ Konfiguration abgeschlossen  
**Backend-URL**: `https://192.168.0.105:443`  
**Fallback-Support**: Aktiviert  
**SSL-Handling**: Selbstsignierte Zertifikate akzeptiert  
**Getestet**: Bereit für Integration 