Esempio di servizio AJAX che usa tipi complessi

  • Articolo

L'esempio ComplexTypeAjaxService mostra come usare Windows Communication Foundation (WCF) per creare un servizio JavaScript e XML (AJAX) asincrono ASP.NET che crea istanze di tipi complessi e li invia tra il servizio e il client come JavaScript Object Notation (JSON). È possibile accedere a un servizio AJAX utilizzando codice JavaScript a partire da un client del browser Web. Questo esempio si basa sull'esempio di Servizio AJAX Basic.

Il supporto AJAX in WCF è ottimizzato per l'uso con ASP.NET AJAX tramite il controllo ScriptManager. Per un esempio di utilizzo di WCF con ASP.NET AJAX, vedere gli esempi AJAX.

Nota

La procedura di installazione e le istruzioni di compilazione per questo esempio si trovano alla fine di questo argomento.

Il servizio dell'esempio seguente è un servizio WCF senza codice specifico per AJAX. Perché l'attributo WebGetAttribute non è applicato, viene utilizzato il verbo HTTP predefinito ("POST"). Il servizio ha un'operazione, DoMath che restituisce un tipo complesso denominato MathResult. Il tipo complesso è un tipo di contratto dati standard che non contiene codice AJAX specifico.

[DataContract]
public class MathResult
{
    [DataMember]
    public double sum;
    [DataMember]
    public double difference;
    [DataMember]
    public double product;
    [DataMember]
    public double quotient;
}

Creare un endpoint AJAX sul servizio utilizzando WebScriptServiceHostFactory, proprio come nell'esempio del servizio AJAX di base.

La pagina Web ComplexTypeClientPage.aspx del client contiene il codice ASP.NET e JavaScript per richiamare il servizio quando l'utente fa clic sul pulsante Esegui calcolo nella pagina. Il codice per richiamare il servizio costruisce un corpo JSON e lo invia usando HTTP POST, simile all'esempio Servizio AJAX mediante HTTP POST.

Dopo che la chiamata del servizio riesce, è possibile accedere ai membri dati singoli (sum, difference, product e quotient) sull'oggetto JavaScript risultante.

function onSuccess(mathResult){
     document.getElementById("sum").value = mathResult.sum;
     document.getElementById("difference").value = mathResult.difference;
     document.getElementById("product").value = mathResult.product;
     document.getElementById("quotient").value = mathResult.quotient;
}

Per impostare, compilare ed eseguire l'esempio

  1. Assicurarsi di aver eseguito la Procedura di installazione singola per gli esempi di Windows Communication Foundation.

  2. Compilare la soluzione ComplexTypeAjaxService.sln come descritto in Generazione degli esempi Windows Communication Foundation.

  3. Passare a http://localhost/ServiceModelSamples/ComplexTypeClientPage.aspx (non aprire ComplexTypeClientPage.aspx nel browser dalla directory del progetto).

Vedi anche