Часть 2. контроллерыPart 2: Controllers

Джон Гэллоуэйby Jon Galloway

Музыкальное хранилище MVC — это учебное приложение, в котором представлены и объясняются пошаговые инструкции по использованию ASP.NET MVC и Visual Studio для разработки веб-приложений.The MVC Music Store is a tutorial application that introduces and explains step-by-step how to use ASP.NET MVC and Visual Studio for web development.

Музыкальное хранилище MVC — это упрощенная реализация в магазине, которая продает музыкальные альбомы в сети и реализует базовое администрирование сайта, вход пользователя в систему и функции корзины покупок.The MVC Music Store is a lightweight sample store implementation which sells music albums online, and implements basic site administration, user sign-in, and shopping cart functionality.

В этой серии руководств подробно описаны все шаги, предпринятые для создания примера приложения музыкального хранилища ASP.NET MVC.This tutorial series details all of the steps taken to build the ASP.NET MVC Music Store sample application. Часть 2 охватывает контроллеры.Part 2 covers Controllers.

В традиционных веб-платформах входящие URL-адреса обычно сопоставлены с файлами на диске.With traditional web frameworks, incoming URLs are typically mapped to files on disk. Например: запрос URL-адреса, например "/Продуктс.аспкс" или "/Продуктс.ФП", может обрабатываться файлом Products. aspx или Products. php.For example: a request for a URL like "/Products.aspx" or "/Products.php" might be processed by a "Products.aspx" or "Products.php" file.

Веб-платформы MVC сопоставляют URL-адреса с кодом сервера немного иным образом.Web-based MVC frameworks map URLs to server code in a slightly different way. Вместо сопоставления входящих URL-адресов с файлами они вместо этого сопоставляют URL-адреса с методами в классах.Instead of mapping incoming URLs to files, they instead map URLs to methods on classes. Эти классы называются "контроллерами", они отвечают за обработку входящих HTTP-запросов, обработку входных данных пользователя, получение и сохранение данных, а также определение ответа на отправку клиенту (отображение HTML-кода, скачивание файла, перенаправление в другой URL-адрес и т. д.).These classes are called "Controllers" and they are responsible for processing incoming HTTP requests, handling user input, retrieving and saving data, and determining the response to send back to the client (display HTML, download a file, redirect to a different URL, etc.).

Добавление HomeControllerAdding a HomeController

Мы начнем приложение музыкального магазина MVC, добавив класс контроллера, который будет работать с URL-адресами на домашней странице нашего сайта.We'll begin our MVC Music Store application by adding a Controller class that will handle URLs to the Home page of our site. Мы будем следовать соглашениям об именовании ASP.NET MVC по умолчанию и назовем его HomeController.We'll follow the default naming conventions of ASP.NET MVC and call it HomeController.

Щелкните правой кнопкой мыши папку Controllers в обозреватель решений и выберите "Добавить", а затем — "контроллер...". кнопкиRight-click the "Controllers" folder within the Solution Explorer and select "Add", and then the "Controller…" command:

Откроется диалоговое окно "Добавление контроллера".This will bring up the "Add Controller" dialog. Присвойте контроллеру имя "HomeController" и нажмите кнопку Добавить.Name the controller "HomeController" and press the Add button.

Будет создан новый файл HomeController.cs со следующим кодом:This will create a new file, HomeController.cs, with the following code:

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.Mvc;
 
namespace MvcMusicStore.Controllers
{
    public class HomeController : Controller
    {
        //
        // GET: /Home/
        public ActionResult Index()
        {
            return View();
        }
    }
}

Чтобы начать как можно скорее, мы заменяем метод Index простым методом, который просто возвращает строку.To start as simply as possible, let's replace the Index method with a simple method that just returns a string. Мы сделаем два изменения:We'll make two changes:

  • Измените метод, чтобы он возвращал строку, а не ActionResultChange the method to return a string instead of an ActionResult
  • Измените оператор return, чтобы он возвращал "Привет от домашнего"Change the return statement to return "Hello from Home"

Теперь метод должен выглядеть следующим образом:The method should now look like this:

public string Index()
{
    return "Hello from Home";
}

Запуск приложенияRunning the Application

Теперь давайте запустим сайт.Now let's run the site. Мы можем запустить наш веб-сервер и испытать сайт, используя любой из следующих средств:We can start our web-server and try out the site using any of the following::

  • Выбор пункта меню "Отладка ⇨ начать отладку"Choose the Debug ⇨ Start Debugging menu item
  • Нажмите кнопку с зеленой стрелкой на панели инструментов Click the Green arrow button in the toolbar
  • Используйте сочетание клавиш F5.Use the keyboard shortcut, F5.

При использовании любого из описанных выше действий будет выполнена компиляция нашего проекта, а затем ASP.NET Development Server, который был встроен в Visual Web Developer для запуска.Using any of the above steps will compile our project, and then cause the ASP.NET Development Server that is built-into Visual Web Developer to start. В нижнем углу экрана появится уведомление, указывающее, что ASP.NET Development Server запущено, и отобразит номер порта, под которым он выполняется.A notification will appear in the bottom corner of the screen to indicate that the ASP.NET Development Server has started up, and will show the port number that it is running under.

Visual Web Developer будет автоматически открывать окно браузера, URL-адрес которого указывает на наш веб-сервер.Visual Web Developer will then automatically open a browser window whose URL points to our web-server. Это позволит нам быстро испытать наше веб-приложение:This will allow us to quickly try out our web application:

Итак, это было довольно быстро — мы создали новый веб-сайт, добавили функцию с тремя строками и получили текст в браузере.Okay, that was pretty quick – we created a new website, added a three line function, and we've got text in a browser. Не Rocket наука, но это начало.Not rocket science, but it's a start.

Примечание. Visual Web Developer включает в себя ASP.NET Development Server, который запустит ваш веб-сайт на случайном номере "порт". На снимке экрана выше сайт выполняется на http://localhost:26641/, поэтому используется порт 26641. Ваш номер порта будет другим. Когда мы говорим об URL-адресе, подобном/Сторе/бровсе, в этом учебнике, который будет идти после номера порта. Если номер порта 26641, то переход по адресу/Сторе/бровсе означает, что http://localhost:26641/Store/Browse.Note: Visual Web Developer includes the ASP.NET Development Server, which will run your website on a random free "port" number. In the screenshot above, the site is running at http://localhost:26641/, so it's using port 26641. Your port number will be different. When we talk about URL's like /Store/Browse in this tutorial, that will go after the port number. Assuming a port number of 26641, browsing to /Store/Browse will mean browsing to http://localhost:26641/Store/Browse.

Добавление СтореконтроллерAdding a StoreController

Мы добавили простой HomeController, который реализует домашнюю страницу нашего сайта.We added a simple HomeController that implements the Home Page of our site. Теперь добавим еще один контроллер, который мы будем использовать для реализации функций обзора нашего музыкального магазина.Let's now add another controller that we'll use to implement the browsing functionality of our music store. Наш контроллер магазина будет поддерживать три сценария:Our store controller will support three scenarios:

  • Страница со списком жанров музыки в нашем музыкальном магазинеA listing page of the music genres in our music store
  • Страница просмотра со списком всех альбомов музыки в определенном жанреA browse page that lists all of the music albums in a particular genre
  • Страница сведений, на которой отображаются сведения о конкретном музыкальном альбомеA details page that shows information about a specific music album

Начнем с добавления нового класса Стореконтроллер.We'll start by adding a new StoreController class.. Если вы еще не сделали этого, закройте приложение, закрыв браузер или выбрав пункт меню Отладка ⇨ отключить отладку.If you haven't already, stop running the application either by closing the browser or selecting the Debug ⇨ Stop Debugging menu item.

Теперь добавьте новый Стореконтроллер.Now add a new StoreController. Как и в случае с HomeController, это можно сделать, щелкнув правой кнопкой мыши папку Controllers в обозреватель решений и выбрав пункт меню Добавить контроллер>.Just like we did with HomeController, we'll do this by right-clicking on the "Controllers" folder within the Solution Explorer and choosing the Add->Controller menu item

Наш новый Стореконтроллер уже имеет метод "index".Our new StoreController already has an "Index" method. Мы будем использовать этот метод "index" для реализации страницы списка, в которой перечислены все жанры в нашем музыкальном магазине.We'll use this "Index" method to implement our listing page that lists all genres in our music store. Мы также добавим два дополнительных метода для реализации двух других сценариев, которые мы хотим использовать нашим Стореконтроллер: обзор и сведения.We'll also add two additional methods to implement the two other scenarios we want our StoreController to handle: Browse and Details.

Эти методы (индекс, обзор и сведения) в контроллере называются "действиями контроллера", и, как уже говорилось с методом действия HomeController. index (), их заданием является реагирование на запросы URL-адресов и (вообще говоря) определение содержимого должен быть отправлен обратно браузеру или пользователю, вызвавшему URL-адрес.These methods (Index, Browse and Details) within our Controller are called "Controller Actions", and as you've already seen with the HomeController.Index()action method, their job is to respond to URL requests and (generally speaking) determine what content should be sent back to the browser or user that invoked the URL.

Мы начнем нашу реализацию Стореконтроллер, изменив метод Сеиндекс (), чтобы возвращалась строка "Привет из Store. index ()", и мы добавим аналогичные методы для просмотра () и подробностей ():We'll start our StoreController implementation by changing theIndex() method to return the string "Hello from Store.Index()" and we'll add similar methods for Browse() and Details():

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.Mvc;
 
namespace MvcMusicStore.Controllers
{
    public class StoreController : Controller
    {
        //
        // GET: /Store/
        public string Index()
        {
            return "Hello from Store.Index()";
        }
        //
        // GET: /Store/Browse
        public string Browse()
        {
            return "Hello from Store.Browse()";
        }
        //
        // GET: /Store/Details
        public string Details()
        {
            return "Hello from Store.Details()";
        }
    }
}

Запустите проект еще раз и просмотрите следующие URL-адреса:Run the project again and browse the following URLs:

  • /Store/Store
  • /сторе/бровсе/Store/Browse
  • /сторе/детаилс/Store/Details

Доступ к этим URL-адресам вызовет методы действий в нашем контроллере и возвращает ответы на строки:Accessing these URLs will invoke the action methods within our Controller and return string responses:

Это замечательно, но это просто постоянные строки.That's great, but these are just constant strings. Сделаем их динамическими, чтобы они могли получать информацию из URL-адреса и отображать их в выходных данных страницы.Let's make them dynamic, so they take information from the URL and display it in the page output.

Сначала мы изменим метод действия обзора, чтобы получить значение строки запроса из URL-адреса.First we'll change the Browse action method to retrieve a querystring value from the URL. Это можно сделать, добавив параметр "Жанр" в метод действия.We can do this by adding a "genre" parameter to our action method. Когда мы делаем это, ASP.NET MVC автоматически передает любые параметры QueryString или формы POST с именем жанра в метод действия при его вызове.When we do this ASP.NET MVC will automatically pass any querystring or form post parameters named "genre" to our action method when it is invoked.

//
// GET: /Store/Browse?genre=Disco
public string Browse(string genre)
 {
    string message = HttpUtility.HtmlEncode("Store.Browse, Genre = "
+ genre);
 
    return message;
 }

Примечание. Мы используем метод служебной программы HttpUtility. HtmlEncode для очистки вводимых пользователем данных. Это не позволяет пользователям внедрять JavaScript в наше представление со ссылкой, такой как/Сторе/бровсе? Жанр =<скрипт>Window. location = 'http://hackersite.com'</Script>.Note: We're using the HttpUtility.HtmlEncode utility method to sanitize the user input. This prevents users from injecting Javascript into our View with a link like /Store/Browse?Genre=<script>window.location='http://hackersite.com'</script>.

Теперь давайте перейду к/Сторе/бровсе? Жанр = DiscoNow let's browse to /Store/Browse?Genre=Disco

Теперь измените действие Details, чтобы оно читало и отображало входной параметр с именем ID.Let's next change the Details action to read and display an input parameter named ID. В отличие от нашего предыдущего метода, мы не будем внедрять значение идентификатора в качестве параметра QueryString.Unlike our previous method, we won't be embedding the ID value as a querystring parameter. Вместо этого мы будем внедрять его непосредственно в сам URL-адрес.Instead we'll embed it directly within the URL itself. Например:/Store/Details/5.For example: /Store/Details/5.

ASP.NET MVC позволяет нам без каких-либо усилий настраивать.ASP.NET MVC lets us easily do this without having to configure anything. По умолчанию соглашением о маршрутизации MVC ASP.NET является обработка сегмента URL-адреса после имени метода действия в виде параметра с именем "ID".ASP.NET MVC's default routing convention is to treat the segment of a URL after the action method name as a parameter named "ID". Если метод действия имеет параметр с именем ID, ASP.NET MVC автоматически передаст сегмент URL-адреса в качестве параметра.If your action method has a parameter named ID then ASP.NET MVC will automatically pass the URL segment to you as a parameter.

//
// GET: /Store/Details/5
public string Details(int id)
 {
    string message = "Store.Details, ID = " + id;
 
    return message;
 }

Запустите приложение и перейдите по/Store/Details/5:Run the application and browse to /Store/Details/5:

Давайте посмотрим, что мы сделали на данный момент:Let's recap what we've done so far:

  • Мы создали новый проект ASP.NET MVC в Visual Web Developer.We've created a new ASP.NET MVC project in Visual Web Developer
  • Мы обсуждали базовую структуру папок приложения ASP.NET MVC.We've discussed the basic folder structure of an ASP.NET MVC application
  • Мы узнали, как запустить наш веб-сайт с помощью ASP.NET Development ServerWe've learned how to run our website using the ASP.NET Development Server
  • Мы создали два класса контроллера: HomeController и Стореконтроллер.We've created two Controller classes: a HomeController and a StoreController
  • Мы добавили методы действий в наши контроллеры, которые отвечают на запросы URL-адресов и возвращают текст в браузер.We've added Action Methods to our controllers which respond to URL requests and return text to the browser