Zwei Möglichkeiten zur Implementierung von Cross-Domänen-Anfragen: JSONP und CORS detaillierte Erläuterung

1. Der Hintergrund der Cross-Domänen-Datenübertragung

Cross-Domänen-Datenanfragen sind eine häufige Voraussetzung für die moderne Front-End-Entwicklung. Aufgrund der Sicherheitsrichtlinienbeschränkungen des Browsers kann die Seite keine direkten Daten aus verschiedenen Domänennamen, Protokollen oder Ports erhalten, und die Cross-Domänen-Kommunikation ist zu einem dringenden Problem geworden, das gelöst werden muss. In diesem Artikel werden die Implementierungsmethoden zweier Mainstream-Cross-Domänen-Übertragungslösungen rund um die PHP-Sprache eingeführt.

2. Verstehen Sie die gleiche Originalstrategie

"Gleichorientische Politik" ist ein wichtiger Mechanismus, der von Browsern verwendet wird, um die Sicherheit zu gewährleisten. Das Protokoll, der Domänenname und der Port der Seite müssen mit der aktuellen Seite übereinstimmen, um normal auf die Serverressourcen zuzugreifen. Wenn die Seitenadresse beispielsweise lautet: http://www.example.com/index.html, dann:

• Das Protokoll muss HTTP sein
• Der Domain -Name muss www.example.com sein
• Der Port muss der Standard 80 sein (wenn der Port nicht deklariert ist)

3. Verwenden Sie JSONP für Cross-Domain-Anfragen

JSONP (JSON with Padding) ist eine Cross-Domänen-Datenerfassungsmethode, die auf Skript-Tags basiert. Da das Skript-Tag nicht durch die gleichorientierte Richtlinie eingeschränkt wird, kann es verwendet werden, um Daten aus anderen Domainnamen anzufordern und dann den Rückgabewert über die Rückruffunktion zu erhalten.

 <script type="text/javascript">
    function jsonpCallback(data){
        alert(data);
    }
</script>
<script type="text/javascript" src="http://www.domain2.com/data.php?callback=jsonpCallback"></script>

Der PHP -Code auf der Serverseite lautet wie folgt:

 <?php
$data = array('name' => 'Q.syr', 'age' => 24);
echo $_GET['callback'] . '(' . json_encode($data) . ')';
?>

Diese Methode unterstützt nur GET -Anfragen und ist einfach zu bedienen, verfügt aber auch Sicherheitsrisiken wie das Risiko von XSS -Angriffen.

V.

CORs (Cross-Origin-Ressourcenfreigabe) ist ein vom W3C formulierter Standard. Es ermöglicht den Servern, zu erklären, welche Domainnamen auf Ressourcen zugreifen können, indem sie die Antwortheader einstellen. Es ist derzeit eine sicherere und allgemeinere Cross-Domänen-Verarbeitungsmethode.

4.1 PHP implementiert den CORS -Antwortheader

 header('Access-Control-Allow-Origin:*');
header('Access-Control-Allow-Methods:POST,GET');
header('Access-Control-Allow-Headers:x-requested-with,content-type');

veranschaulichen:

• Access-Control-Allow-Origin : Die Quelle, die zugreifen darf, * bedeutet, dass alle Domänen zugänglich sind
• Zugriffskontroll-Blocken-Methoden : Erlaubte HTTP-Methoden
• Access-Control-Allow-Header : Erlungene Anfrage-Header-Feld

4.2 Das Front-End verwendet XMLHTTPrequest, um Cross-Domain-Anfragen zu implementieren

 var xmlhttp = new XMLHttpRequest();
xmlhttp.onreadystatechange = function(){
    if(xmlhttp.readyState == 4 && xmlhttp.status == 200){
        var responseText = xmlhttp.responseText;
        console.log(responseText);
    }
}
xmlhttp.open('GET', 'http://www.domain2.com/data.php', true);
xmlhttp.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
xmlhttp.send();

Diese Methode unterstützt mehrere HTTP -Methoden und ist sehr sicher, aber das Backend muss mit der Festlegung des Antwortheaders zusammenarbeiten.

5. Vergleich zwischen JSONP und CORS

Die beiden Methoden haben ihre eigenen Eigenschaften:

• JSONP: Die Implementierung ist einfach, es ist keine Serverkonfiguration erforderlich und unterstützt nur GET -Anforderungen. Es gibt Sicherheitsrisiken.
• CORS: Standardmethode, unterstützt mehrere Anforderungsarten und Authentifizierungsmechanismen mit hoher Sicherheit. Benötigt die Konfiguration der Backend -Antwort -Header.

6. Zusammenfassung

In diesem Artikel werden zwei Mainstream-Lösungen für PHP ausführlich erklärt, um die Cross-Domänen-Kommunikation-JSONP und CORS zu implementieren. Entwickler können die am besten geeignete Implementierungsmethode basierend auf den tatsächlichen Anforderungen des Projekts, der Browserkompatibilität, der Sicherheit und anderer Faktoren auswählen. Wenn Sie Sicherheit und Flexibilität verfolgen, wird empfohlen, der CORS-Methode für die Cross-Domänen-Verarbeitung Vorrang zu geben.