Razor движок веб-страниц

Все исходники / Язык программирования C# / OS Windows / ASP.NET для веб-приложений / Движок Razor / Razor движок веб-страниц
Оглавление:
  1. Razor - интеллектуальный и понятный
  2. Краткая история Razor
  3. Свойства движка Razor
  4. Синтаксис Razor
  5. Создание типов с помощью движка Razor
  6. Внедрение объектов из других пространств имен
  7. Объявление переменных
  8. Вывод зарезервированных слов
  9. Пример динамического создания html кода
  10. Поддержка макетов веб страниц
  11. Страница макета на движке Razor
  12. Дочерние страницы макета
  13. Исходники веб страниц на движке Razor

Razor - интеллектуальный и понятный

Razor - это интеллектуальный обработчик программного кода динамических веб-страниц ASP.NET. Имеет простой, интуитивно понятный, синтаксис встраивания программного кода в веб-страницы. Razor - механизм визуализации (view engine) поддерживаемый .NET Framework, .NET Core в рамках ASP.NET и специально предназначен для создания веб-приложений.

Движок Razor даёт всю мощь ASP.NET, но использует упрощенный синтаксис, легкий для новичков и повышающий производительность для профессионалов. Razor позволяет писать программный код без множества открывающих и закрывающих меток по всему шаблону делая процесс разработки по-настоящему быстрым. Дизайн движка Razor использует минимальное количество символов для обозначения границ программного кода, не требуя явно обозначать серверные блоки в HTML-коде.

Краткая история Razor

Разработку движка Razor начали в июне 2010 года и в январе 2011 года он был выпущен для Microsoft Visual Studio 2010 как часть ASP.NET MVC 3 и набора инструментов Microsoft WebMatrix. Целью создания нового механизма визуализации было обеспечение возможности разработчикам использовать свои существующие C# и Visual Basic языковые навык. А также возможности быстрого интегрирования серверного кода в разметку HTML с минимальным количеством разграничивающих символов.

Свойства движка Razor

С помощью механизма визуализации Razor можно интуитивно легко создавать сложные композиции программного кода, гармонирующего с разметкой HTML. Когда сервер "читает страницу", движок Razor обрабатывает код веб-страницы прежде, чем сервер отправит сгенерированные данные в браузер. Загруженная в браузер веб-страница, порожденная серверным кодом, ничем не отличается от статического контента HTML. Файлы веб-страниц ASP.NET с синтаксисом Razor имеют специфическое расширение .cshtml (Razor с использованием C #) и .vbhtml (Razor с помощью Visual Basic).

Синтаксис Razor

Ниже показаны фрагменты исходников на движке Razor. Более подробно программные коды веб-страниц можно посмотреть, загрузив прикрепленные исходники. Если работать в MS Visual Studio .NET и Visual Studio Code, то программирование на Razor можно освоить буквально за несколько часов. Встроенные в студии анализаторы кода оказывают существенную помощь в освоении механизма визуализации.

Блок объявления типов, методов, объектов и переменных, обозначенный как @functions{…} дает возможность создавать любой, синтаксически корректный код на языках .NET, что равносильно созданию кода в файле с расширением .cs. Программный код в блоке @functions{…} воспринимается как составляющая класса с именем идентичным названию файла .cshtml. Разместив данный файл папке App_Code и создав переменные, методы и классы с модификатором public можно получить доступ к этому коду с любой страницы сайта. Например, вы создали файл Utility.cshtml, то код будет доступен на других страницах через @Utility.название_метода(), @Utility.название_переменной и т.д.

Создание типов с помощью движка Razor


@functions{
 
    // Новый класс
    static class MyClass
    {
        /// <summary>
        /// Описание метода для документирования
        /// </summary>
        /// <returns>описание возвращаемого значения</returns>
        public static string GetTicks()
        {
            return DateTime.Now.Ticks.ToString();
        }
 
        private static string s = "123456";
    }
 
 
    // Функция с возвратом
    public string Function1()
    {
        return "Привет!!!";
    }
 
    // Функция без возврата
    void Function2()
    {
        // Задержка для разности результатов при многократных
        // последовательных вызовах функции GetTicks()
        Thread.Sleep(1);
    }
 
}

Объявление переменных

Razor допускает объявление различных переменных в том числе и неявных переменных с ключевым словом var:

@{
    // -- Создание переменных различных типов ---
    
    // Универсальная переменная var
    var universalString = "Поезд прибудет вовремя.";
    var universalInteger = 567;
 
    // Можно использовать и переменные конкретных типов
    string str = "Урожай грибов в этом году впечатляет.";
    int intNumber = 289;
    DateTime timeNow = DateTime.Now;
}

Вывод зарезервированных слов

При необходимости вывода текста, содержащего зарезервированные слова и названия объектов предназначен показанный ниже синтаксис:

@{
    // В html-тегах зарезервированные слова отображаются как простой текст
    <p>
        int double string new null if for  class delegate Request Response DateTime
    </p>
 
    // Следующий способ преобразования ключевых слов в простой текст
    @:int double string new null if for  class delegate Request Response DateTime
 
    // Использование не отображаемых тегов <text>
    <text>
        int double string new null if for  class delegate Request Response DateTime
    </text>
 
 
    // Если раскомментировать строку ниже, то интерпретатор известит об ошибочном коде
    // int double string new null if for  class delegate DateTime
}

Пример динамического создания html кода

Пример кода динамического создания таблицы на движке Razor. Цикл и вложенность программного кода.

<div>
     <table>
        @for (int row = 1; row <= 4; row++)
        {
            <tr>
            @for(int column = 1; column <= 10; column++)
            {
                <td>@row x @column</td>
            }
            </tr>
        }
     </table>
</div>

Поддержка макетов веб страниц

Движок Razor поддерживает концепцию макетов для единого дизайна веб-страниц. Создается макет с общей HTML разметкой, а в представлении указывается какой шаблон использовать. При отправке данных в браузер движок обработает серверный код, объединив содержимое макета и дочернего представления, затем отправит объединенный контент клиенту. Кроме того, Razor позволяет обозначать секции в макете, которые в представлениях заменяются соответствующим кодом. Количество и названия секций можно определять по своему усмотрению.

Страница макета на движке Razor


<!DOCTYPE html>
 
<html>
<head>
    <meta name="viewport" content="width=device-width" />
    <title></title>
</head>
<body>
    <div>@RenderSection("Верхний блок", true)</div>
    <div style="height:300px;">
        <div>@RenderSection("Left", true)</div>
        <div>@RenderBody()</div>
        <div>@RenderSection("Right", false)</div>
    </div>
 
    <div>@RenderSection("Нижний блок", true)</div>
</body>
</html>

Дочерние страницы макета

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

Дочерняя страница представления для определенного макета:

@{
    // Определение макета текущего представления
    Layout = "~/LayoutPages/_LayoutMain.cshtml";
}
 
<h1>Тело веб-страницы</h1>
 
<p>
    <strong>Абзац №1</strong>
</p>
<p>
    Абзац №2
</p>
 
 
@section Верхний блок{
    Верхняя строка сайта
}

@section Нижний блок{
    Нижняя строка веб-страницы
}
 
@section Left{
    Левый столбец
}
 
@section Right{
    Правый столбец
}

Исходники веб страниц на движке Razor

Ниже прикреплены исходники веб-страниц с обработчиком кода Razor. Исходники созданы в MS Visual Studio .NET 2013 и могут быть протестированы в Visual Studio Code, SharpDevelop, WebMatrix. Поддержка Razor включена в Visual Studio 2012 и Visual Studio 2013 по умолчанию.

Скачать исходник

Тема: «Razor движок веб-страниц» ASP.NET на языке программирования C# razor-aspnet-1.zip Размер:815 КбайтЗагрузки:851