1067
17
Разработал преподаватель кафедры информатики и информационных технологий: Шибеко Марина Николаевна
Лабораторная работа №1
Тема: Web-сервер Apache
Цель: - получить практические навыки в установке и выполнении базовой настройки web-сервера Apache.
Вид работы: фронтальный
Время выполнения: 2 часа
Теоретические сведения
Web-сервер Apache
Apache — один из популярных web-серверов в мире. В настоящее время программное обеспечение Apache установлено более чем на половине серверов.
Для настройки web-сервера Apache используются конфигурационные файлы:
основной конфигурационный файл httpd.conf, расположенный в каталоге conf;
дополнительные конфигурационные файлы, расположенные в каталоге conf\extra и подключаемые основному конфигурационному файлу httpd.conf по мере необходимости с помощью директивы Include;
конфигурационные файлы .htaccess, расположенные непосредственно в каталогах, для которых выполняются настройки.
В конфигурационных файлах с помощью директив определяется, как web-сервер должен работать с ресурсами, отвечая на запрос, указывается, с какими файлами пользователи могут выполнять определенные операции. Настройка конфигурационных файлов web-сервера Apache — самый ответственный шаг после его установки.
Web-сервер Apache читает основной конфигурационный файл httpd.conf однократно при запуске. Если web-сервер работает, то при изменении конфигурационного файла httpd.conf следует перезапустить web-сервер.
В конфигурационном файле httpd.conf и файлах .htaccess содержатся директивы, которые управляют работой web-сервера Apache.
В конце основного конфигурационного файла httpd.conf перечислены директивы Include, позволяющие подключить дополнительные конфигурационные файлы из каталога conf\extra.
Виртуальные хосты
Web-сервер Apache позволяет настроить виртуальные хосты.
Виртуальные хосты позволяют разместить более чем один web-сайт, используя один экземпляр web-сервера. Виртуальный хост может быть как «привязанным к IP-адресу» (IP-based), что позволяет использовать отдельный IP-адрес для каждого web-сайта, так и «привязанным к имени» (name-based), что позволяет использовать один и тот же IP-адрес для нескольких web-сайтов, различая виртуальных хосты по именам или номерам портов.
Для организации виртуальных хостов используются директивы Listen, NameVirtualHost и блочная директива VirtualHost (все примеры приведены для name-based виртуального хоста, определяемого номером порта и web-сервера Apache, установленного как консольное приложение).
Директива Listen задает номер порта, который «слушает» web-сервер. В конфигурационном файле может присутствовать несколько директив Listen.
Listen 8081
Директива NameVirtualHost позволяет создать name-based виртуальный хост со своим номером порта.
NameVirtualHost 127.0.0.1:8081
Блочная директива позволяет задать директивы, определяющие режимы работы виртуального хоста.
CustomLog …/…/access.log common
ErrorLog …/…/error.log
DocumentRoot …/…/www
Options …
…
…
…
Для настройки виртуального хоста можно использовать практически все директивы web-сервера Apache. Узнать, разрешена ли директива для использования в блочной директиве можно в локальной документации, доступной по адресу http://127.0.0.1:8080/manual. Директиву разрешено использовать в блочной директиве в случае, если в описании директивы в разделе Context указан virtual host.
Рекомендуется для каждого виртуального хоста с помощью директивы DocumentRoot задавать отдельный каталог для документов web-сайта, так как именно по этой причине и создаются виртуальные хосты.
Файлы регистрации доступа и ошибок могут быть одними и теми же для нескольких виртуальных хостов.
Блочные директивы и предназначены для задания директив, применяемых к соответствующим каталогам и файлам (например, для организации доступа к каталогу или файлу).
Организация доступа
Для организации доступа к каталогам и файлам используются директивы Allow, Deny, AuthType, AuthName, AuthGroupFile, AuthUserFile и Require.
Директивы Allow, Deny позволяют открыть / закрыть доступ для всех пользователей или пользователям, пришедшим с определенного хоста, домена или IP-адреса.
Allow from all / Deny from all
Allow from apache.org / Deny from apache.org
Allow from .net / Deny from .net
Allow from 192.168.1.104 / Deny from192.168.1.104
Allow from 192.168 / Deny from192.168
Порядок применения директив Allow и Deny определяется директивой Order.
Order Deny,Allow
#Если клиент упомянут в директиве Deny, ему запрещается доступ при условии,
#что он не упомянут в директиве Allow. Если ни в одной из директив клиент
#не упомянут, доступ ему разрешается.
Order Allow,Deny
#Доступ клиенту, который упомянут в директиве Allow, разрешен,
#если только он не упомянут в директиве Deny. Если ни в одной из директив
#клиент не упомянут, доступ ему запрещается.
Директивы AuthType, AuthName, AuthGroupFile, AuthUserFile и Require позволяют открыть / закрыть доступ для зарегистрированных пользователей.
Директива AuthType задает тип контроля полномочий.
AuthType Basic
Директива AuthName задает область, в которой действительны имена и пароли пользователей.
AuthName Test
Директивы AuthGroupFile и AuthUserFile задают имена текстовых файлов, в которых содержится информация о группах и пользователях, входящих в группы и именах пользователях и паролях. Файлы имеют следующий формат:
group1:user1 user2 …
group2:user3 user4 …
…
user1:password1
user2:password2
…
Пароли пользователей могут храниться как в незашифрованном, так и в зашифрованном виде. Для шифрования паролей используется утилита bin\htpasswd.exe. Для получения справочной информации по работе с утилитой следует запустить утилиту с ключом –?.
Имена файлов групп и пользователей выбираются произвольно, как и их расположение, единственное соображение безопасности заключается в том, что каталог с файлами лучше располагать выше каталога, заданного директивой DocumentRoot.
Директива Require определяет права доступа для отдельных пользователей, групп пользователей, всех зарегистрированных пользователей.
Require user user1 user2 …
#доступ разрешен перечисленным пользователям
Require group group1 group2 …
#доступ разрешен перечисленным группам пользователей
Require valid-user
#доступ разрешен всем зарегистрированным пользователям
Служебная индексация
В случае если каталог, заданный директивой DocumentRoot, не содержит индексного файла (директива DirectoryIndex), web-сервер Apache создает служебный индексный файл. Параметр Indexes директивы Options разрешает формирование служебного индексного файла.
Для изменения вида служебного индексного файла можно включить расширенную индексацию директивой IndexOptions.
IndexOptions FancyIndexing
Для расширенной индексации можно использовать директивы AddIcon, AddDescription, HeaderName, ReadmeName, IndexIgnore (описание директив для расширенной индексации см. в локальной документации в разделе «Reference Manual/Run-time Configuration Directives»).
Директивы включения на стороне сервера (SSI — Server Side Includes)
Директивы SSI, содержащиеся в документах, позволяют реализовать на серверной стороне выполнение некоторых действий и включить результаты этих действий в документы перед их отправкой клиенту. Аналогичные возможности, гораздо более широкие, предоставляют серверные скриптовые языки.
Формат директивы:
Директивы SSI оформляются как комментарии.
Для настройки web-сервера Apache для работы с директивами SSI используются директивы Options, AddOutputFilter и AddType.
Options Includes
#разрешает использование директив SSI
AddOutputFilter INCLUDES .ssi
#задает соответствие между расширением имени файла и фильтром,
#который будет обрабатывать ответ сервера перед отправкой клиенту
AddType text/html .ssi
#задает соответствие между расширением имени файла и media-типом
Описание директив включения на стороне сервера см. в локальной документации (расположено в разделе «Server Side Includes (SSI)/Basic SSI directives»).
Задания к практической работе
Задание. Установить web-сервер Apache, проверить правильность установки, выполнить настройку web-сервера, протестировать работу web-сервера, удалить web-сервер Apache.
Ход работы
Создать каталог disc:\webprog.
Установить web-сервер Apache в каталог disc:\webprog\Apache2.2 как консольное приложение.
Запустить web-сервер (Пуск/Все программы/Apache HTTP Server 2.2/Control Apache Server/Start Apache in Console).
Проверить правильность установки web-сервера, набрав в строке адреса браузера адрес http://127.0.0.1:8080.
Если web-сервер не запускается, посмотреть причину незапуска в файле disc:\webprog\Apache2.2\logs\error.log
Для остановки web-сервера использовать комбинацию клавиш Ctrl+C.
Ознакомиться с документацией по web-серверу Apache. Для этого в файле httpd.conf убрать комментарий в строке с директивой #Include conf/extra/httpd-manual.conf. Документация будет доступна по адресу http://127.0.0.1:8080/manual
Создать два виртуальных хоста на одном IP-адресе 127.0.0.1, настроив их на разные порты, например, 8081 и 8082. Расположить корневые каталоги документов хостов соответственно в каталогах disc:\webprog\vh1 и disc:\webprog\vh2.
Файлы для регистрации доступа access.log и ошибок error.log расположить в каталоге disc:\webprog\vhlogs.
Создать файлы с описанием групп пользователей и отдельных пользователей, и расположить их в каталоге disc:\webprog\vhsecurity.
При настройке виртуальных хостов изменить, при необходимости, настройки для корневого каталога web-сервера.
В корневом каталоге для документов виртуального хоста vh1 создать несколько каталогов и файлов. Определить различные права доступа к различным каталогам и файлам:
доступ разрешен всем;
доступ разрешен отдельным пользователям;
доступ разрешен группе пользователей;
доступ разрешен всем зарегистрированным пользователям;
доступ запрещен всем.
Протестировать работу SSI (Server Side Includes) — директив включения на стороне сервера.
В корневом каталоге для документов виртуального хоста vh2 организовать расширенную индексацию.
Перенести некоторые директивы (например, директивы для определения прав доступа, служебной индексации и т.п.) из основного конфигурационного файла в файлы .htaccess, расположенные непосредственно в каталогах, для которых выполняются настройки.
Удалить web-сервер Apache (Пуск/Панель управления/Установка и удаление программ).
Удалить каталог disc:\webprog.
Содержание отчета (отчет в электронном виде):
отчет сохранить в файле с именем БИ-13 Иванов (лр1).doc;
титульный лист;
цель работы;
задание;
порядок выполнения лабораторной работы
дерево созданных каталогов;
конфигурационные файлы;
файлы с именами и группами пользователей;
выводы по работе.
Лабораторная работа №2
Тема: Статический html-документ
Цель: - изучить основы языка разметки гипертекста HTML 4.
Вид работы: фронтальный
Время выполнения: 2 часа
Теоретические сведения
Язык разметки гипертекста HTML (Hypertext markup language) — язык разметки, используемый для создания гипертекстовых html-документов, отображаемых браузером.
Гипертекст — форматированный текст, содержащий ссылки на другие документы (гиперссылки).
Разметка — вставка в текст дополнительных служебных символов, каждый из которых является командой, указывающей браузеру, как следует отображать документ.
Язык разметки гипертекста HTML не является языком программирования.
Основным элементом языка разметки гипертекста HTML является тег (tag).
Теги содержат указания браузеру о способах отображения документа.
С помощью тегов в html-документ вставляются файлы, содержащие дополнительные данные (например, графику) и размечаются гиперссылки, посредством которых данный html-документ связывается с другими html-документами.
Как правило, теги состоят из начального и конечного элементов, между которыми размещаются текст и другие элементы html-документа. Имя конечного тега совпадает с именем начального, но перед именем конечного тега ставится косая черта.
Базовый синтаксис тега:
Содержимое тега
где name — это начальный элемент тега, содержащий имя тега, а name — конечный элемент тега.
В начальном элементе тега может располагаться перечень атрибутов тега. Атрибуты тега следуют за именем и отделяются друг от друга одним или несколькими пробелами. Порядок записи атрибутов в начальном элементе тега значения не имеет. Значение атрибута, если имеется, следует за знаком равенства, стоящим после имени атрибута. Если значение атрибута — одно слово или число, то его можно указать после знака равенства, не заключая в кавычки. Все остальные значения необходимо заключать в кавычки, особенно если они содержат пробелы. Если атрибут не указан, браузером используется его значение по умолчанию.
Регистр символов в именах тегов и атрибутов не учитывается.
Содержимое тега
Конечные теги никогда не содержат атрибутов.
При использовании вложенных тегов их нужно закрывать, соблюдая правильную вложенность.
В некоторых случаях конечные теги можно опускать. Тем не менее, рекомендуется использовать конечные элементы тегов, чтобы избежать ошибок в отображении html-документа браузером.
Некоторые теги, не имеющие конечного элемента, называются автономными тегами.
Html-документ состоит из заголовка документа и тела документа.
Название html-документа
Заголовок html-документа
head
body
Тело html-документа
body
html
Весь html-документ заключается в тег . Html-документ состоит из заголовка и тела, которые выделяются, соответственно, тегами и . В заголовке, с помощью тега title, указывается название html-документа, а также другие данные, которые браузер будет использовать при отображении документа.
Тело html-документа — та его часть, в которую помещается собственно содержимое html-документа. Тело включает предназначенный для отображения текст и управляющую разметку документа (теги), которые используются браузером.
Перечень тегов языка HTML и их атрибутов можно посмотреть в справочнике http://htmlbook.ru.
Спецификация языка разметки гипертекста HTML 4.01 расположена на сайте WWW-консорциума по адресу http://www.w3.org/TR/1999/REC-html401-19991224.
Задания к практической работе
Задание:
Создать html-документ, в разметке документа использовать:
тег для определения кодировки кириллицы ;
тег комментария ;
теги форматирования текста:
, и тег для разметки изображения тег для разметки гиперссылок , разметить ссылки на другой документ, в пределах размечаемого документа, на email; с помощью параметров тега изменить цвет фона документа, цвет текста, цвета непосещенных и посещенных ссылок документа, используя цвета из web-безопасной (гарантированной) палитры; теги для разметки списка, таблицы, формы в соответствии с вариантом.
, , , , , , , , , , , , продемонстрировать отличия тегов
, и ;;
Вариант 1:
Вариант 2:
Вариант 3:
Вариант 4:
Вариант 5:
Вариант 6:
Вариант 7:
Вариант 8:
Вариант 9:
Вариант 10:
Ход работы
Запустить текстовый редактор.
Разметить html-документ в соответствии с заданным вариантом. Для справки о тегах и их атрибутах можно использовать справочник, расположенный по адресу http://htmlbook.ru.
Протестировать созданный документ, по крайней мере, в двух браузерах, отметить различия в отображении документа.
Содержание отчета (отчет в электронном виде):
отчет сохранить в файле с именем БИ-13 Иванов (лр2).doc;
титульный лист;
цель работы;
задание;
порядок выполнения лабораторной работы
html-разметка созданного документа;
скриншоты html-документа для различных браузеров;
выводы по работе.
Лабораторная работа №3
Тема: Каскадные таблицы стилей CSS
Цель: - изучить основы каскадных таблицы стилей CSS 3
Вид работы: фронтальный
Время выполнения: 2 часа
Теоретические сведения
Каскадные таблицы стилей CSS (Cascading style sheets) — формальный язык описания внешнего вида документа, созданного с использованием языка разметки гипертекста.
Каскадные таблицы стилей позволяют разделить описание логической структуры html-документа (выполненное с помощью языка разметки) и описание внешнего вида html-документа (выполненное с помощью CSS).
Существует три способа определения стилей: 1) в отдельном файле, подключаемом к html-документам, 2) с помощью тега style непосредственно в некотором html-документе и 3) с помощью атрибута style непосредственно в некотором теге.
Наиболее высокий приоритет имеет стиль, определенный в теге, затем следует определение стиля с помощью тега style и самым низким приоритетом обладают свойства, определенные в отдельном файле.
Каскад приоритетов особенно удобен при разработке больших проектов, например, сайтов, состоящих из большого числа html-документов. В этом случае общее оформление может быть вынесено в отдельный файл, в html-документе могут быть внесены изменения в стиль документа с помощью тега style, атрибут тега style позволяет изменить оформление одного тега.
Стили определяются парами свойств и значений, перечень пар заключается в фигурные скобки и пары разделяются точкой с запятой:
{property_1:value_1; property_2:value_2; … ; property_n:value_n}
где property — это свойство, а value — значение свойства.
Стиль можно определить для конкретного тега, например, задать для тега body отображение белого текста на черном фоне:
body
{background-color:black; color:white}
Можно определить «чистый» стиль, не привязанный заранее к конкретному тегу, в этом случае речь идет об определении класса стиля:
.small_silver
{font-size:10px; color:silver}
или
#big_gold
{font-size:150px; color:#D7B56D}
Применение класса стиля:
p class=small_silverТекст светло-серого цвета размером 10 пикселp
или
p id=big_goldТекст светло-желтого цвета размером 150 пикселp
Описание стилей для тегов или классов стилей выполняется одинаково как в отдельном файле, так и в теге style.
Файл со стилями должен иметь расширение *.css и быть подключен к html-документу с помощью тега link, расположенного в теге head.
Тег style также должен быть расположен в теге head, после тега link.
Стили, определяемые непосредственно в теге с помощью атрибута style:
Подчеркнутый текст красного цвета
Возможно задание различных стилей отображения одного и того же html-документа в различных средах представления, например, на экране или печати с помощью атрибута media тега link.
Файл screen.css
body
{color:silver; background:black}
.forprint
{display:none}
Файл print.css
body
{color:black; background:white}
.forscreen
{display:none}
Файл media.html
Версия для экранапечати
div class=forscreenИзображение будет видно на экране:
div
div class=forprintbВнимание!b В версии для печати изображения нет.div
Методические указания по выполнению лабораторных работ по дисциплине " Web – проектирование" 