Freigeben über

AJAX-Dienst mit JSON- und XML-Beispiel

Das XmlAjaxService-Beispiel veranschaulicht, wie Windows Communication Foundation (WCF) zum Erstellen eines asynchronen JavaScript- und XML-Diensts (AJAX) verwendet wird, der entweder JavaScript Object Notation (JSON) oder XML-Daten zurückgibt. Sie können über einen Webbrowserclient auf einen AJAX-Dienst zugreifen, indem Sie JavaScript-Code verwenden. Dieses Beispiel basiert auf dem Standard AJAX-Dienstbeispiel .

Im Gegensatz zu den anderen AJAX-Beispielen verwendet dieses Beispiel nicht ASP.NET AJAX und das ScriptManager Steuerelement. Mit einer zusätzlichen Konfiguration können WCF AJAX-Dienste über JavaScript von jeder HTML-Seite aus aufgerufen werden, und dieses Szenario wird hier gezeigt. Ein Beispiel für die Verwendung von WCF mit ASP.NET AJAX finden Sie unter AJAX-Beispiele.

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

Hinweis

Die Einrichtungsverfahren und Build-Anweisungen für dieses Beispiel befinden sich am Ende dieses Themas.

Um die Verwendung von non-ASP.NET AJAX-Clients zu aktivieren, verwenden Sie WebServiceHostFactory (nicht WebScriptServiceHostFactory) in der SVC-Datei. WebServiceHostFactory fügt dem Dienst einen WebHttpEndpoint Standardendpunkt hinzu. Der Endpunkt wird in einer leeren Adresse relativ zur SVC-Datei konfiguriert. Dies bedeutet, dass die Adresse des Diensts ohne zusätzliche Suffixe außer dem Vorgangsnamen lautet http://localhost/ServiceModelSamples/service.svc.

<%@ServiceHost language="c#" Debug="true" Service="Microsoft.Samples.XmlAjaxService.CalculatorService" Factory="System.ServiceModel.Activation.WebServiceHostFactory" %>

Der folgende Abschnitt in Web.config kann verwendet werden, um zusätzliche Konfigurationsänderungen am Endpunkt vorzunehmen. Sie kann entfernt werden, wenn keine zusätzlichen Änderungen erforderlich sind.

<system.serviceModel>
  <standardEndpoints>
    <webHttpEndpoint>
      <!-- Use this element to configure the endpoint -->
      <standardEndpoint name="" />
    </webHttpEndpoint>
  </standardEndpoints>
</system.serviceModel>

Das Standarddatenformat für WebHttpEndpoint XML ist, während das Standarddatenformat für WebScriptEndpoint JSON lautet. Weitere Informationen finden Sie unter Erstellen von WCF AJAX-Diensten ohne ASP.NET.

Der Dienst im folgenden Beispiel ist ein standardmäßiger WCF-Dienst mit zwei Vorgängen. Beide Vorgänge erfordern den Wrapped Textkörperstil für die WebGetAttribute oder WebInvokeAttribute Attribute, die für das webHttp Verhalten spezifisch sind und sich nicht auf den JSON/XML-Datenformatschalter beziehen.

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

Das Antwortformat für den Vorgang wird als XML angegeben. Dies ist die Standardeinstellung für das <WebHttp-Verhalten> . Es empfiehlt sich jedoch, das Antwortformat explizit anzugeben.

Der andere Vorgang verwendet das WebInvokeAttribute Attribut und gibt JSON anstelle von XML für die Antwort explizit an.

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

Beachten Sie, dass in beiden Fällen die Vorgänge einen komplexen Typ zurückgeben, MathResultbei dem es sich um einen standardmäßigen WCF-Datentyp handelt.

Die Clientwebseite XmlAjaxClientPage.htm enthält JavaScript-Code, der einen der beiden vorherigen Vorgänge aufruft, wenn der Benutzer auf die Schaltflächen " Berechnung ausführen" (Rückgabe-JSON) oder "Berechnung ausführen" (Rückgabe-XML) auf der Seite klickt. Der Code zum Aufrufen des Diensts erstellt einen JSON-Textkörper und sendet ihn mithilfe von HTTP POST. Die Anforderung wird manuell in JavaScript erstellt, im Gegensatz zum Standard AJAX-Dienstbeispiel und den anderen Beispielen mit ASP.NET AJAX.

// 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 weitere Verarbeitung in einem Textfeld auf der Seite angezeigt. Dies wird zu Demonstrationszwecken implementiert, damit Sie die verwendeten XML- und JSON-Datenformate direkt beobachten können.

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

So können Sie das Beispiel einrichten, erstellen und ausführen

  1. Stellen Sie sicher, dass Sie das One-Time Setup-Verfahren für die Windows Communication Foundation-Beispieleausgeführt haben.

  2. Erstellen Sie die Lösung XmlAjaxService.sln wie im Erstellen der Windows Communication Foundation-Beispiele beschrieben.

  3. Navigieren Sie zu http://localhost/ServiceModelSamples/XmlAjaxClientPage.htm (öffnen Sie nicht XmlAjaxClientPage.htm im Browser aus dem Projektverzeichnis).

Siehe auch

  • Last updated on