Начало работы с ASP.NET

Tom FitzMacken

Для разработки новых веб-приложений рекомендуется Blazor.

Примечание.

WebMatrix больше не рекомендуется в качестве интегрированной среды разработки для веб-страницы ASP.NET. Используйте Visual Studio или Visual Studio Code.

В этом руководстве и приложении представлен обзор веб-страницы ASP.NET (версии 2 или более поздней) и синтаксис Razor, упрощенная платформа для создания динамических веб-сайтов. Он также представляет WebMatrix, инструмент для создания страниц и сайтов.

Уровень: новый для веб-страницы ASP.NET.
Предполагается, что навыки: HTML, базовые каскадные таблицы стилей (CSS).

Что вы узнаете в первом руководстве по набору:

• Что веб-страницы ASP.NET технологии и что это за.
• Что такое WebMatrix.
• Как установить все.
• Создание веб-сайта с помощью WebMatrix.

Рассматриваются функции и технологии:

• установщик веб-платформа Майкрософт.
• WebMatrix.
• Страницы CSHTML

Майк Папа первоначально написал это руководство. Tom FitzMacken обновил его для Microsoft WebMatrix 3.

Версии программного обеспечения, используемые в руководстве

• веб-страницы ASP.NET (Razor) 2
• WebMatrix 3

Что вы должны знать?

Мы предполагаем, что вы знакомы с:

• HTML. Никаких подробных знаний не требуется. Мы не объясним HTML, но мы также не используем ничего сложного. Мы предоставим ссылки на html-учебники, где мы считаем, что они полезны.
• Каскадные таблицы стилей (CSS). То же, что и html.
• Основные идеи базы данных. Если вы использовали электронную таблицу для данных и отсортировали и отфильтровали данные, это уровень опыта, который мы обычно предполагаем для этого набора учебников.

Мы также предполагаем, что вы заинтересованы в обучении базовому программированию. веб-страницы ASP.NET использовать язык программирования с именем C#. Вам не нужно иметь никакого фона в программировании, просто интерес к нему. Если вы когда-либо написали любой JavaScript на веб-странице раньше, у вас есть много фона.

Обратите внимание, что если вы знакомы с программированием, вы можете найти, что этот набор учебника изначально движется медленно, пока мы доведем новых программистов до скорости. Как мы получаем мимо первых нескольких учебников, однако, будет менее базовое программирование, чтобы объяснить, и вещи будут двигаться вместе с более быстрым клипом.

Что вам нужно?

Вам потребуется следующее.

• Компьютер под управлением Windows 8, Windows 7, Windows Server 2008 или Windows Server 2012.
• Динамическое подключение к Интернету.
• Права администратора (необходимые для процесса установки).

Что такое веб-страницы ASP.NET?

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

Динамические страницы позволяют выполнять все действия. Вы можете попросить пользователя ввести данные с помощью формы, а затем изменить отображение страницы или его внешний вид. Вы можете получить сведения от пользователя, сохранить его в базе данных, а затем перечислить их позже. Вы можете отправить сообщение электронной почты с сайта. Вы можете взаимодействовать с другими службами в Интернете (например, службой сопоставления) и создавать страницы, которые интегрируют информацию из этих источников.

Что такое WebMatrix?

WebMatrix — это средство, которое интегрирует редактор веб-страниц, служебную программу базы данных, веб-сервер для тестирования страниц и функции публикации веб-сайта в Интернете. WebMatrix является бесплатным, и легко установить и легко использовать. (Он также работает только для простых HTML-страниц, а также для других технологий, таких как PHP.)

Для работы с веб-страницы ASP.NET на самом деле не нужно использовать WebMatrix. Вы можете создавать страницы с помощью текстового редактора, например, и тестировать страницы с помощью веб-сервера, к которому у вас есть доступ. Однако WebMatrix делает все это очень простым, поэтому эти учебники будут использовать WebMatrix во всем.

Об этих руководствах

В этом руководстве приведены общие сведения об использовании веб-страницы ASP.NET. В этом вводном наборе учебников содержится 9 учебников. Это часть серии наборов учебников, которые принимают вас от веб-страницы ASP.NET новичков до создания реальных, профессиональных веб-сайтов.

В этом первом руководстве основное внимание уделяется основам работы с веб-страницы ASP.NET. Когда вы закончите, вы можете работать с дополнительными наборами учебников, которые выбирают, где это заканчивается, и которые подробно изучают веб-страницы.

Мы намеренно идем легко на подробные объяснения. И всякий раз, когда мы показываем что-то, для этого учебника мы всегда выбираем способ, который мы думаем, проще всего понять. Более поздние наборы учебников пойдут на более подробную глубину и показывают более эффективные или более гибкие подходы (также более весело). Но эти учебники требуют, чтобы сначала понять основы.

В учебнике, который вы только что начали, рассматриваются следующие функции веб-страницы ASP.NET:

• Введение и получение всех установленных компонентов. (Это в учебнике, который вы читаете.)
• Основы программирования веб-страницы ASP.NET.
• Создание базы данных.
• Создание и обработка формы ввода пользователя.
• Добавление, обновление и удаление данных в базе данных.

Что вы создадите?

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

Ниже приведена страница, которая позволяет добавлять на сайт новые сведения о фильмах:

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

Ознакомьтесь с этим приложением, работающим в Azure

Хотите увидеть готовый сайт, работающий как динамическое веб-приложение? Вы можете развернуть полную версию приложения в учетной записи Azure, просто нажав следующую кнопку.

Для развертывания этого решения в Azure требуется учетная запись Azure. Если у вас еще нет учетной записи, у вас есть следующие параметры:

• Откройте учетную запись Azure бесплатно . Вы получаете кредиты, которые можно использовать для пробных платных служб Azure, и даже после того, как они используются, вы можете сохранить учетную запись и использовать бесплатные службы Azure.
• Активация преимуществ подписчика MSDN. Подписка MSDN предоставляет кредиты каждый месяц, который можно использовать для платных служб Azure.

Установка всего

Все можно установить с помощью установщика веб-платформы от Майкрософт. В действительности вы устанавливаете установщик, а затем используете его для установки всего остального.

Чтобы использовать веб-страницы, необходимо установить по крайней мере Windows XP с пакетом обновления 3 (SP3) или Windows Server 2008 или более поздней версии.

На странице веб-страниц веб-сайта ASP.NET нажмите кнопку "Установить".

Вам предлагается принять условия лицензии и заявление о конфиденциальности перед установкой WebMatrix.

Нажмите кнопку "Запустить" , чтобы запустить установку. (Если вы хотите сохранить установщик, нажмите кнопку Сохраните и запустите установщик из папки, в которой вы сохранили ее.)

Появится установщик веб-платформы, готовый к установке WebMatrix. Щелкните Установить.

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

Привет, WebMatrix

По завершении процесс установки может автоматически запускать WebMatrix. Если это не так, в Windows в меню "Пуск " запустите Microsoft WebMatrix.

При первом запуске WebMatrix вы можете войти в Microsoft Azure с помощью учетной записи Майкрософт. Выполнив вход, вы получите через Azure 10 бесплатных веб-приложений. Эти бесплатные веб-приложения предоставляют удобный способ тестирования приложений. Если у вас еще нет учетной записи Azure, но у вас есть подписка MSDN, вы можете активировать преимущества подписки MSDN. В противном случае вы можете создать бесплатную пробную учетную запись всего за несколько минут. Дополнительные сведения см. на странице бесплатной пробной версии Azure.

Чтобы продолжить работу с этим руководством, вам не нужно входить в систему. Если вы не войдете сейчас, вы по-прежнему сможете войти позже. В последней статье этой серии учебников описывается развертывание веб-сайта в Azure. Поэтому для выполнения этого раздела вам потребуется выполнить вход.

На этом этапе войдите с помощью учетной записи Майкрософт или выберите "Не сейчас " в правом нижнем углу.

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

В окне запуска нажмите кнопку "Создать".

Шаблоны — это предварительно созданные файлы и страницы для различных типов веб-сайтов. Чтобы просмотреть все шаблоны, доступные по умолчанию, выберите параметр "Коллекция шаблонов".

В окне быстрого запуска выберите пустой сайт из группы ASP.NET и назовите новый сайт WebPagesMovies.

Нажмите кнопку Далее.

Если вы вошли в учетную запись Майкрософт, вы сможете создать сайт в Azure. В зависимости от имени сайта предлагается имя WebPagesMovies.azurewebsites.net по умолчанию. Однако восклицательный знак указывает, что это имя недоступно в Windows Azure. Для простоты выберите "Пропустить " для обхода создания веб-сайта в Azure прямо сейчас. Далее в этой серии мы опубликуем сайт в Azure.

WebMatrix создает и открывает сайт:

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

Вы узнаете больше о WebMatrix и его функциях, как описано в этих руководствах.

Создание веб-страницы

Чтобы ознакомиться с WebMatrix и веб-страницы ASP.NET, вы создадите простую страницу.

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

На ленте щелкните стрелку в разделе "Создать ", а затем нажмите кнопку "Создать файл".

WebMatrix отображает список типов файлов. Выберите CSHTML и в поле "Имя" введите "HelloWorld". Страница CSHTML — это страница веб-страницы ASP.NET.

Щелкните OK.

WebMatrix создает страницу и открывает ее в редакторе.

Как видно, страница содержит в основном обычную разметку HTML, за исключением блока вверху, который выглядит следующим образом:

@{ 

}

Это для добавления кода, как вы увидите в ближайшее время.

Обратите внимание, что различные части страницы — имена элементов, атрибуты и текст, а также блок вверху — все в разных цветах. Это называется выделением синтаксиса, и это упрощает все ясно. Это одна из функций, которая упрощает работу с веб-страницами в WebMatrix.

Добавьте содержимое <head> для элементов, <body> как показано в следующем примере. (Если вы хотите, можно просто скопировать следующий блок и заменить всю существующую страницу этим кодом.)

@{

}

<!DOCTYPE html>

<html lang="en">
    <head>
        <meta charset="utf-8" />
        <title>Hello World Page</title>
    </head>
    <body>
        <h1>Hello World Page</h1>
        <p>Hello World!</p>
    </body>
</html>

На панели быстрого доступа или в меню "Файл " нажмите кнопку "Сохранить".

Тестирование страницы

В рабочей области "Файлы" щелкните правой кнопкой мыши страницу HelloWorld.cshtml и нажмите кнопку "Запустить" в браузере.

WebMatrix запускает встроенный веб-сервер (IIS Express), который можно использовать для тестирования страниц на компьютере. (Без IIS Express в WebMatrix необходимо опубликовать страницу на веб-сервере где-то, прежде чем протестировать его.) Страница отображается в браузере по умолчанию.

Обратите внимание, что при тестировании страницы в WebMatrix URL-адрес в браузере похож http://localhost:33651/HelloWorld.cshtml. на локальный сервер, что означает, что страница обслуживается веб-сервером, который находится на своем компьютере. Как отмечалось, WebMatrix включает в себя программу веб-сервера с именем IIS Express, которая выполняется при запуске страницы.

Число после localhost (например, localhost:33651) ссылается на номер порта на компьютере. Это число канала, который iis Express использует для этого конкретного веб-сайта. Номер порта выбирается случайным образом из диапазона 1024–65536 при создании сайта и отличается для каждого создаваемого сайта. (При тестировании собственного сайта номер порта почти наверняка будет отличаться от 33561.) Используя другой порт для каждого веб-сайта, IIS Express может держать прямо, с каким из ваших сайтов он разговаривает.

Позже при публикации сайта на общедоступном веб-сервере вы больше не увидите localhost в URL-адресе. На этом этапе вы увидите более типичный URL-адрес, подобный http://myhostingsite/mywebsite/HelloWorld.cshtml или независимо от страницы. Дополнительные сведения о публикации сайта см. далее в этом руководстве.

Добавление кода на стороне сервера

Закройте браузер и вернитесь на страницу в WebMatrix.

Добавьте строку в блок кода, чтобы он выглядел следующим образом:

@{
   var currentDateTime = DateTime.Now;
}

Это немного кода Razor. Вероятно, ясно, что он получает текущую дату и время и помещает это значение в переменную с именем currentDateTime. Дополнительные сведения о синтаксисе Razor см. в следующем руководстве.

В тексте страницы после <p>Hello World!</p> элемента добавьте следующее:

<p>Right now it's @currentDateTime</p>

Этот код получает значение, которое вы помещаете в currentDateTime переменную в верхней части страницы, и вставляет его в разметку страницы. Символ @ помечает код веб-страницы ASP.NET на странице.

Запустите страницу еще раз (WebMatrix сохраняет изменения перед запуском страницы). На этот раз на странице отображается дата и время.

Подождите несколько минут, а затем обновите страницу в браузере. Отображение даты и времени обновляется.

В браузере просмотрите источник страницы. Оно выглядит следующим образом:

<!DOCTYPE html>

<html lang="en">
    <head>
        <meta charset="utf-8" />
        <title>Hello World Page</title>
    </head>
    <body>
        <h1>Hello World Page</h1>
        <p>Hello World!</p>
        <p>Right now it's 1/18/2012 2:49:50 PM</p>
    </body>
</html>

Обратите внимание, что @{ } блок в верхней части не существует. Кроме того, обратите внимание, что на экране даты и времени отображается фактическая строка символов (1/18/2012 2:49:50 PM или любого другого), не @currentDateTime похожая на страницу CSHTML . Что произошло здесь, что при запуске страницы ASP.NET обработал весь код (очень мало в этом случае), который был помечен.@ Код создает выходные данные, а выходные данные были вставлены на страницу.

Это то, что веб-страницы ASP.NET о

Когда вы читаете, что веб-страницы ASP.NET создает динамическое веб-содержимое, то, что вы видели здесь, это идея. Только что созданная страница содержит ту же разметку HTML, которую вы видели ранее. Он также может содержать код, который может выполнять все виды задач. В этом примере она сделала тривиальную задачу получения текущей даты и времени. Как вы видели, можно перемежать код с HTML для создания выходных данных на странице. Когда кто-то запрашивает страницу CSHTML в браузере, ASP.NET обрабатывает страницу, пока она все еще находится в руках веб-сервера. ASP.NET вставляет выходные данные кода (если таковые) на страницу в формате HTML. По завершении обработки кода ASP.NET отправляет полученную страницу в браузер. Все, что когда-либо получает браузер, — HTML. Ниже приведена схема:

Идея проста, но есть много интересных задач, которые могут выполнять код, и есть много интересных способов, в которых можно динамически добавлять HTML-содержимое на страницу. И ASP.NET .cshtml-страницы , как и любая HTML-страница, также может включать код, который выполняется в самом браузере (код JavaScript и jQuery). Вы изучите все эти действия в этом наборе учебников и в последующих.

Ближайший следующий

В следующем руководстве этой серии вы изучите веб-страницы ASP.NET программирования немного больше.

Дополнительные ресурсы

Создайте веб-сайт ASP.NET с нуля. Это руководство, специально относящееся к использованию WebMatrix (не веб-страницы ASP.NET). В этом руководстве подробно описаны некоторые дополнительные функции WebMatrix, которые мы не рассмотрим в этом наборе учебников.

Далее