Kürzlich traf Ajax bei einem Webservice auf Probleme mit der Domänen. Suchen Sie online nach Informationen und fasste sie wie folgt zusammen (viele von ihnen denken, dass sie sie gut kopiert haben)
<< Verwenden Sie JSON, um Daten zu übertragen, und verlassen Sie sich auf JSONP auf Cross-Domain >>
Zunächst werde ich meinen implementierten Code hinzufügen:
Front-End-Code:
$ .ajax ({type: "get", url: "http: //localhost/service1.asmx/getelevatorstatusjsondata? JsonCallback =?", Datentyp: "jsonp", jsonp: "json", "data:", function: function (result) (result) {var daten) (var data) (var data); {alert (Daten [i] .ID + "-" + Daten [i] .Name);Servercode:
/// <summary> /// statusdateninformationen abrufen //// </summary> /// <returns> </returns> [webmethod] public void getelevatorStatusjsondata () {list <list <list <deviceInfo >> Elevatordatas = new List <List <RectorInfo> (); LIST <SendDicDate> SearchList = XmlSerializeHelper.xmldeserializeFromFile <Liste <sendDicDate >> (@configUtil.ServicePath + configUtil.getConfigbyKey ("xmlPath") + "Abfragegetationsinformationen.xml", codcoding.utf8); foreach (sendDicDate item in SearchList) {String key = item.portno + "-" + item.bordRate + "-" + item.sendType; Liste <DectorInfo> deviceInfolist = (list <deviceInfo>) context.cache.get (Schlüssel); ELEFATORDATAS.ADD (DeviceInfolist); } String result = ""; DataContractJsonSonializer json = new DataContractJsonSserializer (Elevatordatas.gettType ()); use (memoryStream stream = new memoryStream ()) {json.writeObject (stream, elevatordatas); result = coding.utf8.getString (stream.toArray ()); } String jsoncallback = httpcontext.current.request ["jsoncallback"]; result = jsoncallback + '(' + result + ')'; Httpcontext.current.response.write (Ergebnis); Httpcontext.current.response.end (); }C#
Das obige ist der Implementierungscode, der den C# -Server aufruft, und das Folgende ist die Java -Seite. Die Parameter mögen unterschiedlich sein, aber die Prinzipien sind gleich
Java:
String callbackfunname = context.request ["callbackparam"]; context.Response.write (callbackfunname + "([{/" name/":/" John/"}])");PS: Der JSONP -Parameter des Clients wird verwendet, um die Parameter über URL zu übergeben und den Parameternamen des JSONPCallback -Parameters zu übergeben. Es ist schwer auszusprechen und in einfachen Worten:
JSONP: ""
JSONPCallback: ""
Übrigens: Im Chrome-Browser können Sie auch den Header-Informationskontext festlegen. Auf dem Server, um den Zweck von Cross-Domain-Anforderungen zu erreichen, müssen die folgenden Parameter von AJAX nicht festgelegt werden
DataType: "JSONP", JSONP: "Callbackparam", JSONPCALLBACK: "JSONPCALLBACK1"
Daten können im normalen AJAX -Anforderungsmodus erhalten werden.
Das Folgende ist das Prinzip. Es fühlt sich sehr vernünftig an, wenn Sie lesen, was andere erklärt haben:
1. Ein bekanntes Problem. AJAX fordert direkte Dateien ohne Erlaubnis an, über Domänen hinweg zuzugreifen. Egal, ob Sie eine statische Seite, eine dynamische Webseite, einen Webdienst oder eine WCF sind, solange es sich um eine Cross-Domain-Anfrage handelt, ist dies nicht korrekt.
2. Wir haben jedoch festgestellt, dass sie beim Aufrufen von JS-Dateien auf der Webseite nicht davon betroffen sind, ob sie Cross-Domain sind (nicht nur das, wir haben auch festgestellt
3.. Es kann also beurteilt werden, dass zu diesem Zeitpunkt, wenn Sie über Pure Web auf Daten über Domänen hinweg zugreifen möchten (ActiveX -Steuerelemente, Server -Proxy, zukünftige HTML5 -Websockets usw., versucht, die Daten in eine JS -Formatdatei auf dem Remote -Server zu laden, um sie anzurufen und weiter zu verarbeiten.
4. Wir wissen zufällig, dass es ein reines Zeichendatenformat als JSON gibt, das komplexe Daten präzise beschreiben kann. Was noch besser ist, ist, dass JSON von JS nativ unterstützt wird, sodass der Kunde Daten in diesem Format fast so verarbeiten kann, wie Sie es wünschen.
5. Diese Lösung kommt heraus. Der Web-Client ruft die JS-Formatdatei (normalerweise mit JSON als Suffix) auf, die auf dem Cross-Domain-Server dynamisch generiert sind wie das aufrufende Skript. Es ist offensichtlich, dass der Grund, warum der Server JSON -Dateien dynamisch generieren möchte, darin besteht, die vom Client benötigten Daten zu laden.
6. Nachdem der Kunde die JSON -Datei erfolgreich angerufen hatte, erhält er die von ihm benötigten Daten. Der Rest besteht darin, es nach seinen eigenen Bedürfnissen zu verarbeiten und anzuzeigen. Diese Art, Remotedaten zu erhalten, sieht Ajax sehr ähnlich aus, ist aber tatsächlich anders.
7. Um dem Kunden die Verwendung von Daten zu erleichtern, wurde allmählich ein informelles Übertragungsprotokoll gebildet. Die Leute nennen es JSONP. Einer der wichtigsten Punkte dieses Protokolls besteht darin, dass Benutzer einen Rückrufparameter an den Server übergeben können. Wenn der Server Daten zurückgibt, verwendet er diesen Rückrufparameter als Funktionsname, um die JSON -Daten zu wickeln, damit der Client seine eigenen Funktionen anpassen kann, um die Rückgabedaten automatisch zu verarbeiten.
Für intelligente Entwickler ist es einfach zu glauben, dass der Anrufer, solange das vom Server bereitgestellte JS -Skript dynamisch generiert wird, einen Parameter übergeben und dem Server mitgeteilt werden kann. "Ich möchte ein Stück JS -Code, das die XXX -Funktion aufruft, bitte geben Sie es mir zurück", damit der Server das JS -Skript generieren und nach den Anforderungen des Kunden reagieren kann.
<! DocType html public "-// w3c // dtd xhtml 1.0 transitional // en" "http://www.w3.org/tr/xhtml1/dtd/xhtml1-transsitional.dtd"><Htmlmlml xmlns = "http://www.w3.org/1999/xhtml"> <head> <title> </title> <script type = "text/javaScript"> // Die Rückruffunktion Nach dem Erhalt der Fluginformationsabfragen ergebnis Var Flughandler = Funktion (Daten) {{Alert ("Das Flug Ergebnis. piao ' + data.tickets +' Zhang. }; // Geben Sie die URL -Adresse des JSONP -Dienstes an (unabhängig von der Art der Adresse ist der endgültige Rückgabewert ein Stück JavaScript -Code) var url = "http://flightquery.com/jsonp/flightresult.aspx?code=ca1998&callback=flighlandhandler"; // ein Skript -Tag erstellen und seine Attribute var script = document.createelement ('script') festlegen; Skript.SetatTribute ('SRC', URL); // Fügen Sie das Skript -Tag dem Kopf hinzu, und der Anruf startet //document </script> </head> <body> </body> </html> <! docType html public "-// w3c // dtd xhtml 1.0 transitional // en" "http://www.w3.org/tr/xhtml1/dtd/xhtml1.-transitional.dtml1/dtd/xhtml1 xmlns = "http://www.w3.org/1999/xhtml"> <kopf> <titels> Untitled Seite </title> <script type = "text/javaScript" src = jQuery.min.js "> </script> <script =" text/JAX/JAX {JAHRECRECT "> JQUEY (DOCUMENY). "Get", Async: False, URL: "http://flightquery.com/jsonp/flightesult.aspx?code=ca1998", Datentyp: "JSONP", JSONP: "Rückruf", // an die Anfragehandler oder die Seite des Parameternamens des Parameternamens des JSONP -Funktionsname (allgemein JSONPCallback: "Flighthandler", // benutzerdefinierte JSONP -Rückruffunktionsname, Standard ist der von JQuery automatisch generierte Zufallsfunktionsname "? Zhang. ');Ist es nicht ein bisschen seltsam? Warum habe ich diesmal nicht die Funktion Flighthandler geschrieben? Und es lief tatsächlich erfolgreich! Haha, das ist der Kredit von JQuery. Wenn JQuery den JSONP -Typ AJAX übernimmt (ich kann nicht anders, als mich zu beschweren. Obwohl JQuery JSONP in AJAX einteiliert, sind sie tatsächlich nicht dasselbe), generiert sie automatisch eine Rückruffunktion und nimmt die Daten für die Erfolgsattributmethode aus, um es aufzurufen. Ist es nicht sehr gut?