Warum erhalte ich einen CORS-Fehler, obwohl ich https://example.com zu meiner Zulassungsliste hinzugefügt habe?

CORS-Fehler: Zugriff trotz expliziter Zulassungsliste verweigert

Beim Versuch, Cross-Origin-Anfragen zwischen React, Node.js und Socket.IO zu aktivieren, wird der Fehler „Zugriff von origin „https://example.com“ wurde blockiert, obwohl ich „https://example.com/“ zugelassen habe. Trotz Hinzufügen der erforderlichen Berechtigungen bleibt der Fehler bestehen.

Ursache und Erklärung

Das Problem ist auf ein Missverständnis von Ursprungsheadern und akzeptierten Ursprüngen in CORS-Konfigurationen zurückzuführen.

Origin-Header-Trailing Schrägstrich

Web-Origin-Header enthalten keinen abschließenden Schrägstrich. Der Ursprung von „https://googledocs-clone-sbayrak.netlify.app/“ ist beispielsweise „https://googledocs-clone-sbayrak.netlify.app“. Das Hinzufügen eines abschließenden Schrägstrichs zum Ursprung (z. B. „https://googledocs-clone-sbayrak.netlify.app/“) ist ungültig.

Byte-für-Byte-Vergleich

CORS-Konfigurationen Verwenden Sie einen Byte-für-Byte-Vergleich, um festzustellen, ob der Ursprung der Anforderung mit dem zulässigen Ursprung übereinstimmt. In diesem Fall ist der zulässige Ursprung „https://googledocs-clone-sbayrak.netlify.app“, während der Ursprung der Anfrage „https://googledocs-clone-sbayrak.netlify.app/“ ist, was eine Nichtübereinstimmung darstellt .

Zulässigen Ursprung korrekt festlegen

Um das Problem zu beheben, passen Sie den zulässigen Ursprung in der CORS-Konfiguration so an, dass er mit dem genauen Ursprung ohne abschließenden Schrägstrich übereinstimmt:

cors: {
    origin: 'https://googledocs-clone-sbayrak.netlify.app'
}

Das obige ist der detaillierte Inhalt vonWarum erhalte ich einen CORS-Fehler, obwohl ich https://example.com zu meiner Zulassungsliste hinzugefügt habe?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!