alex/tilbudgivern
1
0
Fork 0
Code Issues Pull Requests Actions 1 Packages Projects Releases Wiki Activity
Files
main
tilbudgivern/docs/HTTP_SESSION_ERROR_LOGGING.md

11 KiB
Raw Permalink Blame History

🚨 HTTP & Session Error Logging - Implementering

Oversigt

Udvidelse af logging systemet til at fange og logge alle HTTP fejl, session fejl og frontend fejl når brugere tilgår siden. Dette giver jer komplet indsigt i problemer brugere oplever.

🎯 Hvad Logges Nu

Backend Logging:

✅ HTTP Fejl (4xx, 5xx)

  • 404 Not Found - Broken links, manglende sider
  • 403 Forbidden - Authorization fejl
  • 401 Unauthorized - Authentication fejl
  • 500 Server Error - Kritiske server fejl
  • Alle andre HTTP fejl koder

✅ Session Fejl

  • Udløbne sessions
  • Manglende sessions på beskyttede endpoints
  • Session timeout problemer

✅ Authentication Fejl

  • Ugyldige JWT tokens
  • Udløbne tokens
  • Manglende authentication

✅ Response Fejl

  • Alle responses med status >= 400
  • Selvom de ikke kastes som exceptions

Frontend Logging:

✅ JavaScript Fejl

  • Uncaught errors
  • Unhandled promise rejections
  • React component errors

✅ Network Fejl

  • Failed API calls
  • Timeout errors
  • Connection errors

✅ Session Fejl fra Frontend

  • Session timeout detecteret i frontend
  • Invalid session state

📁 Nye Filer

Backend:

  1. backend/src/middleware/httpErrorLogger.js ⭐

    • httpErrorLogger - Logger HTTP fejl (4xx, 5xx)
    • sessionErrorLogger - Logger session problemer
    • authErrorLogger - Logger authentication fejl
    • responseErrorLogger - Fanger error responses

  2. backend/routes/clientErrors.js ⭐

    • POST /api/client-errors - Log JavaScript fejl fra frontend
    • POST /api/client-errors/network - Log network fejl fra frontend
    • POST /api/client-errors/session - Log session fejl fra frontend

  3. Udvidet backend/routes/adminLogs.js ⭐

    • GET /api/admin/logs/http-errors - Se alle HTTP fejl
    • GET /api/admin/logs/session-errors - Se session fejl
    • GET /api/admin/logs/user-errors/:userId - Fejl for specifik bruger
    • GET /api/admin/logs/stats/http-errors - HTTP fejl statistik
    • GET /api/admin/logs/frontend-errors - Fejl fra frontend

Frontend:

  1. frontend/src/utils/errorLogger.js ⭐

    • Automatisk fangning af JavaScript fejl
    • Interceptor for fetch/axios network fejl
    • Manual logging funktioner

  2. frontend/src/ErrorBoundary.js ⭐

    • React Error Boundary komponent
    • Automatisk fejl håndtering

🔧 Integration i unified-server.js

Middlewares er tilføjet i korrekt rækkefølge:

// 1. Session error logger (before processing)
app.use('/api', sessionErrorLogger);

// 2. Request logger (log all requests)
app.use('/api', requestLogger);

// 3. Response error logger (capture error responses)
app.use('/api', responseErrorLogger);

// ... routes ...

// 4. 404 handler
app.use('/api/*', notFoundHandler);

// 5. Authentication error logger
app.use('/api/*', authErrorLogger);

// 6. HTTP error logger
app.use('/api/*', httpErrorLogger);

// 7. Global error handler (must be last)
app.use('/api/*', errorHandler);

📊 Hvad Logges i Database

HTTP Fejl Log Eksempel:

{
  "level": "WARNING",
  "context": "HTTPError",
  "category": "NOT_FOUND",
  "message": "HTTP 404: Route not found",
  "error_code": "HTTP_404",
  "request_method": "GET",
  "request_url": "/api/nonexistent",
  "request_ip": "192.168.1.100",
  "user_id": 42,
  "metadata": {
    "statusCode": 404,
    "path": "/api/nonexistent",
    "referer": "https://tilbudgivern.dk/dashboard",
    "sessionId": "abc123",
    "userAgent": "Mozilla/5.0..."
  }
}

Session Fejl Log Eksempel:

{
  "level": "WARNING",
  "context": "SessionExpired",
  "category": "SESSION",
  "message": "Bruger forsøgte at tilgå med udløbet session",
  "error_code": "SESSION_EXPIRED",
  "user_id": 42,
  "metadata": {
    "sessionId": "xyz789",
    "path": "/api/projects",
    "lastActivity": "2024-11-14T10:30:00Z"
  }
}

🚀 Brug i Frontend

1. Tilføj Error Boundary til App

src/index.js eller src/App.js:

import ErrorBoundary from './ErrorBoundary';
import './utils/errorLogger'; // Auto-init global error handlers

function App() {
  return (
    <ErrorBoundary>
      <YourAppContent />
    </ErrorBoundary>
  );
}

2. Setup Axios Error Logging (hvis I bruger axios)

import axios from 'axios';
import errorLogger from './utils/errorLogger';

// Setup axios interceptor
errorLogger.setupAxiosErrorLogging(axios);

3. Manuel Fejl Logging

import errorLogger from './utils/errorLogger';

// Log custom fejl
errorLogger.logCustomError('Noget gik galt i checkout', {
  severity: 'warning',
  additionalData: { orderId: 123 }
});

// Log session fejl
errorLogger.logSessionError('SESSION_TIMEOUT', 'Session udløb under checkout');

📡 Nye Admin API Endpoints

Se HTTP Fejl:

# Alle HTTP fejl
GET /api/admin/logs/http-errors

# Filtrér på status code
GET /api/admin/logs/http-errors?statusCode=404

# Med dato range
GET /api/admin/logs/http-errors?startDate=2024-11-14&endDate=2024-11-15

Se Session Fejl:

GET /api/admin/logs/session-errors

Se Fejl for Specifik Bruger:

GET /api/admin/logs/user-errors/42

HTTP Fejl Statistik:

GET /api/admin/logs/stats/http-errors

Response:

{
  "success": true,
  "stats": {
    "byStatusCode": [
      {
        "error_code": "HTTP_404",
        "category": "NOT_FOUND",
        "count": 45,
        "affected_users": 12
      }
    ],
    "affectedUrls": [
      {
        "url": "/api/old-endpoint",
        "error_count": 23,
        "affected_users": 8
      }
    ]
  }
}

Frontend Fejl:

GET /api/admin/logs/frontend-errors

🔍 Use Cases

1. Find Broken Links (404s)

SELECT request_url, COUNT(*) as count, COUNT(DISTINCT user_id) as users
FROM system_logs 
WHERE error_code = 'HTTP_404' 
  AND created_at >= DATE_SUB(NOW(), INTERVAL 7 DAY)
GROUP BY request_url 
ORDER BY count DESC;

2. Session Timeout Problemer

SELECT DATE(created_at) as date, COUNT(*) as count
FROM system_logs 
WHERE error_code = 'SESSION_EXPIRED'
  AND created_at >= DATE_SUB(NOW(), INTERVAL 30 DAY)
GROUP BY DATE(created_at)
ORDER BY date DESC;

3. Authorization Issues

SELECT user_id, user_email, request_url, COUNT(*) as attempts
FROM system_logs 
WHERE category = 'ACCESS_DENIED'
  AND created_at >= DATE_SUB(NOW(), INTERVAL 1 DAY)
GROUP BY user_id, user_email, request_url
ORDER BY attempts DESC;

4. Mest Påvirkede Brugere

SELECT user_id, user_email, 
       COUNT(*) as error_count,
       COUNT(DISTINCT error_code) as unique_errors
FROM system_logs 
WHERE level IN ('ERROR', 'WARNING')
  AND user_id IS NOT NULL
  AND created_at >= DATE_SUB(NOW(), INTERVAL 7 DAY)
GROUP BY user_id, user_email
ORDER BY error_count DESC
LIMIT 20;

5. Frontend vs Backend Fejl

SELECT 
  CASE 
    WHEN category LIKE 'FRONTEND%' THEN 'Frontend'
    ELSE 'Backend'
  END as source,
  COUNT(*) as count
FROM system_logs 
WHERE level = 'ERROR'
  AND created_at >= DATE_SUB(NOW(), INTERVAL 7 DAY)
GROUP BY source;

🎨 Dashboard Eksempel (React)

import React, { useState, useEffect } from 'react';

function ErrorDashboard() {
  const [httpErrors, setHttpErrors] = useState([]);
  const [stats, setStats] = useState({});

  useEffect(() => {
    // Hent HTTP fejl
    fetch('/api/admin/logs/http-errors?limit=50')
      .then(res => res.json())
      .then(data => setHttpErrors(data.data));

    // Hent statistik
    fetch('/api/admin/logs/stats/http-errors')
      .then(res => res.json())
      .then(data => setStats(data.stats));
  }, []);

  return (
    <div>
      <h1>Fejl Dashboard</h1>
      
      <section>
        <h2>Top HTTP Fejl</h2>
        <table>
          <thead>
            <tr>
              <th>Fejlkode</th>
              <th>Antal</th>
              <th>Påvirkede Brugere</th>
            </tr>
          </thead>
          <tbody>
            {stats.byStatusCode?.map(stat => (
              <tr key={stat.error_code}>
                <td>{stat.error_code}</td>
                <td>{stat.count}</td>
                <td>{stat.affected_users}</td>
              </tr>
            ))}
          </tbody>
        </table>
      </section>

      <section>
        <h2>Seneste HTTP Fejl</h2>
        <ul>
          {httpErrors.map(error => (
            <li key={error.id}>
              <strong>{error.error_code}</strong>: {error.message}
              <br />
              <small>{error.request_url} - {error.created_at}</small>
            </li>
          ))}
        </ul>
      </section>
    </div>
  );
}

📈 Monitoring Alerts

Setup Email Alerts (eksempel)

Tilføj til din cron job eller scheduled task:

#!/bin/bash
# check-critical-errors.sh

# Tjek for kritiske fejl i sidste time
CRITICAL_ERRORS=$(mysql -u tilbuduser -p"${DB_PASSWORD}" tilbudgivern -sN -e "
  SELECT COUNT(*) 
  FROM system_logs 
  WHERE level='ERROR' 
    AND category IN ('SERVER_ERROR', 'DATABASE')
    AND created_at >= DATE_SUB(NOW(), INTERVAL 1 HOUR)
")

if [ "$CRITICAL_ERRORS" -gt 10 ]; then
  echo "⚠️ $CRITICAL_ERRORS kritiske fejl i sidste time!" | \
    mail -s "ALERT: Mange kritiske fejl" admin@tilbudgivern.dk
fi

# Tjek for mange 404 fejl (muligt DDoS eller broken links)
NOT_FOUND=$(mysql -u tilbuduser -p"${DB_PASSWORD}" tilbudgivern -sN -e "
  SELECT COUNT(*) 
  FROM system_logs 
  WHERE error_code='HTTP_404'
    AND created_at >= DATE_SUB(NOW(), INTERVAL 1 HOUR)
")

if [ "$NOT_FOUND" -gt 100 ]; then
  echo "⚠️ $NOT_FOUND 404 fejl i sidste time!" | \
    mail -s "ALERT: Mange 404 fejl" admin@tilbudgivern.dk
fi

✅ Test Det

1. Test HTTP Fejl Logging

# Test 404
curl http://localhost:4032/api/nonexistent

# Verificer log
mysql -u tilbuduser -p"${DB_PASSWORD}" tilbudgivern -e "
  SELECT * FROM system_logs 
  WHERE error_code='HTTP_404' 
  ORDER BY created_at DESC LIMIT 1\G
"

2. Test Frontend Error Logging

Åbn browser console og kør:

// Test JavaScript fejl
throw new Error('Test error from console');

// Test network fejl
fetch('/api/nonexistent').catch(console.error);

// Test custom fejl
import('./utils/errorLogger').then(module => {
  module.default.logCustomError('Test custom error');
});

3. Verificer Logs

# Se alle logs fra sidste time
mysql -u tilbuduser -p"${DB_PASSWORD}" tilbudgivern -e "
  SELECT id, level, category, error_code, message, created_at
  FROM system_logs 
  WHERE created_at >= DATE_SUB(NOW(), INTERVAL 1 HOUR)
  ORDER BY created_at DESC;
"

🎯 Benefits

✅ Proaktiv Fejlsøgning - Se fejl før brugere klager
✅ Bruger Insight - Hvilke brugere har problemer?
✅ Broken Link Detection - Find alle 404 links automatisk
✅ Session Monitoring - Optimér session timeout settings
✅ Frontend Stability - Se JavaScript fejl i produktion
✅ Network Issue Detection - Find API problemer hurtigt
✅ Complete Audit Trail - Fuld historik af alle fejl

🔐 Sikkerhed

⚠️ VIGTIGT:

  1. Rate Limiting på /api/client-errors endpoints (for at undgå spam)
  2. Authentication på admin endpoints i production
  3. Sanitize user input før logging (undgå injection)

Status: ✅ Komplet implementeret
Testet: ✅ Backend middlewares
Frontend: ⚠️ Skal integreres i React app
Dato: 14. november 2024