Cross-Origin Resource Sharing (CORS) konfigurieren

Cross-Origin Resource Sharing (CORS) ist ein Mechanismus, der Interaktionen zwischen Ressourcen aus unterschiedlichen Quellen ermöglicht. Normalerweise wird dies verhindert, um böswilliges Verhalten zu unterbinden. Unter diesem Thema erfahren Sie, wie Sie CORS für einen Cloud Storage-Bucket konfigurieren.

Weitere Informationen zur CORS-Unterstützung in Cloud Storage finden Sie unter Cross-Origin Resource Sharing (CORS).

CORS für einen Bucket konfigurieren

Die CORS-Konfiguration für einen Bucket erfolgt anhand der Angabe von Informationen wie HTTP-Methoden und Quelldomains. Diese identifizieren die Arten von Anfragen, die akzeptiert werden. Sie können das gsutil-Befehlszeilentool, die XML API, die JSON API oder die Clientbibliotheken für Cloud Storage verwenden, um die CORS-Konfiguration für einen Bucket festzulegen.

Im folgenden Beispiel wird gezeigt, wie Sie CORS für einen Bucket namens example-bucket konfigurieren. Die CORS-Konfiguration wird dabei so festgelegt:

  • Anfragen von example.appspot.com werden zugelassen.
  • Anfragen, die die HTTP-Methode GET, HEAD oder DELETE verwenden, werden zugelassen.
  • Der Antwort-Header Content-Type kann für verschiedene Quellen freigegeben werden.
  • Bei Preflight-Anfragen kann der Browser 3.600 Sekunden (1 Stunde) lang Anfragen stellen, bevor die Preflight-Anfrage wiederholt werden muss.

gsutil

Verwenden Sie den Befehl gsutil cors, um CORS für einen Bucket zu konfigurieren:

gsutil cors set cors-json-file.json gs://example-bucket

Dabei ist cors-json-file.json eine lokale Datei mit folgendem Inhalt:

[
    {
      "origin": ["http://example.appspot.com"],
      "responseHeader": ["Content-Type"],
      "method": ["GET", "HEAD", "DELETE"],
      "maxAgeSeconds": 3600
    }
]

Sie können die CORS-Konfiguration eines Buckets auch mit dem Befehl gsutil cors abrufen:

gsutil cors get gs://example-bucket

Clientbibliotheken

Mithilfe der Clientbibliotheken für Cloud Storage können Sie die CORS-Konfiguration für einen Bucket programmatisch festlegen oder abrufen. Verwenden Sie hierzu zuerst den folgenden Referenzinhalt:

REST APIs

JSON API

Mit der Methode Buckets: insert der JSON API können Sie CORS für einen neuen Bucket konfigurieren. Wenn Sie CORS für einen vorhandenen Bucket konfigurieren möchten, verwenden Sie die Methode Buckets: patch. Im folgenden Beispiel wird die Methode Buckets: patch verwendet.

PATCH /storage/v1/b/example-bucket?fields=cors HTTP/1.1
Host: www.googleapis.com
Authorization: Bearer ya29.AHES6ZRVmB7fkLtd1XTmq6mo0S1wqZZi3-Lh_s-6Uw7p8vtgSwg
content-length: 132
accept: application/json
accept-encoding: gzip, deflate
content-type: application/json

{
  "location": "us-east-1",
  "storageClass": "regional",
  "cors": [
      {
          "maxAgeSeconds": "3600",
          "method": [
             "GET"
             "HEAD"
             "DELETE"
          ],
          "origin": [
             "http://example.appspot.com"
          ],
          "responseHeader":[
            "Content-Type"
         ]
      }
  ]
}

Mit der Methode Buckets: get können Sie die CORS-Konfiguration eines Buckets abrufen:

GET https://www.googleapis.com/storage/v1/b/example-bucket
Authorization: Bearer ya29.AHES6ZRVmB7fkLtd1XTmq6mo0S1wqZZi3-Lh_s-6Uw7p8vtgSwg

XML API

Konfigurieren Sie CORS für einen Bucket mithilfe der SET-Methode für Bucket-CORS der XML API.

PUT http://storage.googleapis.com/example-bucket?cors HTTP/1.1
Host: storage.googleapis.com
Content-Length: 412
Authorization: Bearer ya29.AHES6ZRVmB7fkLtd1XTmq6mo0S1wqZZi3-Lh_s-6Uw7p8vtgSwg

<?xml version="1.0" encoding="UTF-8"?>
<CorsConfig>
  <Cors>
    <Origins>
      <Origin>http://example.appspot.com</Origin>
    </Origins>
    <Methods>
      <Method>GET</Method>
      <Method>HEAD</Method>
      <Method>DELETE</Method>
    </Methods>
    <ResponseHeaders>
      <ResponseHeader>Content-Type</ResponseHeader>
    </ResponseHeaders>
    <MaxAgeSec>3600</MaxAgeSec>
  </Cors>
</CorsConfig>

Mit der GET-Methode für Bucket-CORS können Sie die CORS-Konfiguration eines Buckets abrufen:

GET http://storage.googleapis.com/example-bucket?cors HTTP/1.1
Host: storage.googleapis.com
Authorization: Bearer ya29.AHES6ZRVmB7fkLtd1XTmq6mo0S1wqZZi3-Lh_s-6Uw7p8vtgSwg

Fehler bei CORS-Anfragen beheben

Wenn beim Zugriff auf Cloud Storage-Buckets von einer anderen Quelle aus ein unerwartetes Verhalten auftritt, führen Sie die folgenden Schritte aus:

  1. Rufen Sie mit gsutil cors get die CORS-Konfiguration des Ziel-Buckets ab. Wenn Sie mehrere CORS-Konfigurationseinträge haben, achten Sie bei den folgenden Schritten darauf, dass die Anfragewerte Werten im selben CORS-Konfigurationseintrag zugeordnet sind.

  2. Überprüfen Sie mit dem Tool Ihrer Wahl eine Anfrage/Antwort. In einem Chrome-Browser können Sie mit den Standardentwicklertools folgende Informationen ansehen:

    1. Klicken Sie in der Symbolleiste des Browsers auf das Chrome-Menü (Chrome-Menüsymbol.).
    2. Wählen Sie Weitere Tools > Entwicklertools aus.
    3. Klicken Sie auf den Tab Netzwerk.
    4. Senden Sie die Anfrage von Ihrer Anwendung oder Befehlszeile aus.
    5. Suchen Sie die Anfrage im Bereich mit der Netzwerkaktivität.
    6. Klicken Sie in der Spalte Name auf die Anfrage.
    7. Im Tab Header werden die Antwortheader angezeigt. Unter Antwort sehen Sie den Inhalt der Antwort.

    Wenn Sie keine Anfrage und keine Antwort sehen, ist im Browsercache wahrscheinlich noch ein früherer fehlgeschlagener Preflight-Anfrageversuch gespeichert. Wenn Sie den Browsercache löschen, sollte auch der Preflight-Cache geleert werden. Ist dies nicht der Fall, legen Sie für MaxAgeSec in Ihrer CORS-Konfiguration einen niedrigeren Wert fest. Wenn Sie keinen Wert angeben, gilt als Standardwert 1.800 (30 Minuten). Warten Sie die Dauer des alten MaxAgeSec-Werts ab und wiederholen Sie anschließend die Anfrage. Dadurch wird eine neue Preflight-Anfrage ausgeführt. Diese ruft die neue CORS-Konfiguration ab und löscht die Cache-Einträge. Erhöhen Sie den Wert MaxAgeSec nach Beheben des Fehlers wieder, um den Preflight-Traffic zum Bucket zu reduzieren.

  3. Prüfen Sie, ob die Anfrage den Header Origin enthält und der Headerwert mindestens einem der Werte für Origins in der CORS-Konfiguration des Buckets entspricht. Das Schema, der Host und der Port der Werte müssen exakt übereinstimmen. Hier ein paar Beispiele für zulässige Übereinstimmungen:

    • http://origin.example.com entspricht http://origin.example.com:80, denn 80 ist der standardmäßige HTTP-Port, stimmt aber nicht mit https://origin.example.com, http://origin.example.com:8080, http://origin.example.com:5151 oder http://sub.origin.example.com überein.

    • https://example.com:443 entspricht https://example.com, aber nicht http://example.com oder http://example.com:443.

    • http://localhost:8080 entspricht nur http://localhost:8080 genau, nicht aber http://localhost:5555 oder http://localhost.example.com:8080.

  4. Prüfen Sie, ob die HTTP-Methode der Anfrage (bei einer einfachen Anfrage) oder die in Access-Control-Request-Method angegebene Methode (bei einer Preflight-Anfrage) mindestens einem der Methodenwerte (Methods) in der CORS-Konfiguration des Buckets entspricht.

  5. Prüfen Sie bei einer Preflight-Anfrage, ob diese einen oder mehrere Header der Form Access-Control-Request-Header enthält. Achten Sie in diesem Fall darauf, dass jeder Wert für Access-Control-Request-Header einem Wert für ResponseHeader in der CORS-Konfiguration des Buckets entspricht. Alle im Header Access-Control-Request-Header genannten Header müssen in der CORS-Konfiguration der Preflight-Anfrage enthalten sein, damit diese ausgeführt werden kann und CORS-Header in die Antwort aufgenommen werden.

Hat Ihnen diese Seite weitergeholfen? Teilen Sie uns Ihr Feedback mit:

Feedback geben zu...