Tutorial: Crear un proyecto de MVC bsico con pruebas unitarias en Visual Studio.NET Framework 4 Personas que lo han encontrado til: 10 de 13 - Valorar este tema Este tutorial muestra cmo puede crear una aplicacin ASP.NET MVC en Visual Studio. En este tutorial, crear y ejecutar la aplicacin MVC de ejemplo. A continuacin, personalizar la aplicacin agregando un controlador y una vista. Adems, este tutorial muestra cmo utilizar el desarrollo basado en pruebas (TDD). En el tutorial, crear un proyecto que contiene pruebas unitarias para la aplicacin MVC. Un proyecto de Visual Studio con cdigo fuente est disponible como acompaamiento de este tema: Download.Requisitos previosPara poder completar este tutorial, necesitar: Microsoft Visual Studio 2008 Service Pack 1 o posterior.Nota

Visual Studio Standard Edition y Visual Web Developer Express no admiten los proyectos de prueba unitaria. Puede utilizar estas versiones de Visual Studio para ejecutar las partes de este tutorial relacionadas con la creacin y ejecucin de un proyecto de ASP.NET MVC. Sin embargo, no podr trabajar con las pruebas unitarias como se explica en este tutorial.

El marco de ASP.NET MVC 2. Si ha instalado Visual Studio 2010, ASP.NET MVC 2 ya est instalado en su equipo. Para descargar la versin ms actualizada del marco, vea la pgina de descarga de ASP.NET MVC. Crear un proyecto de MVC nuevoPara empezar, crear un proyecto nuevo de ASP.NET MVC.Para crear un proyecto nuevo de MVC1. En el men Archivo, haga clic en Nuevo proyecto.Aparecer el cuadro de dilogo Nuevo proyecto.

2. En la esquina superior derecha, asegrese de que est seleccionado .NET Framework 3.5.3. En Tipos de proyecto, expanda Visual Basic o Visual C# y, a continuacin, haga clic en Web.4. En Plantillas instaladas de Visual Studio, seleccione Aplicacin web de ASP.NET MVC 2.5. En el cuadro Nombre, escriba MvcBasicWalkthrough.6. En el cuadro Ubicacin, escriba un nombre para la carpeta de proyecto.7. Si desea que el nombre de la solucin difiera del nombre del proyecto, escriba un nombre en el cuadro Nombre de la solucin.8. Seleccione Crear directorio para la solucin.9. Haga clic en Aceptar.Aparecer el cuadro de dilogo Crear proyecto de prueba unitaria.

Nota

Si est utilizando las ediciones Standard o Express de Visual Studio, no se muestra el cuadro de dilogo Crear proyecto de prueba unitaria. En su lugar, el nuevo proyecto de aplicacin MVC se genera sin un proyecto de prueba.

10. Seleccione S, crear un proyecto de prueba unitaria.De forma predeterminada, el nombre del proyecto de prueba es el nombre del proyecto de aplicacin y se le agrega "Tests". Sin embargo, puede cambiar el nombre del proyecto de prueba. De forma predeterminada, el proyecto de prueba utilizar el marco de pruebas unitarias de Visual Studio. Para obtener informacin sobre cmo utilizar un marco de pruebas de otro fabricante, vea Cmo: Agregar un marco de pruebas de ASP.NET MVC personalizado en Visual Studio. 11. Haga clic en Aceptar.Se generan el nuevo proyecto de aplicacin MVC y un proyecto de prueba. (Si est utilizando las ediciones Standard o Express de Visual Studio, no se crea el proyecto de prueba.) Examinar el proyecto de MVCLa ilustracin siguiente muestra la estructura de carpetas de una solucin de MVC recin creada.

La estructura de carpetas de un proyecto de MVC difiere de la de un proyecto de sitio web de ASP.NET. El proyecto de MVC contiene las carpetas siguientes: Content, para los archivos de compatibilidad del contenido. Esta carpeta contiene la hoja de estilos en cascada (archivo .css) para la aplicacin. Controllers, para los archivos de controlador. Esta carpeta contiene los controladores de ejemplo de la aplicacin, que se denominan AccountController y HomeController. La clase AccountController contiene la lgica de inicio de sesin para la aplicacin. La clase HomeController contiene la lgica a la que se llama de forma predeterminada cuando la aplicacin se inicia. Models, para los archivos de modelo de datos como los archivos .dbml de LINQ to SQL o los archivos de entidad de datos. Scripts, para los archivos de script, como los compatibles con ASP.NET AJAX y jQuery. Views, para los archivos de paginacin de vistas. Esta carpeta contiene tres subcarpetas: Account, Home y Shared. La carpeta Account contiene vistas que se utilizan como interfaz de usuario para el inicio de sesin y para cambiar las contraseas. La carpeta Home contiene una vista Index (la pgina de inicio predeterminada para la aplicacin) y una vista de pgina Acerca de. La carpeta Shared contiene la vista de la pgina maestra para la aplicacin. Si est utilizando una edicin de Visual Studio distinta de Standard o Express, tambin se gener un proyecto de prueba. El proyecto de prueba tiene una carpeta Controllers que contiene la clase HomeControllerTest. Esta clase tiene una prueba unitaria para cada mtodo de accin HomeController (Index y About). El proyecto de MVC recin generado es una aplicacin completa que puede compilar y ejecutar sin cambios. La ilustracin siguiente muestra cmo apareca la aplicacin al ejecutarla en un explorador.

El proyecto de prueba unitaria tambin est listo para compilar y ejecutar. Para este tutorial, agregar un controlador con un mtodo de accin y una vista y agregar una prueba unitaria para el mtodo de accin. Agregar un controladorAhora agregar un controlador que contiene la lgica para descargar mapas urbanos del servicio Web Microsoft Virtual Earth.Para agregar un controlador al proyecto de MVC1. En el Explorador de soluciones, haga clic con el botn secundario en la carpeta Controllers, haga clic en Agregar y, a continuacin, haga clic en Controlador.Aparece el cuadro de dilogo Agregar controlador.

2. En el cuadro Nombre, escriba MapsController.El marco de ASP.NET MVC exige que los nombres de controlador acaben en "Controller", como HomeController, GameController o MapsController.3. Desactive la casilla Agregar mtodos de accin para los escenarios Create, Update y Details.4. Haga clic en Agregar. Visual Studio agrega la clase MapsController al proyecto y lo abre en el editor.Crear un cdigo auxiliar de mtodo de accinPara aplicar tcnicas de desarrollo basado en pruebas (TDD) a este proyecto debe escribir la prueba unitaria para un mtodo de accin antes de escribir el propio mtodo de accin. Sin embargo, si desea que su prueba unitaria se compile, debe tener un cdigo auxiliar para el mtodo de accin planeado, que en este tutorial es ViewMaps. Para agregar un cdigo auxiliar de mtodo de accin1. Abra o cambie a la clase MapsController.2. Reemplace el mtodo de accin Index con el cdigo siguiente para crear el cdigo auxiliar de mtodo de accin ViewMaps.VBFunction ViewMaps() ' Add action logic here Throw New NotImplementedException()End FunctionC#public ActionResult ViewMaps(){ // Add action logic here throw new NotImplementedException();}Agregar pruebas unitarias para mtodos de accinA continuacin agregar una clase de prueba de controlador al proyecto de pruebas. En la clase, agregar una prueba unitaria para el mtodo de accin ViewMaps. Se producir un error en la prueba unitaria, porque el cdigo auxiliar de mtodo de accin ViewMaps produce una excepcin. Al finalizar el mtodo de accin posteriormente en este tutorial, la prueba se realizar correctamente. Para agregar pruebas unitarias para los mtodos de accin1. En el proyecto de pruebas, haga clic con el botn secundario del mouse en la carpeta Controllers, haga clic en Agregar y despus haga clic en Clase.2. En el cuadro de texto Nombre, escriba MapsControllerTest.3. Haga clic en Agregar.Visual Studio agrega la clase MapsControllerTest al proyecto de prueba.4. Abra la clase MapsControllerTest y escriba el cdigo que se muestra a continuacin:C#VB

using System;using System.Collections.Generic;using System.Linq;using System.Text;using Microsoft.VisualStudio.TestTools.UnitTesting;using System.Web.Mvc;using MvcBasicWalkthrough;using MvcBasicWalkthrough.Controllers;

namespace MvcBasicWalkthrough.Tests.Controllers{ [TestClass] public class MapsControllerTest { [TestMethod] public void ViewMaps() { // Arrange MapsController controller = new MapsController();

// Act ViewResult result = controller.ViewMaps() as ViewResult;

// Assert Assert.IsNotNull(result); } }}

Este cdigo define las pruebas unitarias para el mtodo de accin que terminar despus.5. En Explorador de soluciones, seleccione el proyecto de prueba y presione CTRL+F5 para ejecutar las pruebas unitarias.La prueba produce un error, porque el mtodo de accin ViewMaps produce una excepcin actualmente.Agregar el cdigo al mtodo de accinAhora agregar el cdigo a la clase MapsController para el mtodo de accin ViewMaps con objeto de representar la vista Maps.Para agregar el cdigo al mtodo de accin1. Abra la clase MapsController y reemplace el cdigo auxiliar de mtodo de accin ViewMaps con el cdigo siguiente para representar la vista Maps:C#VB

public ActionResult ViewMaps(){ return View();}

2. Guarde y cierre el archivo.Agregar una vistaDespus agregar una vista Maps. Para mantener las vistas organizadas, agregar primero una carpeta Maps bajo la carpeta Views. Para agregar una vista de contenido de pgina al proyecto de MVC1. Abra la clase MapsController, haga clic con el botn secundario del mouse dentro del mtodo de accin ViewMaps y, a continuacin, haga clic en Agregar vista.Se mostrar el cuadro de dilogo Agregar vista.

2. En el cuadro Nombre de vista, escriba ViewMaps.3. Desactive las casillas Crear una vista parcial (.ascx) y Crear una vista fuertemente tipada.4. Active la casilla Seleccionar la pgina maestra y establezca la pgina maestra en ~/Views/Shared/Site.Master.5. Establezca ContentPlaceHolder ID en "MainContent".6. Haga clic en Agregar.La nueva vista se agrega al proyecto en la carpeta Maps.Agregar contenido a la vistaA continuacin, agregar contenido a la nueva vista.Para agregar contenido a la vista1. Abra ViewMaps.aspx y agregue el contenido siguiente dentro del elemento Content:None

My City MapsSelect map:

Seattle, WA Las Vegas, NV Salt Lake City, UT Dallas, TX Chicago, IL New York, NY Rio de Janeiro, Brazil Paris, France Naples, Italy Keta, Ghana Beijing, China Sydney, Australia

var map = null; var mapID = '';

function GetMap(mapID) { switch (mapID) { case 'Seattle': map = new VEMap('earthMap'); map.LoadMap(new VELatLong(47.6, -122.33), 10 ,'i', true); break; case 'LasVegas': map = new VEMap('earthMap'); map.LoadMap(new VELatLong(36.17, -115.14), 10 ,'i' ,true); break; case 'SaltLake': map = new VEMap('earthMap'); map.LoadMap(new VELatLong(40.75, -111.89), 10 ,'i' ,true); break; case 'Dallas': map = new VEMap('earthMap'); map.LoadMap(new VELatLong(32.78, -96.8), 10 ,'i' ,true); break; case 'Chicago': map = new VEMap('earthMap'); map.LoadMap(new VELatLong(41.88, -87.62), 10 ,'i' ,true); break; case 'NewYork': map = new VEMap('earthMap'); map.LoadMap(new VELatLong(40.7, -74), 10 ,'i' ,true); break; case 'Rio': map = new VEMap('earthMap'); map.LoadMap(new VELatLong(-22.91, -43.18), 10 ,'i' ,true); break; case 'Paris': map = new VEMap('earthMap'); map.LoadMap(new VELatLong(48.87, 2.33), 10 ,'i' ,true); break; case 'Naples': map = new VEMap('earthMap'); map.LoadMap(new VELatLong(40.83, 14.25), 10 ,'i' ,true); break; case 'Keta': map = new VEMap('earthMap'); map.LoadMap(new VELatLong(5.92, 0.983), 10 ,'i' ,true); break; case 'Beijing': map = new VEMap('earthMap'); map.LoadMap(new VELatLong(39.91, 116.39), 10 ,'i' ,true); break; case 'Sydney': map = new VEMap('earthMap'); map.LoadMap(new VELatLong(-33.86, 151.21), 10 ,'i' ,true); } }

Este marcado define una lista desplegable para seleccionar un mapa y la lgica de JavaScript para recuperar el mapa seleccionado del servicio Web Microsoft Virtual Earth.2. Guarde y cierre el archivo.Agregar una pestaa al men de pgina maestraAgregar ahora un elemento al men de pgina maestra que llama al mtodo de accin ViewMaps.Para agregar una pestaa al men de pgina maestra1. En la carpeta Shared, abra el archivo Site.master y busque la lista no ordenada (elemento ul) en el elemento div cuyo identificador es "menucontainer".2. Agregue el cdigo siguiente a la lista entre el ndice y las pestaas About Us:None

El mtodo ActionLink es un mtodo auxiliar con vnculos a un mtodo de accin. Toma los parmetros siguientes: el texto del vnculo, el nombre del mtodo de accin y el nombre del controlador. 3. Guarde y cierre el archivo.Probar la aplicacin MVCYa puede probar la aplicacin.Para probar la aplicacin MVC1. En el men Prueba, haga clic sucesivamente en Ejecutar, Todas las pruebas de la solucin.Los resultados se muestran en la ventana Resultados de pruebas. Esta vez las pruebas se realizan correctamente. 2. En Explorador de soluciones, seleccione el proyecto de tutorial y presione CTRL+F5 para ejecutar la aplicacin.Se muestra la pgina Index.aspx, que incluye las pestaas que estn definidas en la pgina maestra.3. Haga clic en la pestaa My City Maps.Se muestra la pgina My City Maps. Seleccione cualquier mapa para verlo en pantalla.

Pasos siguientesEste tutorial le ofrece una primera muestra de la creacin de una aplicacin MVC y el trabajo con pruebas unitarias en ASP.NET MVC. A partir de ahora, puede obtener ms informacin sobre el marco de ASP.NET MVC. La lista siguiente sugiere otros temas de aprendizaje adicionales. Para obtener ms informacin sobre los controladores de MVC, vea Controladores y mtodos de accin en aplicaciones ASP.NET MVC. Para obtener ms informacin sobre las vistas de MVC, vea Vistas y presentacin de la interfaz de usuario en aplicaciones de ASP.NET MVC. Para obtener ms informacin sobre los modelos de MVC, vea Modelos y validacin en ASP.NET MVC. Para obtener ms informacin sobre el enrutamiento de direcciones URL, vea Enrutamiento de ASP.NET.Vea tambinTareasCmo: Agregar un marco de pruebas de ASP.NET MVC personalizado en Visual StudioOtros recursosASP.NET MVC 2Informacin general sobre MVC en ASP.NET

Tutorial: Usar la autenticacin de formularios en ASP.NET MVC.NET Framework 4 Personas que lo han encontrado til: 3 de 3 - Valorar este tema Muchas aplicaciones web necesitan un mecanismo para restringir el acceso a algunos recursos (como determinadas pginas), de modo que estos recursos estn accesibles nicamente a los usuarios autenticados. La plantilla de proyecto de aplicacin web predeterminada de ASP.NET MVC proporciona un controlador, modelos de datos y vistas que se pueden usar para agregar la autenticacin de formularios de ASP.NET a la aplicacin. La funcionalidad integrada permite a los usuarios registrarse, iniciar y cerrar sesin y cambiar su contrasea. En muchas aplicaciones, esta funcionalidad proporciona un nivel suficiente de autenticacin del usuario. En este tutorial se muestra la funcionalidad que se proporciona de forma predeterminada para la autenticacin de formularios de ASP.NET en una aplicacin ASP.NET MVC. En el tutorial se muestran las siguientes tareas: Cmo se crea una aplicacin de ASP.NET MVC que contenga la funcionalidad de autenticacin integrada. Cmo se usan las caractersticas integradas para crear una nueva cuenta de usuario. Cmo pueden cambiar la contrasea los usuarios conectados. Cmo se restringe el acceso a determinadas vistas de modo que solo los usuarios autenticados (conectados) puedan verlas.Requisitos previosPara poder completar este tutorial, necesitar: Microsoft Visual Studio 2008 Service Pack1, Visual Web Developer 2008 Express Edition Service Pack1 o una versin posterior de Visual Studio. El marco ASP.NET MVC 2. Si tiene instalado Visual Studio 2010, ASP.NET MVC 2 ya est instalado en el equipo. Para descargar la versin ms actualizada del marco, vea la pgina de descarga de ASP.NET MVC. En este tutorial se supone que est familiarizado con ASP.NET MVC. Para obtener ms informacin, vea ASP.NET MVC 2. Crear una aplicacin web de ASP.NET MVCPara comenzar, cree una nueva aplicacin web de ASP.NET MVC.Para crear una aplicacin de ASP.NET MVC1. En el men Archivo, haga clic en Nuevo proyecto.2. En Tipos de proyecto del cuadro de dilogo Nuevo proyecto, expanda Visual Basic o Visual C# y, a continuacin, haga clic en Web.3. En Plantillas instaladas de Visual Studio, seleccione Aplicacin web de ASP.NET MVC 2.4. En el cuadro Nombre, escriba MvcAuthentication.5. En el cuadro Ubicacin, escriba el nombre de la carpeta de proyecto.6. Seleccione Crear directorio para la solucin.7. Haga clic en Aceptar.8. En el cuadro de dilogo Crear proyecto de prueba, seleccione No, no crear un proyecto de prueba unitaria y, a continuacin, haga clic en Aceptar.Nota

Si est usando la edicin Standard de Visual Studio, no se muestra el cuadro de dilogo Crear proyecto de prueba unitaria.

9. Se crea el nuevo proyecto de aplicacin MVC.Controlador Account, modelos y vistasEn la carpeta Controllers, la clase de controladores AccountController contiene mtodos de accin que pueden registrar un nuevo usuario, conectar y desconectar al usuario de la aplicacin y cambiar la contrasea de un usuario existente. En la carpeta Views, la carpeta Accounts contiene las vistas que admiten estas acciones. En la carpeta Models, la clase AccountModels contiene clases que definen los objetos de datos, servicios y rutinas de validacin que son compatibles con la autenticacin de formularios. En la carpeta Views, la subcarpeta Shared contiene un control denominado LogOnUserControl.ascx que indica si el usuario ha iniciado sesin. El control se muestra en la parte superior de la vista de la pgina maestra. Cuando el usuario no ha iniciado sesin, el control muestra "Iniciar sesin" y establece un vnculo con la vista LogOn. Cuando el usuario inicia sesin, el control muestra un mensaje de bienvenida que incluye el nombre de usuario y un vnculo que permite al usuario cerrar la sesin. Registrar un usuarioEn esta parte del tutorial, usar las caractersticas integradas de la aplicacin para registrar a un nuevo usuario y examinar cmo se almacena la informacin del usuario.Para registrar un nuevo usuario1. Presione CTRL-F5 para ejecutar la aplicacin.2. En la parte superior de la pgina, haga clic en Iniciar sesin.3. Haga clic en Registrarse.4. Especifique los valores en los cuadros Nombre de usuario, Direccin de correo electrnico, Contrasea y Confirmar contrasea.Anote el nombre de usuario y la contrasea que use, porque necesitar las credenciales ms adelante en este tutorial.5. Haga clic en Registrarse.En la parte superior de la pgina, aparecer un mensaje de bienvenida y un vnculo para cerrar sesin.Cuando registre a un usuario, el marco ASP.NET MVC comprobar si existe el archivo de base de datos de pertenencia a ASP.NET. Si no existe la base de datos, ASP.NET crea un archivo de base de datos denominado ASPNETDB.MDF y lo rellena con las tablas necesarias. Para examinar la base de datos de pertenencia1. En el Explorador de soluciones, haga clic en el botn Actualizar y, a continuacin, expanda la carpeta App_Data.El archivo ASPNETDB.MDF se agrega a la carpeta App_Data.2. En el Explorador de servidores, expanda Conexiones de datos y, a continuacin, expanda ASPNETDB.MDF.Ahora puede examinar las tablas, las vistas de datos y los procedimientos almacenados que conforman la base de datos. Observe que existen tablas, vistas y procedimientos almacenados compatibles con la autenticacin del usuario, los perfiles, la pertenencia y los roles. Cambiar las contraseasLa plantilla de proyecto de ASP.NET MVC proporciona los mtodos de accin y vistas que permiten a los usuarios cambiar las contraseas, aunque deja que usted decida cmo desea usarlas. En este tutorial, agregar un vnculo Cambiar contrasea al control LogOnUserControl.ascx. Como resultado, siempre que un usuario inicie sesin, se mostrar el vnculo a la vista ChangePassword. Para agregar y probar la funcionalidad de cambio de contrasea1. Si la aplicacin web todava se est ejecutando en el explorador, cierre el explorador.2. En la subcarpeta Shared de la carpeta Views, abra el control LogOnUserControl.ascx.3. Inserte el siguiente marcado de vnculo de accin directamente despus del vnculo de accin LogOff:4. [ ]5. Guarde el archivo.6. Presione CTRL-F5 para compilar y ejecutar la aplicacin.7. Inicie sesin con las credenciales del usuario que cre anteriormente.En la parte superior de la pgina se mostrar el mensaje de bienvenida, el vnculo para cerrar sesin y el nuevo vnculo de cambio de contrasea.8. Haga clic en Cambiar contrasea.9. Escriba los valores correspondientes en los cuadros Contrasea actual, Nueva contrasea y Confirmar la nueva contrasea.10. Haga clic en Cambiar contrasea.La contrasea ha cambiado.11. Haga clic en el vnculo Cerrar sesin.12. Haga clic en el vnculo Iniciar sesin y conctese de nuevo usando el mismo nombre de usuario y la nueva contrasea.Restringir el acceso a una vistaAhora que los usuarios pueden iniciar sesin, cerrar sesin y cambiar una contrasea, puede especificar qu partes de la aplicacin deben estar restringidas a los usuarios autenticados. Puede restringir el acceso a una vista usando el atributo AuthorizeAttribute para marcar el mtodo de accin que crea la vista. Puede restringir el acceso a todas las vistas de un controlador usando el atributo AuthorizeAttribute para marcar el propio controlador. Para los fines de este tutorial, limitar el acceso a la vista About.Para restringir el acceso a una vista1. Si la aplicacin web todava se est ejecutando en el explorador, cierre el explorador.2. Abra la clase HomeController y busque el mtodo de accin About.3. Agregue el atributo AuthorizeAttribute a la declaracin del mtodo de accin About, tal y como se muestra en el ejemplo siguiente:C#[Authorize]public ActionResult About(){ return View();}VB _Function About() As ActionResult Return View()End Function4. Guarde el archivo.5. Presione CTRL-F5 para compilar y ejecutar la aplicacin.6. Sin iniciar sesin, haga clic en la pestaa Acerca de.Se mostrar la vista LogOn, ya que ahora necesitar iniciar sesin para poder ver la pgina About.7. Inicie sesin en la aplicacin.8. Haga clic en la pestaa Acerca de.Aparece la pgina About.Pasos siguientesAunque la plantilla de proyecto de ASP.NET MVC proporciona la autenticacin de formularios, tal vez desee obtener ms informacin sobre la pertenencia a ASP.NET y acerca de cmo puede agregar roles a la aplicacin web. Para obtener ms informacin, vea los temas siguientes: Introduccin a la pertenencia Descripcin de la administracin de rolesVea tambinOtros recursosASP.NET MVC 2