Fetch im „No-Cors“-Modus verwenden
Die Fetch-API bietet eine bequeme Möglichkeit, Anfragen an Server zu stellen. Beim ursprungsübergreifenden Zugriff auf Ressourcen kann jedoch die Fehlermeldung „Auf der angeforderten Ressource ist kein ‚Access-Control-Allow-Origin‘-Header vorhanden“ auftreten. Dieser Fehler weist auf eine durch die Same-Origin-Richtlinie auferlegte Sicherheitsbeschränkung hin.
Um CORS in Fetch zu deaktivieren, ist es verlockend, die Option { mode: 'no-cors' } zu verwenden. Dieser Ansatz ist jedoch falsch und unerwünscht.
'No-Cors'-Modus: Ein Fehltritt
Der 'No-Cors'-Modus verhindert im Wesentlichen, dass der Browser auf die Antwort zugreift Körper und Überschriften. Dies bedeutet, dass Ihr Code die abgerufenen Daten nicht verarbeiten oder verwenden kann. Es ist wichtig zu verstehen, dass die Deaktivierung von CORS nicht die Same-Origin-Richtlinie außer Kraft setzt. Es wirkt sich nur darauf aus, wie der Browser die Antwort verarbeitet.
Die Lösung: CORS-Proxy
Anstatt CORS zu deaktivieren, sollten Sie einen CORS-Proxy verwenden. Ein Proxy fungiert als Vermittler zwischen Ihrem Frontend-Code und dem Zielserver. Wenn Sie eine Anfrage über einen Proxy senden, leitet dieser die Anfrage an den Server weiter, empfängt die Antwort und fügt den erforderlichen Access-Control-Allow-Origin-Header hinzu, bevor er ihn an Ihren Code zurückgibt. Dadurch kann Ihr Code ursprungsübergreifend auf die Antwort zugreifen.
Um einen CORS-Proxy einzurichten, können Sie vorhandene Dienste nutzen oder Ihren eigenen Proxy über Plattformen wie Heroku bereitstellen.
Verstehen Cross-Origin-Anfragen
Es ist wichtig zu beachten, dass Browser Einschränkungen auferlegen, auch wenn Sie in Postman ursprungsübergreifend auf Ressourcen zugreifen können Frontend-Code, der in Web-Apps ausgeführt wird. Um den ursprungsübergreifenden Ressourcenzugriff sicherzustellen, muss die Antwort den Access-Control-Allow-Origin-Header enthalten.
Undurchsichtige Antworten: Vorbehalte
Während „no-cors“ Der Modus deaktiviert CORS, erzeugt aber auch undurchsichtige Antworten. Für undurchsichtige Antworten gelten bestimmte Einschränkungen, darunter:
