Warum erhalte ich die Meldung „Origin null ist durch Access-Control-Allow-Origin nicht zulässig', wenn ich Bilder über AJAX von einer file://-URL abrufe?

Fehler: „Origin null ist durch Access-Control-Allow-Origin nicht zulässig“ beim Anfordern von file:// URL

In Beim Versuch, Bilder von Panoramio über AJAX abzurufen, tritt in Chrome ein wiederkehrender Fehler auf: „XMLHttpRequest kann [Panoramio API nicht laden URL]. Origin null ist durch Access-Control-Allow-Origin nicht zulässig. Dieser Fehler ist auf die folgenden zugrunde liegenden Probleme zurückzuführen:

1. Falsch konfigurierter Anforderungstyp:
   Im ursprünglichen Code wurde der Anforderungstyp nicht als JSONP angegeben. Anschließend verwendete jQuery XMLHttpRequest, das für domänenübergreifende Anforderungen auf Cross-Origin Resource Sharing (CORS) setzt. Allerdings unterstützen Browser CORS nur mit Serverautorisierung über den Access-Control-Allow-Origin-Header.
2. Null Origin from file:// URL:
   Wie der Code ausgeführt wurde von eine file://-URL, ein Null-Origin-Header wurde generiert. Dieser Null-Ursprung kann nicht vom Server zurückgegeben werden, was zu einem Autorisierungsfehler führt.

Lösung:

Um diese Probleme zu beheben, nehmen Sie die folgenden Korrekturen vor:

1. Verwenden Sie $.getJSON mit callback=?:
   Anstelle von $.get, $.getJSON verwenden und callback= anhängen? zur Anfrage-URL. Dies signalisiert jQuery, JSONP zu verwenden, wodurch der Anforderungstyp automatisch auf „jsonp“ gesetzt wird.
2. HTTP-Protokoll sicherstellen:
   Stellen Sie sicher, dass der Code von einer HTTP-URL ausgeführt wird (http: //) anstelle von file://. Dadurch kann CORS ordnungsgemäß funktionieren.

Überarbeiteter Code:

$.getJSON('http://www.panoramio.com/wapi/data/get_photos?v=1&key=dummykey&tag=test&offset=0&length=20&minx=-30&miny=0&maxx=0&maxy=150&callback=?', function (data) {
  // Process data
});

Tipps zur Fehlerbehebung:

• Stellen Sie sicher, dass die JSONP-Syntax (z. B. URL enthält callback=?) für $.get vorhanden ist Anfragen.
• Verwenden Sie HTTP-URLs für ursprungsübergreifende XMLHttpRequest-Anfragen.
• Überprüfen Sie die Browserunterstützung für CORS (z. B. Opera und Internet Explorer unterstützen sie möglicherweise nicht vollständig).

Das obige ist der detaillierte Inhalt vonWarum erhalte ich die Meldung „Origin null ist durch Access-Control-Allow-Origin nicht zulässig', wenn ich Bilder über AJAX von einer file://-URL abrufe?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!