Analisis mendalam prinsip JSONP merentas domain_Pengetahuan asas

var eleScript= document.createElement("skrip");
eleScript.type = "text/javascript";
eleScript.src = "http://example2.com/getinfo.php";
document.getElementsByTagName("HEAD")[0].appendChild(eleScript);

var qsData = {'searchWord':$("#searchWord").attr("value"),'currentUserId':
$("#currentUserId").attr("value"),'conditionBean.pageSize':$("#pageSize").attr("value")};
$.ajax({
async:false,
URL: http://cross-domain dns/document!searchJSONResult.action,
Taip: "DAPAT",
Jenis Data: 'jsonp',
jsonp: 'jsoncallback',
Data: qsData,
Tamat masa: 5000,
beforeSend: function(){
//Kaedah ini tidak dicetuskan dalam mod jsonp Sebabnya mungkin jika dataType ditentukan sebagai jsonp, ia bukan lagi acara ajax
},
Kejayaan: fungsi (json) {//Fungsi panggil balik yang dipratakrifkan oleh jquery pada bahagian klien Selepas berjaya mendapatkan data json pada pelayan merentas domain, fungsi panggil balik ini akan dilaksanakan secara dinamik
. If(json.actionErrors.length!=0){
alert(json.actionErrors);            }
genDynamicContent(qsData,type,json); },
Lengkap: fungsi(XMLHttpRequest, textStatus){
          $.unblockUI({ fadeOut: 10 }); },
ralat: function(xhr){
//Kaedah ini tidak dicetuskan dalam mod jsonp Sebabnya mungkin jika dataType ditentukan sebagai jsonp, ia bukan lagi acara ajax
//Minta pengendalian ralat
alert("Ralat permintaan (sila semak status rangkaian yang berkaitan.)"); }
});




Kadang-kadang anda akan melihatnya ditulis seperti ini:

// Laksanakan kod
}
});



Kaedah ini sebenarnya ialah enkapsulasi lanjutan bagi api $.ajax({..}) dalam contoh di atas Beberapa parameter asas api $.ajax dirangkumkan dan tidak kelihatan.

Verwenden Sie auf der Antwortseite (http://cross-domain dns/document!searchJSONResult.action) jsoncallback = request.getParameter("jsoncallback"), um den Namen der js-Funktion abzurufen, der später auf der Jquery-Seite zurückgerufen werden soll : jsonp1236827957501 und dann der Inhalt der Antwort Für ein Skript-Tags: „jsonp1236827957501(“ JSON-Array gemäß Anforderungsparametern generiert)“; erreicht den Zweck des domänenübergreifenden Datenaustauschs.

JSONP-Prinzip

Das grundlegendste Prinzip von JSONP besteht darin, dynamisch ein <script>-Tag hinzuzufügen, und das src-Attribut des script-Tags unterliegt keinen domänenübergreifenden Einschränkungen. Auf diese Weise hat diese domänenübergreifende Methode nichts mit dem Ajax-XmlHttpRequest-Protokoll zu tun. </p> <p>Auf diese Weise ist „jQuery AJAX Cross-Domain-Problem“ zu einer falschen Aussage geworden. Der Name der jquery $.ajax-Methode ist irreführend. </p> <p>Wenn diese $.ajax-Methode auf dataType: 'jsonp' festgelegt ist, hat sie nichts mit Ajax XmlHttpRequest zu tun und wird durch das JSONP-Protokoll ersetzt. JSONP ist ein inoffizielles Protokoll, das die Integration von Skript-Tags auf der Serverseite und deren Rückgabe an den Client ermöglicht und so einen domänenübergreifenden Zugriff in Form von Javascript-Rückrufen ermöglicht. </p> <p>JSONP ist JSON mit Padding. Aufgrund der Einschränkungen der Same-Origin-Richtlinie darf XmlHttpRequest nur Ressourcen von der aktuellen Quelle (Domänenname, Protokoll, Port) anfordern. Wenn wir eine domänenübergreifende Anfrage stellen möchten, können wir eine domänenübergreifende Anfrage stellen, indem wir das Skript-Tag von HTML verwenden und den auszuführenden Skriptcode in der Antwort zurückgeben, wobei das Javascript-Objekt direkt mit JSON übergeben werden kann. Diese domänenübergreifende Kommunikationsmethode heißt JSONP. </p> <p>jsonCallback-Funktion jsonp1236827957501(...): Sie wird vom Browser-Client registriert, nachdem die JSON-Daten auf dem domänenübergreifenden Server abgerufen wurden </p>Der Ausführungsprozess von Jsonp ist wie folgt: <p> </p>Registrieren Sie zunächst einen Rückruf (z. B. „jsoncallback“) auf dem Client und übergeben Sie dann den Rückrufnamen (z. B. jsonp1236827957501) an den Server. Hinweis: Nachdem der Server den Rückrufwert erhalten hat, muss er jsonp1236827957501(...) verwenden, um den auszugebenden JSON-Inhalt einzuschließen. Zu diesem Zeitpunkt können die vom Server generierten JSON-Daten korrekt vom Client empfangen werden. <p> </p>Verwenden Sie dann die Javascript-Syntax, um eine Funktion zu generieren. Der Funktionsname ist der Wert des übergebenen Parameters „jsoncallback“ jsonp1236827957501.<p> </p>Schließlich werden die JSON-Daten direkt als Parameter in die Funktion eingefügt, wodurch ein JS-Syntaxdokument generiert und an den Client zurückgegeben wird. <p> </p>Der Client-Browser analysiert das Skript-Tag und führt das zurückgegebene Javascript-Dokument aus. Zu diesem Zeitpunkt werden die Javascript-Dokumentdaten als Parameter an die vom Client vordefinierte Rückruffunktion übergeben (z. B. die jquery-Methode $.ajax()). das obige Beispiel) Gekapselter Erfolg: Funktion (json)). <p> </p>Man kann sagen, dass die JSONP-Methode im Prinzip mit <script src="http://cross-domain/...xx.js"></script> übereinstimmt (qq space verwendet diese Methode). umfangreich, um einen domänenübergreifenden Datenaustausch zu erreichen). JSONP ist ein Skript-Injection-Verhalten und birgt daher bestimmte Sicherheitsrisiken.

Warum

warum unterstützt jquery dann kein domänenübergreifendes Posten?

Obwohl die Verwendung von Post zum dynamischen Generieren von IFrames den Zweck einer domänenübergreifenden Post erreichen kann (so hat ein JS-Experte jquery1.2.5 gepatcht), ist dies eine relativ extreme Methode und wird nicht empfohlen.

Man kann auch sagen, dass die domänenübergreifende Get-Methode legal ist und die Post-Methode aus Sicherheitsgründen als illegal gilt. Es ist am besten, als letzten Ausweg nicht den falschen Ansatz zu wählen.

Die Nachfrage nach domänenübergreifendem Zugriff auf der Clientseite scheint die Aufmerksamkeit von w3c geweckt zu haben. Den Informationen zufolge unterstützt der html5-WebSocket-Standard den domänenübergreifenden Datenaustausch und soll eine optionale Lösung für den domänenübergreifenden Datenaustausch sein in der Zukunft.

Nehmen wir ein supereinfaches Beispiel: