Freigeben über

Beispiel für AJAX-Dienst mit JSON und XML

  • Artikel

In diesem Beispiel wird veranschaulicht, wie mit Windows Communication Foundation (WCF) ein AJAX-Dienst (Asynchronous JavaScript and XML) erstellt werden kann, der entweder Daten im Datenformat Javascript Object Notation (JSON) oder XML wiedergibt. Sie können auf einen AJAX-Dienst zugreifen, indem Sie JavaScript-Code in einem Webbrowserclient verwenden. Dieses Beispiel basiert auf dem Einfacher AJAX-Dienst-Beispiel.

Tipp

Zum Erstellen und Ausführen dieses Beispiels muss .NET Framework, Version 3.5 installiert sein. Zum Öffnen des Projekts und der Projektmappendateien ist Visual Studio 2008 erforderlich.

Im Gegensatz zu den anderen AJAX-Beispielen werden in diesem Beispiel ASP.NET AJAX und das ScriptManager-Steuerelement nicht verwendet. Mit einigen zusätzlichen Konfigurationseinstellungen kann auf WCF AJAX-Dienste von jeder HTML-Seite über JavaScript zugegriffen werden. Dieses Szenario wird hier dargestellt. Ein Beispiel für das Verwenden von WCF mit ASP.NET AJAX finden Sie unter AJAX-Beispiele.

In diesem Beispiel wird gezeigt, wie der Antworttyp eines Vorgangs zwischen JSON und XML umgeschaltet wird. Diese Funktion ist unabhängig davon verfügbar, ob der Dienst für den Zugriff durch ASP.NET AJAX oder eine HTML/JavaScript-Clientseite konfiguriert wurde.

Tipp

Die Setupprozedur und Buildanweisungen für dieses Beispiel befinden sich am Ende dieses Themas.

Im Beispiel wird der folgende Konfigurationsabschnitt verwendet, um die Verwendung von Nicht-ASP.NET-Clients zu aktivieren.

<system.serviceModel>
     <behaviors>
          <endpointBehaviors>
               <behavior name="Microsoft.Ajax.Samples.CalculatorServiceAjaxBehavior">
                    <webHttp/>
               </behavior>
          </endpointBehaviors>
     </behaviors>
     <services>
          <service name="Microsoft.Ajax.Samples.CalculatorService">
               <endpoint address="ajaxEndpoint" behaviorConfiguration="Microsoft.Ajax.Samples.CalculatorServiceAjaxBehavior" binding="webHttpBinding" contract="Microsoft.Ajax.Samples.ICalculator" />
          </service>
     </services>
</system.serviceModel>

Beachten Sie die Verwendung des <webHttp>-Verhaltens statt des <enableWebScript>-Verhaltens. Das Standarddatenformat für das webHttp-Verhalten lautet XML, und für das enableWebScript-Verhalten lautet es JSON. Weitere Informationen zu den Besonderheiten des webHttp-Verhaltens finden Sie unter Creating WCF AJAX Services without ASP.NET.

Der Dienst im folgenden Beispiel ist ein WCF-Standarddienst mit zwei Vorgängen. Beide Vorgänge erfordern den Wrapped-Textstil beim WebGetAttribute-Attribut oder WebInvokeAttribute-Attribut. Dieser Textstil ist typisch für das webHttp-Verhalten und hat keinen Einfluss auf den JSON/XML-Datenformatwechsel.

[OperationContract]
[WebInvoke(ResponseFormat = WebMessageFormat.Xml, BodyStyle = WebMessageBodyStyle.Wrapped)]
MathResult DoMathXml(double n1, double n2);

Als Antwortformat des Vorgangs wird XML angegeben. Dies entspricht der Standardeinstellung für das <webHttp>-Verhalten. Es wird jedoch empfohlen, das Antwortformat explizit festzulegen.

Der andere Vorgang verwendet das WebInvokeAttribute-Attribut und gibt explizit JSON statt XML als Antwortformat an.

[OperationContract]
[WebInvoke(ResponseFormat = WebMessageFormat.Json, BodyStyle = WebMessageBodyStyle.Wrapped)]
MathResult DoMathJson(double n1, double n2);

Beachten Sie, dass die Vorgänge in beiden Fällen einen komplexen Typ, MathResult, wiedergeben, bei dem es sich um einen standardmäßigen WCF-Datenvertragstyp handelt.

Die Webseite des Client XmlAjaxClientPage.htm enthält JavaScript-Code, der einen der oben beschriebenen beiden Vorgänge aufruft, wenn der Benutzer auf der Seite auf die Schaltfläche Berechnung durchführen (JSON zurückgeben) oder Berechnung durchführen (XML zurückgeben) klickt. Im zum Aufrufen des Diensts verwendeten Code wird ein JSON-Text erstellt und mit HTTP-POST gesendet. Die Anforderung wird manuell in JavaScript erstellt. Im Einfacher AJAX-Dienst-Beispiel und in den anderen Beispielen wird dagegen ASP.NET AJAX verwendet.

// Create HTTP request
var xmlHttp;
// Request instantiation code omitted…
// Result handler code omitted…

// Build the operation URL
var url = "service.svc/ajaxEndpoint/";
url = url + operation;

// Build the body of the JSON message
var body = '{"n1":';
body = body + document.getElementById("num1").value + ',"n2":';
body = body + document.getElementById("num2").value + '}';
  
// Send the HTTP request
xmlHttp.open("POST", url, true);
xmlHttp.setRequestHeader("Content-type", "application/json");
xmlHttp.send(body);

Wenn der Dienst antwortet, wird die Antwort, ohne vorher weiterverarbeitet zu werden, in einem Textfeld auf der Seite angezeigt. Dies dient der Veranschaulichung, sodass Sie direkt die verwendeten XML- und JSON-Datenformate prüfen können.

// Create result handler 
xmlHttp.onreadystatechange=function(){
     if(xmlHttp.readyState == 4){
          document.getElementById("result").value = xmlHttp.responseText;
     }
}

So richten Sie das Beispiel ein, erstellen es und führen es aus

  1. Stellen Sie sicher, dass Sie die Beispiele zum einmaligen Setupverfahren für Windows Communication Foundation ausgeführt haben.

  2. Erstellen Sie die Projektmappe XmlAjaxService.sln, wie in Erstellen der Windows Communication Foundation-Beispiele beschrieben.

  3. Navigieren Sie zu https://localhost/ServiceModelSamples/XmlAjaxClientPage.htm (öffnen Sie XmlAjaxClientPage.htm nicht im Browser vom Projektverzeichnis).

Siehe auch

Aufgaben

AJAX-Dienst mit HTTP POST

Send comments about this topic to Microsoft.
© 2007 Microsoft Corporation. All rights reserved.