Лабораторная работа № 2. Тема: «Технология ASP. Создание Web – форм».


Web –приложения сильно отличаются от традиционных приложений для настольных систем. Первое отличие Web – приложение предполагает использование, как минимум двух соединенных в сеть машин, сетевым протоколом обычно является протокол НТТР.


Когда машина – клиент запускает Web – браузер, генерируется НТТР запрос доступа к конкретному ресурсу (например, к файлу *.aspx или *.htm) на удаленной машине – сервере. Протокол НТТР – это текстовый протокол, построенный на стандартной парадигме запросов и ответов. Например, при обращении к yandex.ru программное обеспечение браузера использует технологию, называемую сервисом DNS, которая позволяет превратить зарегистрированный адрес URL в 4- байтовое числовое значение (называемое IP адресом). После этого браузер открывает сокет (обычно через порт с номером 80) и посылает НТТР – запрос странице, используемой Web – узлом yandex.ru по умолчанию.
Осуществляющий хостинг web- сервер получает поступающий НТТР запрос, и указанный в запросе ресурс может содержать программную логику, способную прочитать значения, введенные клиентом (например, в текстовые поля), чтобы сформировать НТТР- ответ. Разработчик Web – программы может использовать любые технологии (CGI, ASP,ASP.Net, сервлеты Java и т.д.), чтобы динамически генерировать содержимое НТТР- ответа. Затем браузер клиента отображает HTML – код , полученный от Web – сервера.
Другой особенностью Web – разработки является то, что протокол НТТР является сетевым протоколом, не сохраняющим состояние. Как только Web – сервер отправляет ответ клиенту, вся информация о предыдущем взаимодействии оказывается «забытой». Поэтому необходимо решать задачу обеспечения «запоминания» соответствующей информации о клиентах, которые в настоящий момент оказываются зарегистрированными на узле (такой информацией может быть, например, список товаров в корзине покупателя), для этого можно использовать сеансовые переменные, файлы cookie и переменные приложения, кэш.
Под Web приложением будем понимать коллекцию файлов (*.htm, *.asp, *.aspx, файлы изображений и т.д.) и связанных компонентов, хранимых в отдельном семействе каталогов на данном Web сервере.
Web – сервер – это программный продукт, обеспечивающий хостинг Web – приложений, и, как правило, предлагающий целый ряд сопутствующих сервисов, например, интегрированные службы безопасности, поддержка FTP, службы обмена почтовыми сообщениями. Web сервером производственного уровня является сервер IIS (Internet Information Server – информационный сервер Интернет) от Microsoft, который предлагает внутреннюю поддержку и классических ASP приложений, и приложений ASP.Net. IIS является компонентой операционной системы, устанавливается вручную.
Сервер IIS лучше установить до установки.Net Framework. Если установить после то приложения ASP.Net будут выполняться не корректно, чтобы настроить IIS на поддержку .Net приложений необходимо запустить утилиту в командной строке aspnet_regiis.exe( с флагом i). IIS способен обслуживать множество Web приложений, каждое из которых размещается в своем виртуальном каталоге. Каждый виртуальный каталог проецируется в физический каталог на локальном жестком диске.
При построении Web узла с помощью Visual Studio 2005 используется WebDev.WebServer.exe для обслуживания создаваемых страниц/ Например, если ввести в командной строке WebDev.WebServer.exe / port:12345 / path: “D:\MyFolder\ MyWebSite”, и предположим в папке MyWebSite содержится файл с именем MyPage.aspx, то введя в браузере адрес URL localhost:12345/MyWebSite/MyPage.aspx возможно просмотреть содержимое созданной страницы. Этот сервер не производственного уровня, он предназначен исключительно для целей разработки и тестирования.

Создание виртуального каталога

Для того чтобы создать виртуальный каталог ASPprimer. Для этого необходимо создать физический каталог, например на дискеD:.
Следующий шаг — необходимо создать на web-сервере новый виртуальный каталог, которому будет соответствовать этот физический ка¬талог. Сделать это можно разными способами, но самый простой — в окне Internet Services Manager выбрать Веб – узлы -Веб узел по –умолчанию , щелкнуть на нем правой кнопкой мыши и в контекстном меню выбрать Создать – Виртуальный каталог.
Запустится мастер создания виртуального каталога. Пропустим страницу с приветствием и присвоим создаваемому виртуальному каталогу имя ASPprimer. Далее мастер спросит о физическом пути в операционной системе для этого виртуального каталога. Выберите созданный каталог D:\ ASPprimer. Далее мастер выдаст вопросы об основных параметрах виртуального каталога (о возможности доступа к нему на чтение и запись, просмотра списка файлов из web- браузера, запуска скриптов и исполняемых файлов и т. п.).
В нашем случае вполне подойдут значения, предлагаемые мастером по умолчанию. После того как все эти действия будут завершены, можно увидеть созданный виртуальный каталог в списке каталогов web-сайта по умолчанию на сервере IIS.

Разработка Web – формы

Web- форма – это именованная группа связанных элементов пользовательского интерфейса, используемых для сбора данных пользовательского ввода, которые затем передаются Web – приложению по протоколу НТТР. Не следует путать Web –форму со всей областью окна браузера. Фактически Web –форма представляет собой логическое объединение элементов, размещенных между дескрипторами <form> и </form>. Как правило открывающий дескриптор <form> задает также атрибут action, указывающий адрес URL, по которому следует передать данные формы, и метод передачи этих данных (POST или GET).
Создайте файл default.html ( меню File -> New -> File -> Web -> C# -> Web Form) со следующим содержимым
Разработка Web – формы
Теперь добавим в страницу клиентскую поддержку контроля вводимых в форму данных. Необходимо, чтобы при щелчке пользователя по кнопке Отправить вызывалась функция JavaScript, которая проверяла бы каждый текстовый блок на пустые значения. При наличии пустого значения должно появиться окно сообщения с указанием ввести правильные данные. Сначала обработайте событие onclick для кнопки Отправить.

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

Обработчик события
Для организации обработки запроса в дескрипторе <form> обычно задается атрибут action, указывающий получателя вводимых в форму данных. Возможными получателями могут быть почтовые серверы, HTML файлы, файлы ASP и ASP.Net.
Рассмотрим пример использования технологии ASP. Обновите файл default.htm, указав в нем следующие атрибуты в открывающемся дескрипторе <form>
<form id=»form1″ name=»form1″ action=»http://localhost/ASPprimer/ClassicASPPage.asp» method=»get»>

Добавленные атрибуты гарантируют, что при щелчке по кнопке Отправить данные формы будут отправлены файлу ClassicAspPage.asp с указанным URL. Указание method = “GET” для режима передачи означает, что данные формы присоединяются к строке запроса в виде набора пар имен и значений, разделенных символами амперсанда.
hlocalhost/ASPprimer/ClassicASPPage.asp?txtName=%F0%E8%F2%E0&txtPassword=123&btnSubmit=%CE%F2%EF%F0%E0%E2%E8%F2%FC

Другой метод передачи данных формы указывается с помощью method = “POST”. В этом случае данные формы не присоединяются к строке запроса, а записываются в отдельной строке в рамках HTTP – заголовка . при использовании POST данные формы будут невидимы для внешнего наблюдателя, а также этот метод не имеет ограничений на длину символьных данных ( многие браузеры выдвигают ограничения на длину запросов с использованием GET). На странице ASP используются те же теги <HTML>, <HEAD> и <BODY>, что и на обычной web-странице.

Реализуйте страницу, как предлагается ниже.

Request.QueryString
Для этого создайте новый файл WebForm и сохраните его с именем ClassicASPPage.asp в виртуальном каталоге с именем ASPprimer.
Отметим, что метод =Request.QueryString() способен извлекать данные, переданные только с помощью метода GET.

Чтобы представить данные формы Web ресурсу, используя НТТР – метод POST, можно использовать Request.Form. В типе Request предусмотрены члены, которые позволяют прини¬мать данные, отправленные методом POST. Для этой цели используется коллек¬ция Form. Выглядит это так: Request.Form(«имя объекта»)
Знак = указывает на вывод на экран, можно записать = Request.Form(«LastName») или
Response.Write(Request.Form(«LastName»)).
Например:
<b> Имя пользователя:</b>
<%=Request.Form(«txtName») %>
<br />
<b> Пароль:</b>
<%=Request.Form(«txtPassword») %>

Проблемы классической технологии

Первое ограничение – использование языков сценариев (скриптов), которые являются интерпретируемыми, не предусматривающими определения типов данных и не способствующими созданию надежных объектно –ориентированных программных конструкций.
Второе – программный код страницы *.asp не является модульным, поскольку представляет собой комбинацию HTML и сценариев в рамках одной страницы.
Третье – требует использования большого количества шаблонов и весьма избыточного программного кода сценариев. Почти всем приложениям необходимо осуществлять контроль пользовательского ввода, обновлять состояние HTML элементов перед отправкой НТТР – ответа и т.д.

Преимущества ASP.NET
1. Для Web узла не требуется хостинг в IIS, можно разместить свой узел в любом каталоге на жестком диске.
2. Большое количество элементов (управления безопасностью, управления данными, элементы пользовательского интерфейса).
3. поддерживаются шаблоны страниц, которые позволяют создать общий шаблон интерфейса для множества связанных страниц.
4. поддерживается утилита конфигурирования и управления, которая осуществляет управление файлами Web.config.

Mодель программного кода Web страницы ASP.NET

Web – страницы ASP.NET могут строиться с использованием одного из двух подходов. Можно создать один файл *.aspx, который будет содержать комбинацию программного кода сервера и HTML. Для создания такого файла используется модель одномодульной страницы, когда программный код сервера размещается в контексте <script>, но программный код записывается на любом из управляемых языков (С#, Visual Basic.Net, Visual C++ и т.д.) Если создаваемая страница содержит очень мало программного кода, модель одномодульной страницы окажется лучшим вариантом выбора, так как в одном файле *.aspx будут и программный код и разметка.
Подход принятый по умолчанию в Visual Studio 2005 использует технологию внешнего кода поддержки, предполагающий отделение программного кода от HTML – логики представления и размещения их в двух разных файлах. Эта модель работает хорошо, когда много программного кода или в процессе разработки Web узла принимают участие много разработчиков. Созданием разметки могут отдельно заниматься дизайнеры, а программным кодом программисты. Файлы программного кода могут использоваться в множестве файлов *.aspx.
Подобно ASP и HTML Web – элементы ASP.NET размещаются в контексте <form>, но сопровождаются атрибутом runat =”server”, тем самым дескриптор информирует среду выполнения о том, что перед размещением HTML – кода в потоке ответа соответствующие элементы ASP.NET должны получить возможность обновить свое HTML – представление.

ЗАДАНИЯ ДЛЯ САМОСТОЯТЕЛЬНОГО ВЫПОЛНЕНИЯ:
Вариант 1
1. Измените программный код, чтобы в окне сообщений указывалось, какое именно поле не заполнено.
2. Реализуйте проверку на вводимый возраст, если меньше 16 страница *.asp\ не загружается и выводиться сообщение: «Вы еще несовершеннолетний», если больше 18, но меньше 30. Появляется дополнительной текстовое поле с вопросом «А служили ли вы в армии?» и на странице ASP дополнительно выводиться сообщение: Здравия желаем.
Вариант 2
1. Измените программный код, добавьте текстовое поле для указания пола, с подсказкой для ввода.
2. Реализуйте проверку на вводимый возраст, если меньше 11 страница ASP выводит сообщение: Подросток ( для обоих полов), от 12 – 25 – девушка (для женского пола), юноша (для мужского пола), старше 25 – женщина и мужчина соответственно введенным значения в текстовое поле.
Вариант 3
1. Измените программный код, чтобы выводилась инструкция о заполнении полей.
2. Реализуйте проверку на вводимую фамилию. Если вводится своя фамилия, в ASP файле выводится сообщение «Я приветствую сам себя!», если фамилия одногруппника, дополнительно в ASP файле выводится сообщение для него, например, «Отдай конспект!».
Вариант 4
1. Создать страницу, которая содержит ссылку Зарегистрироваться. По нажатию на которую, появляется WEB- форма, с полями для ввода фамилии, имени, города, возраста.
2. Реализуйте проверку на заполнение всех полей. В ASP файле выводится данные, которые были введены пользователем. Если вводится город Тирасполь, в ASP файле выводится сообщение «Я приветствую тебя земляк!».
КОНТРОЛЬНЫЕ ВОПРОСЫ:
1. В чем особенность Web – приложения и отличие от например Windows – приложения?
2. Что происходит после отправки запроса из браузера?
3. Раскройте понятие Web –сервера.
4. Особенность IIS, как создать виртуальный каталог?
5. Как добавить элементы управления в WEB- форму?
6. Какими свойствами обладают элементы управления?
7. Как создать активную серверную страницу?
8. Для чего необходимо создавать серверную страницу?
9. Какое расширение имеет активная серверная страница?
10. Какие существуют методы передачи данных на сервер, чем они отличаются друг от друга?
11. Как осуществляется передача данных на страницу ASP при помощи метода POST?
12. Как реализовать скрипт на стороне клиента?
13. Как осуществить проверку заполнения текстовых полей формы?
14. Как создать функцию на языке Jscript.?
15. В чем заключаются недостатки технологии ASP?
16. В чем заключаются преимущества технологии ASP.NET?
17. Два вида моделей программного кода Web страницы ASP.NET.