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
- Iniciamos creando nuestro proyecto de tipo ASP.NET MVC 4 Web Application - desde la carpeta FrontEnd.
- Seleccionamos el template basic de MVC.
- Estructura de nuestro proyecto MCV - creado.
- Ahora creamos el controllers - con nombre Home.
Determinamos el nombre - Luego creamos el view - clic derecho en index de la clase del controller.
En mi caso mantendré el mismo nombre que el controllerEstructura de nuestro view creado - Ahora iniciamos haciendo referencia al servicio que anteriormente se creo y publico - determinamos con nombre ServiceUbigeo.
- Ubicamos haciendo clic Discover - asignamos el nombre de ServiceUbigeo
Servicio referenciado desde nuestro proyecto MCV - 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; } }
- 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; } } - 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(""); } } }, error: function (jqXHR, status, error) { alert('Disculpe, existió un problema'); } }); });
- 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
- 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.
Comentarios
Publicar un comentario