Consumir servicio WCF - Fase IV

Siguiendo con los apartados de servicios WCF - ahora implementaremos una aplicación Asp.Net MVC para saber el cómo consumir un serivicio WCF.

Requisitos:

• Visual Studio .Net 2010.
• Framework 4.
• Ajax, JQuery, JSON

1. Iniciamos creando nuestro proyecto de tipo ASP.NET MVC 4 Web Application - desde la carpeta FrontEnd.
   
   
   
   
   
   
   
2. Seleccionamos el template basic de MVC.
   
   
   
   
3. Estructura de nuestro proyecto MCV - creado.
   
   
   
4. Ahora creamos el controllers - con nombre Home.
   
   
   
   
   
   Determinamos el nombre
   
5. Luego creamos el view - clic derecho en index de la clase del controller.
   
   
   
   
   
   En mi caso mantendré el mismo nombre que el controller
   
   
   
   Estructura de nuestro view creado
   
6. Ahora iniciamos haciendo referencia al servicio que anteriormente se creo y publico - determinamos con nombre ServiceUbigeo.
   
   
   
7. Ubicamos haciendo clic Discover - asignamos el nombre de ServiceUbigeo
   
   
   
   
   
   Servicio referenciado desde nuestro proyecto MCV
   
Consideraciones: Al crear uno o varios servicios en nuestro archivo Web.config de manera automática se adicionara los endpoint que determinar la ruta para el compartimiento de información entre las parte involucradas en un servicio.
8. Ahora adicionamos es nuestro modelo (ClassModelo.cs) los siguiente atributos.
   Favor de considerar los comentarios que están en el código fuente - color verte - partiendo desde este punto.
   
   

   public class UbiDepartamento //Cambiamos a UbiDepartamento (parecido a la entidad de la base de datos)
       {
           //Sólo adiciono los atributos que se manipulara
           public string CodDepartamento { get; set; }
           public string DesDepartamento { get; set; }
       }
   

9. Ahora implementamos en nuestro controller el método que nos permitirá consumir el servicio a la cual hacemos referencia - el HttpPost y el JsonResult se entrará al detalle en otro apartado.
   

   [HttpPost]
           public JsonResult GetAllDepartamento()
           {
               try
               {
                   using (var client = new Service1Client())
                   {
                       List result = new List();//Invocamo a la entidad de nuestro modelo
                       var preResult = client.GetDepartamentoDataList();//Invocamos al método que es parte del servicio ubigeo
   
                       if (preResult != null && preResult.ToList().Count > 0)//validar la existencia de datos
                           foreach (var item in preResult) //recoremos los valores
                           {
                               result.Add(new UbiDepartamento //y vamos adicionando en nuestro modelo segun los atributos
                               {
                                   CodDepartamento = item.COD_DEPARTAMENTO.ToString(),
                                   DesDepartamento = item.DES_DEPARTAMENTO.ToString()
                               });
                           }
   
                       return Json(result, JsonRequestBehavior.AllowGet); //retornamos los valores recuperados
                   }
               }
               catch (Exception)
               {
                   throw;
               }
           }
   

10. Para este caso solo implementaremos la carga de datos en un HTML input de tipo select que haremos uso de Ajax y JQuery con tipo de dato JSON.
    

    $(document).ready(function () {
    
        $.ajax({
            url: "Home/GetAllDepartamento",
            type: "POST",
            dataType: "json",
            data: "{}",
            success: function (data) {
    
                if (data == null) {
                    alert('Disculpe, No hay departamentos que mostrar.');
                    return
                } else {
                    for (var i = 0; i < data.length; i++) {
                        $("#SltDepartamento").append("" + data[i].DesDepartamento + "");
                    }
                }
            },
            error: function (jqXHR, status, error) {
                alert('Disculpe, existió un problema');
            }
        });
    
    });
    

11. Y para finalizar implementamos HTLM en el _Layout.cshtml  para poder mostrar los datos que nos devuelve el servicio.
    
    
    
    Resultado del servicio que estamos consumiendo
    
    

Proyecto C#