Warum kann AJAX kein domänenübergreifendes HTML laden, wenn JSONP nicht verwendet wird, und wie kann das Problem gelöst werden?

Laden eines domänenübergreifenden Endpunkts mit AJAX

Problem:

Sie stoßen auf Schwierigkeiten beim Laden einer domänenübergreifenden HTML-Seite mit AJAX, es sei denn, der dataType ist auf „jsonp“ gesetzt. Selbst bei Verwendung von JSONP erwartet der Browser einen Skript-MIME-Typ, empfängt aber stattdessen „text/html“.

Lösung 1: Verwendung von Drittanbieter-Proxys

Aus Sicherheitsgründen Da wir Bedenken haben, dass Drittanbieter-Proxys Benutzerdaten verfolgen, wird von deren Verwendung mit privaten Informationen abgeraten. Sie können jedoch für öffentliche Datenszenarien geeignet sein.

Berücksichtigen Sie die folgenden Proxy-Optionen:

• CORS Anywhere: Fügt automatisch CORS-Header zu Proxy-Anfragen hinzu.

$.ajaxPrefilter(function (options) {
  if (options.crossDomain && jQuery.support.cors) {
    var http = (window.location.protocol === 'http:' ? 'http:' : 'https:');
    options.url = http + '//cors-anywhere.herokuapp.com/' + options.url;
  }
});

• Was auch immer Herkunft: Erleichtert den domänenübergreifenden JSONP-Zugriff.

$.ajaxSetup({
  scriptCharset: "utf-8",
  contentType: "application/json; charset=utf-8"
});

$.getJSON('http://whateverorigin.org/get?url=' +
  encodeURIComponent('http://google.com') + '&callback=?',
  function (data) {
    console.log("> ", data);
    $("#viewer").html(data.contents);
  }
);

• CORS-Proxy: Vereinfacht CORS-Anfragen für jede Website.

$.get(
  'http://www.corsproxy.com/' +
  'en.wikipedia.org/wiki/Cross-origin_resource_sharing',
  function (response) {
    console.log("> ", response);
    $("#viewer").html(response);
  }
);

Lösung 2: Einrichten Ihres Backends Proxy

Der sicherste Ansatz besteht darin, einen Proxy im Back-End zu erstellen, um das domänenübergreifende Problem zu lösen.

Das obige ist der detaillierte Inhalt vonWarum kann AJAX kein domänenübergreifendes HTML laden, wenn JSONP nicht verwendet wird, und wie kann das Problem gelöst werden?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!