Wie ermöglicht der Header „Access-Control-Allow-Origin' Cross-Origin Resource Sharing (CORS)?

Entmystifizierung des „Access-Control-Allow-Origin“-Headers in CORS

Cross-Origin Resource Sharing (CORS) ermöglicht den Zugriff von JavaScript-Code, der von einem Ursprung geladen wird, auf Ressourcen aus einem anderen Ursprung. Es ist von entscheidender Bedeutung zu verstehen, wie der Header „Access-Control-Allow-Origin“ diesen Cross-Origin-Zugriff erleichtert.

Wie „Access-Control-Allow-Origin“ funktioniert

Wenn ein Client eine Wenn eine Ressource von einem anderen Ursprung stammt, kann der Server mit einem „Access-Control-Allow-Origin“-Header antworten. Dieser Header gibt an, welche Ursprünge auf die Ressource zugreifen dürfen. Das Standardverhalten besteht darin, alle Cross-Origin-Anfragen abzulehnen.

Um den Cross-Origin-Zugriff zu ermöglichen, muss der Server der Antwort den Header „Access-Control-Allow-Origin“ hinzufügen. Der Wert dieses Headers kann entweder eine bestimmte Domäne (z. B. „http://siteB.com“) oder „*“ sein, was angibt, dass jeder Ursprung auf die Ressource zugreifen darf.

Nicht einfache Handhabung Anfragen

Bei nicht einfachen Anfragen, die typischerweise andere HTTP-Methoden als GET oder POST oder nicht standardmäßige Anfrageheader beinhalten, sendet der Browser zunächst eine Preflight-OPTIONS-Anfrage. Diese Anfrage überprüft, ob der Server die beabsichtigte Anfrage akzeptiert.

Wenn der Server auf die OPTIONS-Anfrage mit den entsprechenden Headern „Access-Control-Allow-Headers“ und „Access-Control-Allow-Methods“ antwortet, wird die Der Browser fährt mit der eigentlichen Anfrage fort.

Beispielverwendung

Beachten Sie Folgendes Szenario:

Site A: https://siteA.com
Site B: https://siteB.com

An Aktivieren Sie den von Site A heruntergeladenen JavaScript-Code, um auf Ressourcen auf Site B zuzugreifen:

1. Site A: Rufen Sie die ab JavaScript-Code von Site B:

fetch('https://siteB.com/myCode.js')
  // ...

2. Site B: Stellen Sie „myCode.js“ mit dem Header „Access-Control-Allow-Origin“ bereit:

Access-Control-Allow-Origin: https://siteA.com

3. JavaScript (Site A): Das JavaScript Code kann jetzt Anfragen an Site B stellen:

fetch('https://siteB.com/api/data')
  // ...

Wenn Sie verstehen, wie der Header „Access-Control-Allow-Origin“ funktioniert, können Sie die ursprungsübergreifende gemeinsame Nutzung von Ressourcen effektiv aktivieren und so sicherstellen, dass JavaScript Code kann nahtlos auf Ressourcen unterschiedlicher Herkunft zugreifen.

Das obige ist der detaillierte Inhalt vonWie ermöglicht der Header „Access-Control-Allow-Origin' Cross-Origin Resource Sharing (CORS)?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!