Der Zugriff von Origin „https://example.com“ wurde blockiert, obwohl ich „https://example.com/“ zugelassen habe

Beim Versuch, ursprungsübergreifend auf eine Ressource zuzugreifen, stoßen Entwickler häufig auf Probleme im Zusammenhang mit dem Access-Control-Allow-Origin-Header. Der Schlüssel zur Lösung dieser Probleme liegt im Verständnis der genauen Bedeutung von „Ursprung“ im Kontext des CORS-Protokolls.

Das Konzept des Ursprungs in CORS

In CORS, ein Ursprung ist eine Kombination aus einem Schema, einem Host (Domäne) und einem Port. Wichtig ist, dass es keinen Pfad enthält. Daher gelten die folgenden zwei Ursprünge als unterschiedlich:

• https://example.com
• https://example.com/path/to/resource

Das Problem: Abschließende Schrägstriche in Ursprüngen

Das Problem in diesem speziellen Fall ergibt sich aus einem Missverständnis der Definition des Ursprungs. Insbesondere ist der abschließende Schrägstrich im zulässigen Ursprung gemäß den CORS-Protokollspezifikationen nicht zulässig. Infolgedessen stimmt der vom Browser gesendete Ursprungsheader (ohne den abschließenden Schrägstrich) nicht mit dem auf dem Server konfigurierten zulässigen Ursprung überein.

Lösung: Entfernen Sie den abschließenden Schrägstrich vom zulässigen Ursprung

Um dieses Problem zu beheben, entfernen Sie einfach den abschließenden Schrägstrich aus dem zulässigen Ursprungswert in Ihrer CORS-Konfiguration. In diesem Fall wäre der korrekte zulässige Ursprung:

• https://googledocs-clone-sbayrak.netlify.app

Mit dieser Änderung der Ursprungsheader des Browsers stimmt mit dem zulässigen Ursprung überein und CORS wird erfolgreich zugelassen.