Часть 4. Добавление административного представления

по Майк Уоссон

Скачать завершенный проект

Добавление представления администратора

Теперь мы вернемся к клиентской стороне и добавим страницу, которая может использовать данные из административного контроллера. Страница позволяет пользователям создавать, изменять и удалять продукты, отправляя запросы AJAX к контроллеру.

В обозреватель решений разверните папку Controllers и откройте файл с именем HomeController.cs. Этот файл содержит контроллер MVC. Добавьте метод с именем Admin:

public ActionResult Admin()
{
    string apiUri= Url.HttpRouteUrl("DefaultApi", new { controller = "admin", });
    ViewBag.ApiUrl = new Uri(Request.Url, apiUri).AbsoluteUri.ToString();

    return View();
}

Метод хттпраутеурл создает универсальный код ресурса (URI) для веб-API и сохраняет его в контейнере представления для последующего использования.

Затем поместите текстовый курсор в метод действия Admin, щелкните его правой кнопкой мыши и выберите Добавить представление. Откроется диалоговое окно Добавление представления .

В диалоговом окне Добавление представления назовите представление "admin". Установите флажок создать строго типизированное представление. В разделе класс моделивыберите "продукт (Продуктсторе. Models)". Оставьте все остальные параметры в качестве значений по умолчанию.

При нажатии кнопки Добавить добавляется файл admin. cshtml в области Views/Home. Откройте этот файл и добавьте следующий код HTML. Этот HTML определяет структуру страницы, но функции еще не привязаны.

<div class="content">
    <div class="float-left">
        <ul id="update-products">
            <li>
                <div><div class="item">Product ID</div><span></span></div>
                <div><div class="item">Name</div> <input type="text" /></div> 
                <div><div class="item">Price ($)</div> <input type="text" /></div>
                <div><div class="item">Actual Cost ($)</div> <input type="text" /></div>
                <div>
                    <input type="button" value="Update" />
                    <input type="button" value="Delete Item" />
                </div>
         </li>
        </ul>
    </div>

    <div class="float-right">
    <h2>Add New Product</h2>
    <form id="product">
        @Html.ValidationSummary(true)
        <fieldset>
            <legend>Contact</legend>
            @Html.EditorForModel()
            <p>
                <input type="submit" value="Save" />
            </p>
        </fieldset>
    </form>
    </div>
</div>

В обозреватель решений разверните папку представления, а затем — общую папку. Откройте файл с именем _Layout. cshtml. Поиск элемента UL с ID = "Menu" и ссылки на действие для представления администрирования:

<li>@Html.ActionLink("Admin", "Admin", "Home")</li>

Note

В примере проекта я сделал несколько других косметических изменений, например заменить строку "Ваша Эмблема здесь". Они не влияют на функциональность приложения. Вы можете скачать проект и сравнить файлы.

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

Прямо сейчас страница не выполняет никаких действий. В следующем разделе мы будем использовать выколачивание. js для создания динамического пользовательского интерфейса.

Добавить авторизацию

Страница администрирования в настоящее время доступна для всех, кто посещает сайт. Изменим это значение, чтобы ограничить разрешения администраторам.

Для начала добавьте роль "Администратор" и пользователя с правами администратора. В обозреватель решений разверните папку фильтры и откройте файл с именем InitializeSimpleMembershipAttribute.cs. Нахождение конструктора SimpleMembershipInitializer. После вызова инитиализедатабасеконнектион. добавьте следующий код:

const string adminRole = "Administrator";
const string adminName = "Administrator";

if (!Roles.RoleExists(adminRole))
{
    Roles.CreateRole(adminRole);
}
if (!WebSecurity.UserExists(adminName))
{
    WebSecurity.CreateUserAndAccount(adminName, "password");
    Roles.AddUserToRole(adminName, adminRole);
}

Это быстрый и недействительный способ добавить роль "Администратор" и создать пользователя для роли.

В обозреватель решений разверните папку Controllers и откройте файл HomeController.cs. Добавьте атрибут авторизовать в метод Admin.

[Authorize(Roles="Administrator")]
public ActionResult Admin()
{
    return View();
}

Откройте файл AdminController.cs и добавьте атрибут авторизовать во весь класс AdminController.

[Authorize(Roles="Administrator")]
public class AdminController : ApiController
{
    // ...

Note

MVC и веб-API определяют атрибуты авторизации в разных пространствах имен. MVC использует System. Web. MVC. AuthorizeAttribute, а веб-API использует System. Web. http. AuthorizeAttribute.

Теперь только администраторы могут просматривать страницу Администратор. Кроме того, при отправке HTTP-запроса на административный контроллер запрос должен содержать файл cookie проверки подлинности. В противном случае сервер отправляет ответ HTTP 401 (несанкционированный). Это можно увидеть в Fiddler, отправив запрос GET в http://localhost:*port*/api/admin.