В этой статье рассмотрим возможности браузера, которые помогают разработчикам: рассмотрим исходный код страницы, HTTP-ответы и HTTP-запросы.
Посмотрим на исходный код страницы. Это можно сделать различными способами (на примере Yandex-браузера):
- нажать правую кнопку мыши на любом свободном месте веб-страницы и выбрать пункт меню "Посмотреть код страницы"
- в меню браузера выбрать пункты: "Дополнительно" > "Дополнительные инструменты" > "Посмотреть код страницы"
- нажать комбинацию клавиш "Ctrl + U"
В других браузерах просмотр исходного кода тоже доступен, но меню несколько отличается.
В результате откроется новая вкладка, в которой будет отображён исходный код страницы. Выглядит примерно так:
В таком виде браузер и получает от сервера страницу, читает её и отображает в удобном для пользователя виде.
В исходном коде мы видим HTML-разметку. HTML (Hyper Text Markup Lguage) - язык разметки гипертекста. Именно разметки, не программирования.
Теперь разберёмся откуда пришёл исходный код. А пришёл он с сервера в HTTP-ответе. Чтобы его увидеть, используем инструменты разработчика, которые есть в браузерах. Опять же рассмотрим на примере Yandex-браузера.
Тут тоже есть несколько вариантов, но самый простой – клавиша F12.
Теперь в открывшемся окне:
- выбираем вкладку Network
- затем вкладку Doc
- указываем исследуемй элемент (если его нет, то перезагружаем страницу)
- Выбираем вкладку Response
Вот тут мы и видим тот самый HTML-код.
В инструментах разработчика можно посмотреть и заголовки ответов. Их можно увидеть на вкладке Headers
Значения некоторых заголовков:
- Request URL – адрес запрошенной клиентом страницы
- Remote Address – IP-адрес сервера в интернете
- date – дата и время создания ответа
- content-type – тип содержимого ответа
Теперь рассмотрим HTTP-запросы. На той же вкладке Headers находим раздел Request Headers.
Тут можно посмотреть заголовки запросов. Например, метод запроса – Request Method и список языков – accept-language.
Request Method – сообщает о методе запроса, в данном примере используется метод GET. Этот метод используется тогда, когда клиент не хочет ничего записывать на сервер, а только отсылает запрос.
Accept-language – содержит список языков, на которых браузер готов принять ответ. Параметр q задаёт предпочтение того или иного языка для браузера. В примере на картинке ниже для английского установлено значение 0.9. Это значит, что приоритет для английского равен 90%. Ну а для русского приоритет не задан и по-умолчанию равен 100%.
А на этом пока всё. Есть вопросы, пишите в комментариях, будем разбираться.
