Используйте панель «Сеть» для анализа загрузки страницы и проверки сетевых ресурсов.
Обзор
Панель «Сеть» позволяет:
- Запись сетевой активности
- Проверка сетевых запросов
- Фильтровать и сортировать сетевые запросы
- Поиск сетевых заголовков и ответов
- Изменить поведение загрузки
- Блокировать сетевые запросы
- Изменить условия сети
- Правила спекуляций
prefetch
отладки - Переопределить заголовки ответа HTTP
- Переопределить заголовки для нескольких URL-адресов с помощью подстановочных знаков.
- Сохранение и экспорт данных сетевых запросов.
Ознакомьтесь с руководством по проверке сетевой активности, в котором рассматриваются некоторые из наиболее часто используемых функций панели «Сеть» .
Откройте панель «Сеть».
Чтобы открыть панель «Сеть» , откройте DevTools и затем нажмите «Сеть» , расположенную на панели действий вверху.
Альтернативно, чтобы открыть панель «Сеть» через меню «Команды», выполните следующие действия:
- Откройте Инструменты разработчика .
- Откройте командное меню, нажав:
- macOS: Command + Shift + P
- Windows, Linux, ChromeOS: Control + Shift + P.
- Начните вводить
Network
, выберите « Показать панель сети» и нажмите Enter .
Запись сетевой активности
Когда вы открываете DevTools , сетевые запросы автоматически записываются на панели «Сеть» , пока DevTools открыт.
Помимо записи, вы можете сделать следующее:
- Прекратите запись сетевых запросов .
- Удалите все запросы из таблицы Requests .
- Сохраняйте запросы при загрузке страниц .
- Эмулируйте офлайн-опыт .
- Имитация более медленных сетевых подключений .
Проверка сетевых запросов
Все сетевые запросы регистрируются в таблице «Запросы» в центре панели.
Дополнительные сведения о столбцах, отображаемых по умолчанию, а также о дополнительных столбцах, которые вы можете добавить, см. в разделе Просмотр журнала запросов .
Щелкните имя запроса, чтобы просмотреть вкладки с дополнительной информацией о запросе, включая следующую:
- Заголовки : HTTP-заголовки выбранного ресурса.
- Полезная нагрузка : параметры строки запроса и данные формы запроса.
- Предварительный просмотр : базовый рендеринг HTML.
- Ответ : Исходный код HTML выбранного ресурса.
- Инициатор : что послужило причиной запроса ресурса.
- Тайминг : разбивка сетевой активности для выбранного ресурса.
- Файлы cookie : файлы cookie запроса и ответа на него.
Фильтрация и сортировка сетевых запросов
Панель «Сеть» предоставляет два способа сортировки запросов в таблице «Запросы» :
Ниже описано несколько способов фильтрации запросов в таблице «Запросы» .
- Фильтровать запросы по свойствам
- Фильтровать запросы по типу
- Фильтровать запросы по времени
- Скрыть URL-адреса данных
- Скрыть URL-адреса расширений
- Показывать только запросы с заблокированными ответными файлами cookie
- Показать только заблокированные запросы
- Показывать только сторонние запросы
Поиск сетевых заголовков и ответов
Чтобы узнать, как искать в HTTP-заголовках и ответах всех ресурсов определенную строку или регулярное выражение, см. раздел Поиск сетевых заголовков и ответов .
Изменить поведение загрузки
Проверьте удобство использования вашей страницы, изменив поведение загрузки на панели «Сеть» .
С помощью панели «Сеть» вы можете сделать следующее:
- Эмулируйте первого посетителя, отключив кеш браузера.
- Очистите кэш браузера вручную
- Очистить файлы cookie браузера вручную
- Эмуляция в автономном режиме
- Имитировать медленное сетевое соединение
- Переопределить заголовки ответа HTTP
- Переопределить пользовательский агент
Сохранение и экспорт данных сетевых запросов.
Чтобы сохранить и экспортировать данные сетевых запросов, см. следующее: