Главная > ASP.NET > ASP.NET MVC для начинающих. Часть 1. Введение.

ASP.NET MVC для начинающих. Часть 1. Введение.

Этой статьей я хочу открыть цикл уроков по ASP.NET MVC на русском языке, данный курс будет нацелен на тех, кто совсем не знаком с паттерном MVC и совсем не знает, что это такое. На русском информации для совсем новичков на данный момент практически нет, поэтому начать обучение с нуля достаточно сложно. Следует оговориться — я являюсь точно таким же новичком, для которых будут предназначены эти уроки, сейчас я занялся изучением этой новой для ASP.NET технологии и хочу упорядочить и структировать полученные знания, а также помочь тем, кто недавно стал разбираться с этим вопросом. Я не буду говорить на тему "Что лучше — Webforms или MVC ?" или "Почему вам нужен / не нужен MVC", об этом можете самостоятельно почитать в паблике, что, кстати, рекомендую сделать, здесь будет только практика. Итак, поехали !

Для начала нам нужно скачать и установить пакет MVC V2 Preview. Для работы потребуется Visual Studio 2008, так же подойдет бесплатная версия Visual Web Developer. После установки пакета в студии жмем Create -> Project, в перечне темплейтов выбираем ASP.NET MVC 2 Web Application, создаем проект.

Те, кто создавал веб-приложения, используя Webforms, сразу заметять, что очень сильно изменена структура каталогов проекта:
/Properties — стандартная директория для Web Application, содержит настройки проекта.
/References — ссылки на другие сборки, проекты и т.д.
/App_Data — специальная директория для хранения данных
/Content — в этой директории предполагается хранить весь статический контент, к слову, это лишь предполагается. На самом деле, мы можем хранить его в любой другой созданной папке, например, можем создать папку "Design" и хранить в ней графические темы.
/Controllers — классы Контроллеров
/Models — классы Модели
/Views — представления для приложения (ГУИ). В этой директории создаются директории для каждого контроллера (/Views/Home). Для каждого контроллера создается свое представление.
/View/Shared — "расшаренные вещи" типа MasterPages и UserControls.

Запускаем проект, ходим по кнопкам, смотрим на то, что для нас сделал майкрософт. Обратите внимание на адресную строку, урлы в ней имеют вид http://domain/{controller}/{action}, выглядит как ЧПУ, вот только ЧПУ обычно получается путем реврайта урла, а здесь — нет, это так называемый "routing". Его поведение определяет файл Global.asax.cs. Пойдем дальше и сделаем что-нибудь сами.

Удаляем следующие вещи:
1). папку App_Data;
2). из папки Controllers — AccountController.cs;
3). папку Account;
4). все из папки Home;
5). все из папки Shared;

Идем в HomeController.cs, удаляем весь код, пишем свой, что-то типа:

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.Mvc;

namespace MvcApplication1.Controllers
{
    public class HomeController : Controller
    {
        public string Index()
        {
            return "Hello, world!";
        }
    }
}

Запускаем — видим "Hello, world!". Работает это так:
1). При создании приложения в файле Global.asax методом Application_Start определяются маршруты, которые мы указали ранее.
2). Запрос обрабатывает класс UrlRoutingModule — стандартная часть ASP.NET, которую естественно можно использовать вне MVC Framework. UrlRoutingModule берет первый подходящий маршрут из нашей коллекции маршрутов. UrlRoutingModule, на основании маршрута, представленного объектом типа Route, создает объект типа RequestContext. RequestContext содержит данные о контексте выполнения запроса и данные касающиеся текущего маршрута;
3). Каждому маршруту по умолчанию сопоставляется обработчик маршрутов в виде объекта MVCRouteHandler, который в общем случае создает и возвращает экземпляр класса MVCHandler, которому передается созданный ранее объект RequestContext;
4). MVCHandler делает последний шаг, он создает фабрику контроллеров и с помощью нее получает необходимый для продолжения обработки запроса объект контроллера MVC Framework.

Это наше первое занятие, не будем забивать голову этой последовательностью, снова посмотрим на урл: http://domain/ , введем немного по-другому: http://domain/home/index — результат один и тот же. Почему это происходит при обоих на первый взгляд различных вариантах урл ? Снова идем смотреть на Global.asax. Видим следующее:

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.Mvc;
using System.Web.Routing;

namespace MvcApplication1
{
    // Note: For instructions on enabling IIS6 or IIS7 classic mode,
    // visit http://go.microsoft.com/?LinkId=9394801

    public class MvcApplication : System.Web.HttpApplication
    {
        public static void RegisterRoutes(RouteCollection routes)
        {
            routes.IgnoreRoute("{resource}.axd/{*pathInfo}");

            routes.MapRoute(
                "Default",                                              // Route name
                "{controller}/{action}/{id}",                           // URL with parameters
                new { controller = "Home", action = "Index", id = "" }  // Parameter defaults
            );

        }

        protected void Application_Start()
        {
            RegisterRoutes(RouteTable.Routes);
        }
    }
}

Cледовательно, в первом случае, когда мы не указываем ни action ни controller, их значения берутся по умолчанию, т.е. вызывается action «Index» контроллера «Home».
Это мы немного познакомились с контроллером. Займемся теперь "вьюхой" или View. Заменим код нашего контроллера на

    public class HomeController : Controller
    {
        public ViewResult Index()
        {
            return View();
        }
    }

Но пока не запускаем приложение. Как видно из кода, метод Index() теперь возвращает не string, а представление View(), поэтому мы указываем тип возвращаемого значения как ViewResult. Возвращать он конечно возвращает, вот только самой вьюхи пока нет. Правой кнопкой мыши либо на View(), либо на Index() выбираем Add View. Мы не используем MasterPage, поэтому снимаем галку в появившемся окне в этом месте, нажимаем Add. В папке Views/Home появилась наша вьюха Index.aspx. Теперь она будет возвращать Html-код при запросе http://domain/home/index или http://domain/. Исправим метод Index() контроллера HomeController, чтобы в этом убедиться:

        public ViewResult Index()
        {
            ViewData["time"] = DateTime.Now.TimeOfDay;
            return View();
        }

а в самой вьюхе между тегом body добавим

<%= Html.ViewData["time"] %>

Запускаем — видим текущее время.

Пришло время повозиться с моделью Model, модель будет максимально проста для первого раза. Классы Модели отвечают за работу с данными. В нашем примере рассмотрим глупый случай, чтобы лишний раз не напрягать воображение, создадим класс, для получения содержимого файла Content/Site.css, если вы ничего не меняли в нашем приложении, то этот файл будет присутствовать. В папку модель добавляем класс MyModel, с кодом:

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.IO;
using System.Text;

namespace MvcApplication1.Models
{
    public class MyModel
    {
        public string css { get; set; }

        public MyModel(string id)
        {
            css = id;
            getCss(css);
        }

        public void getCss(string page)
        {
            FileStream aFile = new FileStream(page, FileMode.Open);
            StreamReader sr = new StreamReader(aFile, Encoding.GetEncoding(1251));

            css = sr.ReadToEnd();
            sr.Close();
        }
    }
}

Данный код никакого отношения к MVC не имеет, поэтому комментировать ничего не буду, вроде все понятно и так. В HomeController вновь переписываем метод Index(), на этот раз так пусть будет выглядеть так:

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.Mvc;
using MvcApplication1.Models;

namespace MvcApplication1.Controllers
{
    public class HomeController : Controller
    {
        public ViewResult Index()
        {
            MyModel mm = new MyModel(Server.MapPath("~/Content/Site.css"));
            ViewData["css"] = mm.css;
            return View();
        }
    }
}

Обратите внимание, мы подключаем еще одно пространство имен:

using MvcApplication1.Models;

Во вьюхе в теге body добавляем:

<%= Html.ViewData["css"] %>

нажимаем F5, смотрим на получившийся кошмар :).
Итак, что мы имеем:
1). Модель MyModel — отвечает за получение содержимого файла Content/Site.css;
2). Контроллер HomeController — связывает модель и вьюху, выбирает, каким образом клиент получит данные (нужная вьюха);
3). Представление Index — то, что увидит пользователь на экране.

Вроде как идея шаблона MVC соблюдена. Почин сделан. Жду поправок и комментариев. Продолжение следует…

  1. Михаил
    7 августа 2010 в 11:32 | #1

    Добрый день, по каким то причинам, выдает ошибку, ругается что не может найти путь к Site.css. В чем может быть проблема ?

  2. Михаил
    7 августа 2010 в 11:34 | #2

    Вопрос отпал сам собой, был невнимателен, все из-за опечатки.

  3. 9 августа 2010 в 20:27 | #3

    Такое часто бывает во время копипаста 🙂 .

  4. Man In The Box
    11 июля 2011 в 07:08 | #4

    не удобно копипастить уберите цифры слева от кода.

  5. 12 июля 2011 в 18:58 | #5

    Нажмите на кнопку «View source» в правом верхнем углу.

  6. Андрей
    29 сентября 2011 в 21:41 | #6

    ААА! Спасибо. Ппц как помогло).

  7. 30 сентября 2011 в 20:19 | #7

    Рад, что помогло:) — значит не зря статью написал.

  8. Queeni
    15 ноября 2011 в 15:30 | #8

    Конечно не зря, начинающим весьма полезно. Благодарю)

  9. Vasiliy
    13 декабря 2011 в 18:04 | #9

    admin :
    Рад, что помогло:) – значит не зря статью написал.

    А не стыдно копипаст из книги Стивена Сандерсона называть своей статьёй?

  10. 15 декабря 2011 в 20:14 | #10

    Василий-Василий, какой копипаст ? Во-первых, посмотри на дату публикации статьи и дату выхода русскоязычной версии книги указанного тобою автора, так что как минимум, эта статья — перевод, а в этом нет ничего плохого, да и не совсем это перевод, скорее компиляция некой базовой стартовой информации на русском языке (не только из книги Сандерсона, но ты наверное других и не читал), что часто необходимо для начинающих. Ну а во-вторых, не нравится ? — иди мимо, мягко говоря :).

  11. Elena
    12 января 2012 в 11:43 | #11

    Знаю что не по теме, но прочла ваш ответ  » не только из книги Сандерсона, но ты наверное других и не читал» вот и просьба созрела, подскажите книги на доступном( желательно русском языке)
    для начинающего в MVC3!
    Заранее спасибо.
    Елена

  12. 14 января 2012 в 18:06 | #12

    Для начинающих на русском могу порекомендовать книгу небезызвестных Гайдара Магданурова и Владимира Юнева «ASP.NET MVC Framework» — в ней все кратко сжато и понятно, на английском — ASP.NET MVC 1.0 Quickly (почти все тоже самое, что и предыдущая, читается легко). Вообще, больше полезной информации в тематических блогах. Так же рекомендую видеоуроки от Pluralsight.

  13. Димка
    24 января 2012 в 03:37 | #13

    спасибо, для новичка самое то!

    Не могли бы немного по коду дат комментарии:

    метод класса называется — getCss
    почему обращение к нему такое — …..= mm.css; ?

  14. 24 января 2012 в 19:55 | #14

    Здесь плохо написано, дело-то давно было :), можно как-нибудь так:

    public class MyModel
    {
    public string Css { get; private set; }

    public MyModel(string path)
    {
    using (var aFile = new FileStream(path, FileMode.Open))
    {
    using (var sr = new StreamReader(aFile, Encoding.GetEncoding(1251)))
    {
    Css = sr.ReadToEnd();
    }
    }
    }
    }

    а вызывать как mm.Css .

  15. Mr.Firestarter
    12 марта 2012 в 16:13 | #15

    Вот только-только взялся за МVC. vs 2008. Поставил MVC1 Visual Web Developer
    Срубился уже на первом примере.Сделал как сказали

    1). папку App_Data;
    2). из папки Controllers — AccountController.cs;
    3). папку Account;
    4). все из папки Home;
    5). все из папки Shared;

    (хотя только в папке Shared находился site.master.).Вылезла ошибка
    The view ‘Index’ or its master could not be found. The following locations were searched:
    ~/Views/Home/Index.aspx
    ~/Views/Home/Index.ascx
    ~/Views/Shared/Index.aspx
    ~/Views/Shared/Index.ascx.
    Собственно что я сделал не так?

  16. 12 марта 2012 в 21:21 | #16

    Не находится вьюха ни по одному из перечисленных адресов, удалить вы ее удалили, но не создали заново, внимательно прочитайте статью.

  17. Сергей
    30 июля 2013 в 10:09 | #17

    Хорошее начало, все подробно описано. Спасибо.

  18. Василий
    6 августа 2014 в 04:45 | #18

    Здравствуйте. Сделал пример. Мне понравилось. Правда были кое-какие проблемы. Но их самостоятельно решил. В целом начинаю вникать в MVC. Сильная тема. Но надо больше работать
    Спасибо за статью и успехов!

  1. Пока что нет уведомлений.