JSONPJSONP

In diesem Beispiel wird erläutert, wie JSON mit Padding (JSONP) in WCF REST-Diensten unterstützt wird.This sample demonstrates how to support JSON with Padding (JSONP) in WCF REST services. JSONP ist eine Konvention, die zum Aufrufen domänenübergreifender Skripts durch das Generieren von Skripttags im aktuellen Dokument verwendet wird.JSONP is a convention used to invoke cross-domain scripts by generating script tags in the current document. Das Ergebnis wird in einer festgelegten Rückruffunktion zurückgegeben.The result is returned in a specified callback function. JSONP basiert auf dem Konzept, dass z. B. tags <script src="http://..." > Skripts aus einer beliebigen Domäne auswerten können und das durch diese Tags abgerufene Skript innerhalb eines Bereichs, in dem andere Funktionen möglicherweise bereits definiert, ausgewertet wird.JSONP is based on the idea that tags such as <script src="http://..." > can evaluate scripts from any domain and the script retrieved by those tags is evaluated within a scope in which other functions may already be defined.

VeranschaulichtDemonstrates

Domänenübergreifende Skripterstellung mit JSONPCross-domain scripting with JSONP.

DiskussionDiscussion

Das Beispiel enthält eine Webseite, für die dynamisch ein Skriptblock hinzugefügt wird, nachdem die Seite im Browser gerendert wurde.The sample includes a Web page that dynamically adds a script block after the page has been rendered in the browser. Dieser Skriptblock ruft einen WCF REST-Dienst auf, der nur über den einen Vorgang GetCustomer verfügt.This script block calls a WCF REST service that has a single operation, GetCustomer. Der WCF REST-Dienst gibt den Namen und die Adresse eines Kunden durch Wrapping in einen Rückruffunktionsnamen zurück.The WCF REST service returns a customer’s name and address wrapped in a callback function name. Wenn der WCF REST-Dienst antwortet, wird die Rückruffunktion auf der Webseite mithilfe der Kundendaten aufgerufen, und die Rückruffunktion zeigt die Daten auf der Webseite an.When the WCF REST service responds, the callback function on the Web page is invoked with the customer data and the callback function displays the data on the Web page. Die Einfügung des Skripttags und die Ausführung der Rückruffunktion werden automatisch vom ASP.NET AJAX ScriptManager-Steuerelement behandelt.The injection of the script tag and the execution of the callback function is automatically handled by the ASP.NET AJAX ScriptManager control. Das Verwendungsmuster stimmt mit dem aller ASP.NET AJAX-Proxys überein, allerdings mit einer zusätzlichen Zeile zur Aktivierung von JSONP. Dies wird im folgenden Code dargestellt:The usage pattern is the same as with all ASP.NET AJAX proxies, with the addition of one line to enable JSONP, as shown in the following code:

var proxy = new JsonpAjaxService.CustomerService();  
proxy.set_enableJsonp(true);  
proxy.GetCustomer(onSuccess, onFail, null);  

Die Webseite kann den WCF REST-Dienst aufrufen, da der Dienst den WebScriptEndpoint verwendet, wobei crossDomainScriptAccessEnabled auf true festgelegt wurde.The Web page can call the WCF REST service because the service is using the WebScriptEndpoint with crossDomainScriptAccessEnabled set to true. Bei beiden Konfigurationen fertig sind, in der Datei "Web.config" unter dem <system.serviceModel >-Element.Both of these configurations are done in the Web.config file under the <system.serviceModel> element.

<system.serviceModel>  
  <serviceHostingEnvironment aspNetCompatibilityEnabled="true"/>  
  <standardEndpoints>  
    <webScriptEndpoint>  
      <standardEndpoint name="" crossDomainScriptAccessEnabled="true"/>  
    </webScriptEndpoint>  
  </standardEndpoints>  
</system.serviceModel>  

ScriptManager verwaltet die Interaktion mit dem Dienst und macht damit die Komplexität, die mit einer manuellen Implementierung des JSONP-Zugriffs verbunden ist, überflüssig.ScriptManager manages the interaction with the service and hides away the complexity of manually implementing JSONP access. Wenn crossDomainScriptAccessEnabled festgelegt ist, um true und das Antwortformat eines Vorgangs ist "JSON" ist, wird die WCF-Infrastruktur uberprüft die Anforderung für eine rückrufabfrage und dient als Wrapper für die JSON-Antwort mit dem Wert der Abfragezeichenfolge Rückruf Parameter.When crossDomainScriptAccessEnabled is set to true and the response format for an operation is JSON, the WCF infrastructure inspects the URI of the request for a callback query string parameter and wraps the JSON response with the value of the callback query string parameter. Im Beispiel ruft die Webseite den WCF REST-Dienst mit dem folgenden URI auf.In the sample, the Web page calls the WCF REST service with the following URI.

http://localhost:33695/CustomerService/GetCustomer?callback=Sys._json0  

Da der Zeichenfolgenparameter der Rückrufabfrage über den Wert JsonPCallback verfügt, gibt der WCF-Dienst die im folgenden Beispiel dargestellte JSONP-Antwort zurück.Because the callback query string parameter has a value of JsonPCallback, the WCF service returns a JSONP response shown in the following example.

Sys._json0({"__type":"Customer:#Microsoft.Samples.Jsonp","Address":"1 Example Way","Name":"Bob"});  

Diese JSONP-Antwort enthält die als JSON formatierten Kundendaten, für die mit dem von der Webseite angeforderten Rückruffunktionsnamen ein Wrapping ausgeführt wurde.This JSONP response includes the customer data formatted as JSON, wrapped with the callback function name that the Web page requested. ScriptManager führt diesen Rückruf mithilfe eines Skripttags aus, um die domänenübergreifende Anforderung zu ermöglichen und danach das Ergebnis an den onSuccess-Handler zu übergeben, der an die GetCustomer-Operation des ASP.NET AJAX-Proxys übergeben wurde.ScriptManager will execute this callback using a script tag to accomplish the cross-domain request, and then pass the result to the onSuccess handler that was passed to the GetCustomer operation of the ASP.NET AJAX proxy.

Das Beispiel besteht aus zwei ASP.NET-Webanwendungen: eine enthält einen WCF-Dienst, und eine andere ASPX-Webseite, die den Dienst aufruft.The sample consists of two ASP.NET web applications: one contains just a WCF service, and another one contains the .aspx webpage, which calls the service. Während der Ausführung der Projektmappe hostet Visual Studio 2012Visual Studio 2012 die zwei Websites auf unterschiedlichen Ports. Auf diese Weise wird eine Umgebung erstellt, in der der Dienst und der Client sich in zwei verschiedenen Domänen befinden.When running the solution, Visual Studio 2012Visual Studio 2012 will host the two websites on different ports, which creates an environment where the service and client live on different domains.

Wichtig

Die Beispiele sind möglicherweise bereits auf dem Computer installiert.The samples may already be installed on your machine. Suchen Sie nach dem folgenden Verzeichnis (Standardverzeichnis), bevor Sie fortfahren.Check for the following (default) directory before continuing.

<InstallDrive>:\WF_WCF_Samples

Wenn dieses Verzeichnis nicht vorhanden ist, fahren Sie mit Windows Communication Foundation (WCF) und Windows Workflow Foundation (WF) Samples for .NET Framework 4 aller Windows Communication Foundation (WCF) herunterladen und WFWF Beispiele.If this directory does not exist, go to Windows Communication Foundation (WCF) and Windows Workflow Foundation (WF) Samples for .NET Framework 4 to download all Windows Communication Foundation (WCF) and WFWF samples. Dieses Beispiel befindet sich im folgenden Verzeichnis.This sample is located in the following directory.

<InstallDrive>:\WF_WCF_Samples\WCF\Basic\AJAX\JSONP

So führen Sie das Beispiel ausTo run the sample

  1. Öffnen Sie die Projektmappe für das JSONP-Beispiel.Open the solution for the JSONP Sample.

  2. Drücken Sie F5, um starten http://localhost:26648/JSONPClientPage.aspx im Browser.Press F5 to launch http://localhost:26648/JSONPClientPage.aspx in the browser.

  3. Beachten Sie, dass nach dem Laden der Seite die Texteingaben für "Name" und "Address" mit Werten aufgefüllt werden.Notice that after the page loads, the text inputs for "Name" and "Address" are populated by values. Diese Werte wurden von einem Aufruf des WCF-Diensts angegeben, nach dem der Browser die Seite gerendert.These values were supplied from a call to the WCF service after the browser finished rendering the page.