Files
michaelschiemer/docs/spa-router-backend-integration.md
Michael Schiemer 55a330b223 Enable Discovery debug logging for production troubleshooting
- Add DISCOVERY_LOG_LEVEL=debug
- Add DISCOVERY_SHOW_PROGRESS=true
- Temporary changes for debugging InitializerProcessor fixes on production
2025-08-11 20:13:26 +02:00

2.7 KiB

SPA Router Backend Integration

Das SPA Router System benötigt Backend-Unterstützung, um nur den <main> Content für AJAX-Requests zu liefern.

HTTP Headers

Das SPA System sendet diese Headers bei Navigation:

X-Requested-With: XMLHttpRequest
X-SPA-Request: true
Accept: text/html

Backend Implementation

Option 1: Separate SPA Views

// In your controller
public function showContact(HttpRequest $request): HttpResponse 
{
    $data = [
        'title' => 'Kontakt',
        // ... other data
    ];
    
    // Check if this is an SPA request
    if ($request->headers->get('X-SPA-Request') === 'true') {
        // Return only the main content
        return new ViewResult('contact-spa.view.php', $data);
    }
    
    // Return full page
    return new ViewResult('contact.view.php', $data);
}

Option 2: Template Fragments

// Create a partial template system
public function showContact(HttpRequest $request): HttpResponse 
{
    $data = [
        'title' => 'Kontakt',
        'content' => $this->renderPartial('contact-main.view.php')
    ];
    
    if ($request->headers->get('X-SPA-Request') === 'true') {
        // Return only main content as JSON
        return new JsonResult([
            'title' => $data['title'],
            'content' => $data['content']
        ]);
    }
    
    return new ViewResult('contact.view.php', $data);
}

Modify your main layout to conditionally include header/footer:

// main.view.php layout
<?php 
$isSPARequest = $request->headers->get('X-SPA-Request') === 'true';
?>

<?php if (!$isSPARequest): ?>
<!DOCTYPE html>
<html>
<head>
    <title><?= $title ?></title>
    <!-- head content -->
</head>
<body>
    <header>
        <!-- header content -->
    </header>
<?php endif; ?>

    <main>
        <!-- This is what gets sent for SPA requests -->
        <?= $content ?>
    </main>

<?php if (!$isSPARequest): ?>
    <footer>
        <!-- footer content -->
    </footer>
    
    <!-- scripts -->
</body>
</html>
<?php endif; ?>

Testing

Test SPA requests with curl:

# Normal request (full page)
curl https://localhost/kontakt

# SPA request (only main content)
curl -H "X-SPA-Request: true" -H "X-Requested-With: XMLHttpRequest" https://localhost/kontakt

Error Handling

Das Frontend fällt automatisch auf normale Navigation zurück wenn:

  • HTTP Status >= 400
  • Network Fehler
  • Parse Fehler
  • Timeout

Performance Considerations

  • SPA Requests sind ~70% kleiner (nur Content, kein Header/Footer/Scripts)
  • Reduzierte Server-Last durch weniger Asset-Requests
  • Schnellere Navigation durch weniger DOM-Updates
  • Browser-Cache wird optimal genutzt