CORS

Übungsaufgaben zum API-Client aus OpenAPI: Ursprung und CORS, Mitfahrgesuche laden, Proxy-Fehler finden

Die Web-App des Mitfahrlabors soll die Mitfahrgesuche vom Backend laden. In diesen Übungen bestimmst Du Ursprünge und bringst den Ablauf einer CORS-Anfrage mit Vorabanfrage in die richtige Reihenfolge, erweiterst den Vertrag um die Gesuche, erzeugst den Client neu und lädst die Gesuche test-first mit Mock Service Worker samt Lade- und Fehlerzuständen. Zum Schluss findest Du CORS- und Proxy-Fehler anhand der Meldungen in Konsole, Netzwerkanalyse und Terminal.

API-Client aus OpenAPI: Die Vue-App holt ihre Fahrten vom Backend – mit Vite-Proxy, CORS und Mock Service Worker

Die Fahrtensuche des Mitfahrlabors holt ihre Fahrten jetzt vom Spring-Boot-Backend. Aus dem Vertrag openapi.yaml erzeugt ein Generator TypeScript-Typen und eine Funktion je Operation. Der Proxy des Vite-Entwicklungsservers sorgt dafür, dass App und API für den Browser denselben Ursprung haben; wann stattdessen CORS greift, zeigt der Vergleich beider Wege samt typischer Fehlermeldungen. Integrationstests mit Mock Service Worker (MSW) prüfen Komponente, Fachlogik und Client gegen ein nachgebildetes Backend, auch Lade- und Fehlerzustände.

Systemtest und Abnahmetest: Die ganze Anwendung über HTTP prüfen mit RestTestClient

Bisher hat jeder Test nur einen Ausschnitt der Anwendung gestartet. Jetzt läuft das Mitfahr-Backend vollständig mit Tomcat und Datenbank, und RestTestClient schickt echte HTTP-Anfragen. Ein Systemtest prüft jede Antwort gegen den API-Vertrag openapi.yaml, ein Abnahmetest jedes Abnahmekriterium der User Stories aus Artikel 01. Beide finden je eine echte Lücke. Dazu kommen ein Abnahmeprotokoll, CORS für Browser-Frontends und eine eigene Stufe in der Pipeline.