Skip to content

1. Introducción

El PDF de este documento está disponible |AQUÍ|.

Los ejemplos de este documento están disponibles |AQUÍ|.

Aquí nos proponemos presentar, mediante ejemplos, los conceptos importantes de ASP.NET MVC, un marco de trabajo web.NET, el cual proporciona un marco para desarrollar aplicaciones web según el modelo MVC (Modelo – Vista – Controlador).

Para comprender los ejemplos de este documento se requieren pocos requisitos previos. Solo se necesitan conocimientos básicos del lenguaje C#. Estos se pueden encontrar en el documento Introducción al lenguaje C# en URL [Aprendizaje del lenguaje C# versión 3.0 con el Framework .NET 3.5 (2008)]. Se propone un caso de estudio para poner en práctica los conocimientos adquiridos en ASP.NET MVC. Este utiliza el ORM (mapeador objeto-relacional) Entity Framework. Este ORM se presenta en el documento Introducción a Entity Framework 5 Code First, disponible en el URL [Introducción práctica a Entity Framework 5 Code First (2012)].

Este documento está incompleto en muchos aspectos. Para profundizar en ASP.NET MVC, se pueden consultar las siguientes referencias:

  • [ref1]: el libro «Pro ASP.NET MVC 4», escrito por Adam Freeman y publicado por Apress. Es un libro excelente. Si estuviera disponible en línea de forma gratuita y en francés, este documento no tendría razón de ser. Recomiendo a todos los que puedan hacerlo que se inicien en ASP.NET MVC con la ayuda de este libro. Los códigos fuente de los ejemplos del libro están disponibles de forma gratuita en el URL [http://www.apress.com/9781430242369];
  • [ref2]: el sitio web del marco de trabajo [http://www.asp.net/mvc]. Allí encontrarán todo el material necesario para el autoaprendizaje. Hay una versión en francés disponible en URL [http://dotnet.developpez.com/mvc/ ];
  • el sitio de [developpez.com] dedicado a ASP.NET y [http://dotnet.developpez.com/aspnet/ ].

El documento se ha redactado de tal manera que se pueda leer sin necesidad de tener una computadora a la mano. Por ello, se incluyen muchas capturas de pantalla.

1.1. El papel de ASP.NET y MVC en una aplicación web

En primer lugar, situemos a ASP.NET MVC en el desarrollo de una aplicación web. Por lo general, esta se construirá sobre una arquitectura de múltiples capas como la siguiente:

  • La capa [Web] es la que está en contacto con el usuario de la aplicación web. Este interactúa con la aplicación web a través de páginas web visualizadas por un navegador. Es en esta capa donde se encuentran ASP.NET y MVC, y únicamente en esta capa;
  • la capa [métier] implementa las reglas de gestión de la aplicación, tales como el cálculo de un salario o de una factura. Esta capa utiliza datos provenientes del usuario a través de la capa [Web] y de SGBD a través de la capa [DAO];
  • La capa [DAO] (Objetos de acceso a datos), la capa [ORM] (Mapeador objeto-relacional) y el conector ADO.NET gestionan el acceso a los datos de SGBD. La capa [ORM] sirve de puente entre los objetos manipulados por la capa [DAO] y las filas y columnas de las tablas de una base de datos relacional. Actualmente se utilizan dos ORM en todo el mundo: NET, NHibernate (http://sourceforge.net/projects/nhibernate/) y Entity Framework (http://msdn.microsoft.com/en-us/data/ef.aspx);
  • la integración de las capas se puede llevar a cabo mediante un contenedor de inyección de dependencias (Dependency Injection Container) como Spring (http://www.springframework.net/);

La mayoría de los ejemplos que se presentan a continuación utilizarán solo una capa, la capa [Web]:

Sin embargo, este documento concluirá con la construcción de una aplicación web de múltiples capas:

1.2. El modelo de desarrollo de ASP.NET MVC

ASP.NET MVC implementa el modelo de arquitectura conocido como MVC (Modelo – Vista – Controlador) de la siguiente manera:

El procesamiento de una solicitud de un cliente se lleva a cabo de la siguiente manera:

  1. solicitud: las URL solicitadas tienen el formato http://machine:port/contexte/Controlleur/Action/param1/param2/....?p1=v1&p2=v2&.... El [Front Controller] utiliza un archivo de configuración para «enrutar» la solicitud hacia el controlador adecuado y la acción correcta dentro de ese controlador. Para ello, utiliza la ruta [Controlleur/Action] del URL. El resto de URL y [/param1/param2/...] son parámetros opcionales que se transmitirán a la acción. La C de MVC es aquí la cadena [Front Controller, Contrôleur, Action]. Si la ruta [Controlleur/Action] no conduce a un controlador o una acción existente, el servidor web responderá que no se encontró la acción solicitada URL.
  1. El procesamiento
  • La acción seleccionada puede utilizar los parámetros parami que le transmitió [Front Controller]. Estos pueden provenir de varias fuentes:
  • de la ruta [/param1/param2/...] de la acción URL,
  • de los parámetros [p1=v1&p2=v2] del URL,
  • de los parámetros enviados por el navegador junto con su solicitud;
  • al procesar la solicitud del usuario, la acción puede requerir la capa [métier] [2b]. Una vez procesada la solicitud del cliente, esta puede generar diversas respuestas. Un ejemplo clásico es:
  • una página de error si la solicitud no se pudo procesar correctamente
  • una página de confirmación en caso contrario
  • la acción solicita que se muestre una vista específica [3]. Esta vista mostrará datos que se denominan el modelo de la vista. Este es el M de MVC. La acción creará este modelo M [2c] y solicitará que se muestre una vista V [3];
  1. respuesta: la vista V seleccionada utiliza el modelo M creado por la acción para inicializar las partes dinámicas de la respuesta HTML que debe enviar al cliente y, a continuación, envía dicha respuesta.

Ahora, aclaremos la relación entre la arquitectura web MVC y la arquitectura en capas. Dependiendo de la definición que se le dé al modelo, estos dos conceptos pueden estar relacionados o no. Tomemos una aplicación web ASP.NET MVC de una sola capa:

Si implementamos la capa [Web] junto con ASP.NET y MVC, tendremos una arquitectura web MVC, pero no una arquitectura multicapa. En este caso, la capa [Web] se encargará de todo: presentación, lógica de negocio y acceso a los datos. Serán las acciones las que realicen este trabajo.

Ahora, consideremos una arquitectura web multicapa:

La capa [Web] puede implementarse sin un marco de trabajo y sin seguir el modelo MVC. En este caso, sí tenemos una arquitectura multicapa, pero la capa web no implementa el modelo MVC.

De este modo, la capa [Web] mencionadapuede implementarse con ASP.NET y MVC, con lo que se obtiene una arquitectura en capas con una capa [Web] del tipo MVC. Una vez hecho esto, se puede reemplazar esta capa ASP.NET MVC por una capa ASP.NET clásica (WebForms) manteniendo el resto (de negocio, DAO, ORM) tal como está. De esta manera, tenemos una arquitectura en capas con una capa [Web] que ya no es del tipo MVC.

En MVC, dijimos que el modelo M era el de la vista V, c.a.d, es decir, el conjunto de datos mostrados por la vista V. Se proporciona otra definición del modelo M de MVC:

Muchos autores consideran que lo que se encuentra a la derecha de la capa [Web] forma el modelo M de MVC. Para evitar ambigüedades, se puede hablar de:

  • del modelo del dominio cuando nos referimos a todo lo que se encuentra a la derecha de la capa [Web]
  • del modelo de la vista cuando nos referimos a los datos que muestra una vista V

En lo sucesivo, el término «modelo M» se referirá exclusivamente al modelo de una vista V.

1.3. Las herramientas utilizadas

A continuación, utilizamos (septiembre de 2013) las versiones Express de Visual Studio 2012:

  • [http://www.microsoft.com/visualstudio/fra/products/visual-studio-express-for-windows-desktop ] para aplicaciones de escritorio;
  • [http://www.microsoft.com/visualstudio/fra/products/visual-studio-express-for-Web ] para aplicaciones web.

Para instalar las últimas versiones de estos productos, se puede utilizar el producto [Web Platform Installer] de Microsoft (http://www.microsoft.com/Web/downloads/platform.aspx).

Además, se utilizará el navegador Chrome de Google (http://www.google.fr/intl/fr/chrome/browser/). Se le agregará la extensión [Advanced Rest Client] . Se puede proceder de la siguiente manera:

 
  • la aplicación estará entonces disponible para descargar:
  • Para obtenerla, deberá crear una cuenta de Google. [Google Web Store] solicita luego la confirmación [1]:
  • En [2], la extensión agregada está disponible en la opción [Applications] [3]. Esta opción aparece en cada nueva pestaña que crees (CTRL-T) en el navegador.

1.4. Los ejemplos

La mayoría de los ejemplos de aprendizaje se limitarán únicamente a la capa web:

Una vez finalizado este curso, presentaremos una aplicación web de múltiples capas: