it-swarm.com.de

CORS-Setup mit ReactJS Fetch API

Ich habe eine ReactJS-App, die eine externe API-URL mit der folgenden Struktur abruft.

fetch(url) // or fetch(url, {mode:'cors'})
  .then(response => response.json())
  .then(data => {

Wenn in meinem Browser versucht wird, die Komponente zu rendern, wird die folgende Fehlermeldung angezeigt

Fehler beim Laden https: // XXXXX/jsondata : In der angeforderten Ressource ist kein Header 'Access-Control-Allow-Origin' vorhanden. Origin ' http: // localhost: 808 ' ist daher kein Zugriff gestattet. Wenn eine undurchsichtige Antwort Ihren Anforderungen entspricht, setzen Sie den Anforderungsmodus auf "no-cors", um die Ressource mit deaktiviertem CORS abzurufen.

Daher recherchiere ich, wie CORS in Drupal 8 aktiviert werden kann, und das Ausprobieren für verschiedene Konfigurationen hat nicht funktioniert.

Dies ist meine aktuelle cors.config Unter services.yml Datei

  cors.config:
    enabled: true
    # Specify allowed headers, like 'x-allowed-header'.
    allowedHeaders: ['x-csrf-token','authorization','content-type','accept','Origin','x-requested-with', 'access-control-allow-Origin','x-allowed-header','*']
    # Specify allowed request methods, specify ['*'] to allow all possible ones.
    allowedMethods: ['*'] // or ['POST', 'GET', 'OPTIONS', 'DELETE', 'PUT', 'PATCH']
    # Configure requests allowed from specific origins.
    allowedOrigins: ['https://XXXX/','*']
    # Sets the Access-Control-Expose-Headers header.
    exposedHeaders: true // or false
    # Sets the Access-Control-Max-Age header.
    maxAge: false // or 1000
    # Sets the Access-Control-Allow-Credentials header.
    supportsCredentials: true // or false

Ich habe versucht, eine erstaunliche Chrome - Erweiterung zu installieren, die diesen Fehler behebt, aber dies funktioniert natürlich nur auf meinem Gerät.

Ich bin nicht ganz sicher, aber ist dies etwas, um die Drupal CORS-Konfiguration zu ändern oder Access-Control-Allow-Origin Auf der API-URL-Seite zuzulassen ( https: // XXXX )?

2

Ich möchte nur meine eigene Frage beantworten. Nachdem ich mehr Dokumentation über die Funktionsweise von CORS gelesen hatte, stellte ich fest, dass CORS auf der anderen Partei aktiviert sein muss, nicht auf der Drupal Site selbst, damit Drupal auf eine andere Site/einen anderen Server zugreifen kann. Einige grundlegende Erklärungen finden Sie auch hier. https://stackoverflow.com/questions/10636611/how-does-access-control-allow-Origin-header-work/10636765#10636765

1