3.1. Анализ и проверка HTML/JavaScript кода страниц веб-сайта

 

Давайте разберем, как проводить анализ HTML кода тестируемого сайта. Для начала определимся, как просмотреть HTML код. Существуют 2 способа.

Первый способ самый простой. Сначала откройте страницу, а затем в любом месте кликнете правой кнопкой мыши, чтобы открыть контекстное меню, а затем выберете опцию View Page Source (Просмотр кода страницы). Либо можете набрать комбинацию Ctrl+U. После этого откроется новая вкладка с HTML кодом.

Второй способ немного сложнее. Вам нужно будет открыть панель разработчика. Для этого одновременно нажмите на Ctr+Shift+I и переключитесь на вкладку Elements (для Chrome) или Inspector (для Mozilla Firefox):

Панель разработчика в браузере Chrome

Панель разработчика в браузере Firefox

 

Обратите внимание на теги HEAD и BODY. Дело в том, что структура HTML документа состоит из 2-х частей: заголовка и тела:

Заголовок легко определить по тегам <HEAD> … </HEAD>. Между этими тегами заключена служебная информация, которая не видна пользователю. К ней относят метаданные, подключаемые стили и скрипты.

Тело определяется тегами <BODY> … </BODY>. Именно в теле и содержится видимая часть страницы.

 

Комментарии

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

Комментарии обозначаются символами <! -- комментарии -->.

В качестве примера откройте самую первую страницу OWASP BWA, то есть просто введите IP адрес машины в браузере, а затем наберите Ctrl+U, чтобы открыть HTML код:

Комментарии в HTML коде

 

Здесь, как видите, комментарии подсвечены зеленым цветом для более легкого восприятия. Кроме того, видно, что по каким-то причинам разработчик закомментировал ячейку таблицы, которая содержит ссылку на очередное уязвимое приложение PHPBB2. Причем все, что закомментировано, не отображается пользователю в браузере. Откроем ссылку:

Страница веб-приложения PHPBB2

 

Как видим, приложение рабочее и представляет собой некий форум. В качестве второго примера откроем приложение BodgeIT:

Ссылка для открытия приложения BodgeIT

Закомментированная ссылка панели администратора

 

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

Страница администратора BodgeIT

 

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

Маркер/Ключевое слово

Фреймворк

<!-- START headerTags.cfm

Adobe ColdFusion

__VIEWSTATE

Microsoft ASP.NET

<!-- ZK

ZK

<!-- BC_OBNW -->

Business Catalyst

ndxz-studio

Indexhibit

 

Рекомендую пройтись самостоятельно по всем остальным приложениям. Уверен, там вы тоже найдете что-нибудь интересное.

 

Поиск комментариев с Nmap

Что делать, если приложение содержит большое количество страниц?

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

Чтобы облегчить себе задачу вы можете воспользоваться программой Nmap, которая представляет собой сканер сети. Программа довольно мощная и позволяет выполнять различные задачи, кроме того, она содержит различные скрипты, которые выполняют определенные задачи. Один из таких скриптов может нам помочь. Для этого откройте терминал и введите команду nmap 10.0.2.4 –script=http-comments-displayer.

Вывод команды довольно большой, так как она проверяет все приложения и все страницы на наличие комментариев. Кроме того, скрипт просматривает не только HTML код, но и JavaScript. Вам остается только листать вывод и искать что-нибудь интересное, но это не лучший вариант, поэтому сохраним результат сканирования в файл командой nmap 10.0.2.4 –script=http-comments-diplayer -oN /kali/comment_output.

Здесь в качестве выходного файла я указал название comment_output и сохранил его в домашнем каталоге пользователя kali, вы можете указать любое другое место.

 

Метаданные сайта

Любой сайт содержит определенные метаданные. Одни из них являются обязательными, а другие – опциональными.

Итак, что такое метаданные и где их искать?

Метаданные представляют собой служебные данные, которые содержат определенную информацию для поисковой (SEO) оптимизации и инструкции для браузера и других программ. Вы легко определите метаданные по тегу <meta атрибуты /> в заголовке HTML документа, то есть внутри тегов HEAD.

Наибольший интерес представляют следующие типы метаданных, указанных ниже.

Примера мета тега name=author

Если сайт принадлежит частному лицу, то обычно указывается тег с атрибутом name = “Author”. Информация в теге не несет какую-нибудь уязвимость, однако может быть использована, как вспомогательная. Например, зная имя автора, вы можете найти другие его проекты и провести другой тип атаки либо собрать больше интересных сведений.

 

Пример мета тега name=generator

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

 

Пример мета тега content=refresh

Данный тип использовался для автоматического обновления страницы или переадресации на другой сайт.

Существуют и другие типы метаданных, которые управляют Cookie, кэшированием и индексированием, однако они особого интереса не представляют. К тому же современные браузеры и поисковики, как Google и Яндекс, в основном игнорируют эти теги и руководствуются своими алгоритмами.

Тем не менее все же стоит проверять метаданные сайты, как дополнительный источник информации.

 

Скрытые элементы

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

Как найти такие элементы?

Очень просто, внизу даны некоторые советы.

Невидимые элементы Firefox подсвечивает серым цветом, для этого откройте панель разработчика с помощью Ctrl+Shift+I:

Невидимый блок помечен серым цветов в Firefox

 

Элементы ввода форм имеют атрибут hidden и выглядят так:

Пример HTML форм с атрибутом hidden

 

Если наберете Ctrl+F и в поле поиска введете hidden, input или form, то сможете без труда найти данные элементы, если таковые имеются.

Элемент становится скрытым благодаря CSS стилям. Это достигается с помощью встроенных (inline) стилей, которые имеют свойства display: none, а также с помощью классов, которые обычно имеют название вроде visible, invisible, hide, hidden:

Втроенный стиль со свойством display:none

 

Конечно, разработчик может придумать совсем другое название для CSS класса, поэтому остается более внимательно просматривать код.