Servicio AJAX básico

El ejemplo de SimpleAjaxService muestra cómo usar Windows Communication Foundation (WCF) a fin de crear un servicio básico JavaScript y XML (AJAX) asincrónico (un servicio al que puede acceder mediante código JavaScript desde un cliente de explorador web). El servicio utiliza el atributo WebGetAttribute para asegurarse de que el servicio responde a las solicitudes HTTP GET y de que está configurado para utilizar el formato de datos de Notación de objeto de JavaScript (JSON) para las respuestas.

La compatibilidad con AJAX en WCF se optimiza para su uso con ASP.NET AJAX a través del control ScriptManager. Para obtener un ejemplo sobre cómo usar WCF con ASP.NET AJAX, consulte el artículo sobre los ejemplos de AJAX.

Nota

El procedimiento de instalación y las instrucciones de compilación de este ejemplo se encuentran al final de este tema.

En el código siguiente, el atributo WebGetAttribute se aplica a la operación Add para asegurarse de que el servicio responde a las solicitudes HTTP GET. El código usa GET por simplicidad (puede construir una solicitud HTTP GET desde cualquier explorador web). También puede utilizar GET para habilitar el almacenamiento en caché. HTTP POST es el valor predeterminado en la ausencia del atributo WebGetAttribute.

[ServiceContract(Namespace = "SimpleAjaxService")]
public interface ICalculator
{
    [WebGet]
    double Add(double n1, double n2);
    //Other operations omitted…
}

El archivo .svc de ejemplo utiliza WebScriptServiceHostFactory, que agrega un punto de conexión estándar WebScriptEndpoint al servicio. El extremo se configura en una dirección vacía relativa al archivo .svc. Esto significa que la dirección del servicio es http://localhost/ServiceModelSamples/service.svc, sin nigún sufijo adicional, excepto el nombre de la operación.

<%@ServiceHost language="C#" Debug="true" Service="Microsoft.Samples.SimpleAjaxService.CalculatorService" Factory="System.ServiceModel.Activation.WebScriptServiceHostFactory" %>

WebScriptEndpoint se preconfigura de modo que el servicio esté accesible desde una página de cliente AJAX de ASP.NET. La siguiente sección de Web.config se puede utilizar para realizar cambios de configuración adicionales en el punto de conexión. Se puede quitar si no se necesita ningún cambio adicional.

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

WebScriptEndpoint establece el formato de datos predeterminado para el servicio en JSON en lugar de XML. Para invocar el servicio, vaya a http://localhost/ServiceModelSamples/service.svc/Add?n1=100&n2=200 después de completar los pasos de configuración y compilación que se muestran más adelante en este tema. El uso de una solicitud HTTP GET habilita esta funcionalidad de la prueba.

La página web del cliente SimpleAjaxClientPage.aspx contiene el código de ASP.NET para invocar el servicio siempre que el usuario haga clic en uno de los botones de operación en la página. El control ScriptManager se utiliza para hacer que un proxy al servicio sea accesible a través de JavaScript.

<asp:ScriptManager ID="ScriptManager" runat="server">
    <Services>
        <asp:ServiceReference Path="service.svc" />
    </Services>
</asp:ScriptManager>

Se crean instancias del proxy local y las operaciones se invocan utilizando el siguiente código de JavaScript.

// Code for extracting arguments n1 and n2 omitted…
// Instantiate a service proxy
var proxy = new SimpleAjaxService.ICalculator();
// Code for selecting operation omitted…
proxy.Add(parseFloat(n1), parseFloat(n2), onSuccess, onFail, null);

Si la llamada del servicio es correcta, el código invoca el controlador onSuccess y el resultado de la operación se muestra en un cuadro de texto.

function onSuccess(mathResult){
     document.getElementById("result").value = mathResult;
}