Blog de Página Web Leon

Ejemplo WebService parte 2: Consumiendo el servicio

En este post veremos como consumir un web service, es decir, crearemos una aplicación del lado del cliente que se conectará a un servidor que contiene una aplicación que usaremos. Para realizar este ejemplo, usaremos Windows 8 y el Visual Studio 2010. También requerimos tener preparado del lado del servidor un WebService que reciba tres valores decimales para calcular dos variables que solucionarán la fórmula general cuadrada para ecuaciones de segundo grado, si no tienes el servicio web te recomendamos que primero hagas uno. Aquí te decimos como hacerlo: Crear un Servicio Web.

Si ya tienes tu Web Service y está operando podrás comenzar con el ejemplo de éste post. En esta parte se creará una aplicación web que se conectará con otra aplicación la cual calculará los resultados de X1 y X2 de la fórmula cuadrada.

Consumiendo el WebService
Creando la solución
  1. Abramos nuestro Visual Studio 2010
  2. Vayamos a ArchivoNuevo Sitio Web…
  3. Aparecerá un cuadro de diálogo, en la parte izquierda vemos una lista de la cual seleccionaremos Plantillas instaladas y dentro seleccionaremos Visual C#
  4. En el mismo cuadro de diálogo, en la parte central demos un clic en el ítem Sitio web ASP.NET
  5. En la caja de Texto donde dice Ubicación web seleccionemos la ruta de nuestra aplicación que consumirá el servicio, para el ejemplo usaré el escritorio escritorio (Desktop) : C:\Users\Pavilion\Desktop\consumidor
  6. Demos un clic en el botón Aceptar para crearla
Enlazando el Web Service
  1. En el explorador de soluciones demos un clic derecho sobre el nombre de nuestro sitio
  2. Aparecerá un menú, damos un clic en el ítem Agregar referencia web... (Si no aparece el item, ve en el mismo menú en estas direcciones: Agregar referencias de servicio… – Avanzadas… – Agregar referencia web…)
  3. Aparecerá un cuadro de diálogo, esta es una parte muy importante porque aquí vamos a ingresar la URL del web service  que vamos a consumir, en nuestro ejemplo anterior, dicha ruta es: http://localhost:65015/web_service/miServicio.asmx
  4. Demos un clic en el botón:boton_ir_a_la_URL
  5. Si todo sale bien, verás en el cuadro de abajo la siguiente imagen:

    Menú de métodos web disponibles

    Fig. 1.1 Menú de métodos web disponibles

  6. Del lado derecho, aparece el nombre de los servicios disponibles y justo abajo hay una caja de texto donde podemos nombrar nuestra referencia web, le pondremos el nombre de referencia web consumirService, y damos un clic en el botón Agregar referencia.
  7. Aparecerá en nuestro Explorador de soluciones un nuevo archivo en las referencias web:

    Referencia web en el explorador

    Fig. 1.2 Referencia web en el explorador

Agregando el código para consumir

Antes que nada, cambiemos el archivo Web.config para poder depurar nuestra solución, busquemos la siguiente etiqueta y cambiemos donde dice false por true

<compilation debug="false" targetFramework="4.0"/>
  1. Demos un clic derecho en el nombre de sitio web y en el menú que aparece, buscar el ítem Agregar nuevo elemento…
  2. Aparecerá un cuadro de diálogo, seleccionemos Visual C# en Plantillas instaladas, y en la parte central del cuadro seleccionemos el primer ítem que dice Web Forms para agregar una nueva forma, en la caja de texto cambiamos el nombre a formaConsumidora.aspx
  3. Damos un clic en Agregar
  4. En el explorador de soluciones tendremos un nuevo archivo y en el espacio de trabajo aparecerá el código de éste. Vamos al pie del código y demos un clic en la pestaña Diseño.
  5. Vayamos hacia el cuadro de herramientas y en la pestaña Estándar arrastremos hacia el espacio de trabajo, tres controles TextBox y un Button. Deberá verse como la siguiente imagen:

    Forma con cuatro controles

    Fig. 1.3 Forma con cuatro controles

  6. En el explorador de soluciones, buscamos el archivo formaConsumidora.aspx y damos un clic derecho sobre él, aparecerá un menú del cuál seleccionaremos el ítem Establecer como página principal
  7. Estando en vista Diseño, vamos a dar doble clic en el botón button que agregamos, nos mandará a la clase ligada para el control de nuestra aplicación, veremos algo como esto:
    
    using System;
    using System.Collections.Generic;
    using System.Linq;
    using System.Web;
    using System.Web.UI;
    using System.Web.UI.WebControls;
    
    public partial class formaConsumidora : System.Web.UI.Page
    {
       protected void Page_Load(object sender, EventArgs e)
       {
    
       }
  8.    protected void Button1_Click(object sender, EventArgs e)
       {
    
       }
    }
    
    
  9. Vamos a agregar nuestro código, primeramente colocaremos el espacio de trabajo del Web Service, con la instrucción using consumirService; esto es para hacer referencia al proyecto del lado del cliente.
  10. using System;
    using System.Collections.Generic;
    using System.Linq;
    using System.Web;
    using System.Web.UI;
    using System.Web.UI.WebControls;
    using consumirService;
  11. Ahora vamos a enfocarnos en el método Button1_Click, le agregaremos código para usar el web service, quedará así:
    using System;
    using System.Collections.Generic;
    using System.Linq;
    using System.Web;
    using System.Web.UI;
    using System.Web.UI.WebControls;
    using consumirService;
    
    public partial class formaConsumidora : System.Web.UI.Page
    {
  12.    protected void Page_Load(object sender, EventArgs e)
       {
    
       }
  13.    protected void Button1_Click(object sender, EventArgs e)
       {
          // creamos la instancia hacia el webservice
          WebService conexionAServicio = new WebService();
    
          // creamos la instancia para la respuesta del servicio
          Respuesta resultados = new Respuesta();
    
          // llamamos el método del servicio que hará los cálculos
          resultados = conexionAServicio.ejecutarEcuacion
          (Convert.ToDouble(TextBox1.Text), 
           Convert.ToDouble(TextBox2.Text),
           Convert.ToDouble(TextBox3.Text));
    
          // mostramos los resultados en pantalla
          Response.Write("X1: " + resultados.valorX1 + "<br> X2: " + resultados.valorX2);
     }
    }
    
Probando la solución
  1. Pulsemos la tecla F5 para probar nuestra solución
  2. Aparecerá la siguiente pantalla en tu navegador, pongamos los valores que se indican en la imagen solo para probar con algo:

    Prueba de la solución

    Fig. 1.4 Prueba de la solución

  3. Demos un clic en el botón para procesar la información, estos son los resultados:

    Resultados del proceso

    Fig. 1.5 Resultados del proceso

Nota: En realidad ésta aplicación no hizo ningún cálculo, solamente la comunicación hacia el webservice que es el que procesó la información y regresó los datos.

2 Comentarios

  1. Pingback: Web Service | Blog de Página Web Leon

  2. Pingback: Ejemplo WebService parte 1: Creando el servicio | Blog de Página Web Leon

Dejar un comentario