Delen via

JSONP

  • Artikel

Het JSONP-voorbeeld laat zien hoe u JSON kunt ondersteunen met Padding (JSONP) in WCF REST-services. JSONP is een conventie die wordt gebruikt om scripts tussen domeinen aan te roepen door scripttags in het huidige document te genereren. Het resultaat wordt geretourneerd in een opgegeven callback-functie. JSONP is gebaseerd op het idee dat tags, zoals <script src="http://..." > scripts uit elk domein kunnen evalueren en het script dat door deze tags wordt opgehaald, binnen een bereik wordt geëvalueerd waarin andere functies al kunnen worden gedefinieerd.

Demonstreert

Scripting tussen domeinen met JSONP.

Discussie

Het voorbeeld bevat een webpagina die dynamisch een scriptblok toevoegt nadat de pagina in de browser is weergegeven. Dit scriptblok roept een WCF REST-service aan die één bewerking heeft, GetCustomer. De WCF REST-service retourneert de naam en het adres van een klant die is verpakt in een callback-functienaam. Wanneer de WCF REST-service reageert, wordt de callback-functie op de webpagina aangeroepen met de klantgegevens en geeft de callback-functie de gegevens weer op de webpagina. De injectie van de scripttag en de uitvoering van de callback-functie wordt automatisch verwerkt door het ASP.NET AJAX ScriptManager-besturingselement. Het gebruikspatroon is hetzelfde als bij alle ASP.NET AJAX-proxy's, waarbij één regel wordt gebruikt om JSONP in te schakelen, zoals wordt weergegeven in de volgende code:

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

De webpagina kan de WCF REST-service aanroepen omdat de service gebruikmaakt van de WebScriptEndpoint service die crossDomainScriptAccessEnabled is ingesteld op true. Beide configuraties worden uitgevoerd in het web.config-bestand onder het <element system.serviceModel> .

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

ScriptManager beheert de interactie met de service en verbergt de complexiteit van het handmatig implementeren van JSONP-toegang. Wanneer crossDomainScriptAccessEnabled deze is ingesteld op true en de antwoordindeling voor een bewerking JSON is, inspecteert de WCF-infrastructuur de URI van de aanvraag voor een queryreeksparameter voor callback en verpakt het JSON-antwoord met de waarde van de parameter callback-queryreeks. In het voorbeeld roept de webpagina de WCF REST-service aan met de volgende URI.

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

Omdat de queryreeksparameter callback een waarde JsonPCallbackheeft, retourneert de WCF-service een JSONP-antwoord dat wordt weergegeven in het volgende voorbeeld.

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

Dit JSONP-antwoord bevat de klantgegevens die zijn opgemaakt als JSON, verpakt met de naam van de callback-functie die door de webpagina is aangevraagd. ScriptManager voert deze callback uit met behulp van een scripttag om de aanvraag voor meerdere domeinen uit te voeren en geeft vervolgens het resultaat door aan de onSuccess-handler die is doorgegeven aan de GetCustomer-bewerking van de ASP.NET AJAX-proxy.

Het voorbeeld bestaat uit twee ASP.NET webtoepassingen: één bevat slechts een WCF-service en een andere bevat de .aspx webpagina, die de service aanroept. Wanneer u de oplossing uitvoert, host Visual Studio de twee websites op verschillende poorten, waardoor een omgeving wordt gemaakt waarin de service en client zich op verschillende domeinen bevinden.

Het voorbeeld uitvoeren

  1. Open de oplossing voor het JSONP-voorbeeld.

  2. druk op F5 om te starten http://localhost:26648/JSONPClientPage.aspx in de browser.

  3. Nadat de pagina is geladen, worden de tekstinvoer voor 'Naam' en 'Adres' ingevuld door waarden. Deze waarden zijn opgegeven vanuit een aanroep naar de WCF-service nadat de browser de pagina heeft weergegeven.