RSS DEV-Gemeinschaft
Folgen
CORS hat mich fast zerstört, aber Preflight rettete den Tag
Der Autor hat zunächst ein Frontend-Backend-System mit S3 für das Frontend, Apollo GraphQL für das Backend und API Gateway dazwischen eingerichtet. Dabei traten Fehler beim Cross-Origin-Ressourcenfreigabe (CORS) auf, die verhinderten, dass Frontend-Anfragen das Backend erreichten. Der Browser blockierte Anfragen aufgrund mangelndem Vertrauen und Sicherheitsprotokollen. CORS ist jedoch kein Fehler, sondern ein eingebauter Sicherheitsmechanismus, der Anfragen zwischen verschiedenen Ursprüngen einschränkt. Der Browser sendet eine OPTIONS-Anfrage für Vorbereitungsprüfungen vor den tatsächlichen Anfragen. Wenn der Server oder das API Gateway während der Vorbereitungsprüfung nicht korrekt antwortet, blockiert der Browser die Anfrage. Die Lösung bestand darin, OPTIONS-Anfragen im API Gateway korrekt zu handhaben. Das Backend erlaubte dann explizit die Frontend-Domäne über Umgebungsvariablen. Beim Debuggen von CORS-Problemen muss die Vorbereitungsanfrage im Netzwerk-Tab überprüft werden. Eine ordnungsgemäße Handhabung der Vorbereitungsanfrage und der Backend-Domänenberechtigung löste die CORS-Probleme.
