Веб-сайты и веб-приложения — 11 класс
Информатика · 11 класс · урок 2

Веб-сайты и веб-приложения

Взаимодействие браузера и веб-сервера. Сетевое хранение данных

План урока

5 минутПовторение прошлого урока
7 минутСайт и веб-приложение
12 минутБраузер и веб-сервер
6 минутСетевое хранение
10 минутИтоговый тренажёр

1. Вспомните путь запроса

На прошлом уроке мы разобрали сеть как систему устройств, каналов связи и протоколов. Теперь проследим, как эта система помогает открыть веб-страницу.

1. ИмяБраузер получает IP-адрес сервера через DNS.
→
2. МаршрутIP-пакеты проходят через локальную сеть и маршрутизаторы.
→
3. ОбменБраузер отправляет запрос, сервер возвращает ответ.
Связь двух уроков. IP (Internet Protocol — межсетевой протокол) отвечает за доставку пакетов между сетями. HTTP задаёт правила обмена веб-запросами и ответами между программами.

2. Веб-страница, веб-сайт и веб-приложение

Веб-страницаОтдельный документ, доступный по своему URL. Страница может содержать текст, изображения, ссылки и интерактивные элементы.
Веб-сайтСвязанный набор веб-страниц и ресурсов под общим доменным именем.
Веб-приложениеСайт, в котором пользователь не только читает информацию, но и выполняет действия с данными: редактирует, отправляет, рассчитывает, общается.
ПризнакИнформационный сайтВеб-приложение
Основная цельПредставить материалы для просмотра.Дать инструменты для работы с данными.
Действия пользователяЧтение, переход по ссылкам, поиск.Ввод, изменение, сохранение, совместная работа.
Состояние пользователяЧасто вход не требуется.Часто нужен вход, чтобы хранить личные данные и настройки.
ГраницаОна условна: современный сайт может одновременно содержать статьи, поиск, личный кабинет и редактор документов.

Статическое и динамическое содержимое

СтатическоеСервер передаёт заранее подготовленный файл. Пользователи обычно получают одинаковое содержимое.
ДинамическоеСервер формирует ответ с учётом запроса, данных в базе, пользователя, времени или других условий.
Не путайте. «Динамический» не обязательно означает «анимированный». Главное — содержимое формируется или изменяется в зависимости от данных и действий пользователя.

3. Как взаимодействуют браузер и веб-сервер

Браузер выступает клиентом: создаёт запрос, принимает ответ и отображает результат. Веб-сервер принимает запрос, находит или формирует нужные данные и отправляет ответ.

БраузерПользователь открывает адрес или нажимает кнопку.
→
HTTP-запросGET /course/page
→
Веб-серверОбрабатывает запрос и готовит ответ.
БраузерРазбирает полученные файлы и строит страницу.
←
HTTP-ответ200 OK + данные
←
Веб-серверВозвращает статус, заголовки и тело ответа.

HTTP (Hypertext Transfer Protocol — протокол передачи гипертекста) описывает формат запросов и ответов. HTTPS (Hypertext Transfer Protocol Secure — защищённый протокол передачи гипертекста) использует шифрование и проверку подлинности сервера.

Запрос содержитметод действия, адрес ресурса, служебные заголовки и иногда тело с передаваемыми данными.
Ответ содержиткод состояния, служебные заголовки и тело: документ, изображение, данные или сообщение об ошибке.
КодСмыслПример ситуации
200Запрос выполнен успешно.Страница или данные получены.
404Ресурс не найден.В адресе ошибка или страница удалена.
500Ошибка на стороне сервера.Сервер не смог обработать запрос.

Из чего браузер собирает страницу

HTMLHyperText Markup Language — язык гипертекстовой разметки. Задаёт структуру и содержание.
CSSCascading Style Sheets — каскадные таблицы стилей. Описывает внешний вид.
JavaScriptЯзык программирования, который добавляет поведение и взаимодействие на стороне браузера.
Одна страница — несколько запросов. Получив основной HTML-документ, браузер обычно отдельно запрашивает стили, сценарии, изображения, шрифты и данные.

4. Сетевое хранение данных

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

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

Синхронизация и резервное копирование

СинхронизацияУдобна для продолжения работы на разных устройствах. Но ошибочное удаление или изменение тоже может синхронизироваться.
Резервная копияСоздаётся для восстановления данных после ошибки, сбоя или потери основной копии. Она должна сохраняться независимо от текущих изменений.
Важный вывод. Сам факт хранения файла «в облаке» не гарантирует резервного копирования. Нужно знать, есть ли корзина, история версий и отдельная резервная копия.

5. Итоговый тренажёр

Четыре тематические страницы, 24 задания. Итоговая проверка находится на последней странице.

Страница 1 из 4Отвечено: 0 из 24