Раздел «Фоновые службы» Chrome DevTools представляет собой набор инструментов для API-интерфейсов JavaScript, которые позволяют вашему веб-сайту отправлять и получать обновления, даже если у пользователя ваш веб-сайт не открыт. Фоновая служба функционально аналогична фоновому процессу .
Раздел «Фоновые службы» позволяет отлаживать следующие фоновые службы:
Chrome DevTools может регистрировать события выборки, синхронизации и уведомлений в течение трех дней, даже если DevTools не открыт. Это поможет вам убедиться, что события отправляются и принимаются должным образом.
Помимо событий фонового обслуживания, DevTools может:
- Показывать отчеты , которые Chrome уже отправил или собирается отправить с помощью Reporting API .
- Позволяет вам отлаживать и тестировать кэш назад/вперед одним щелчком мыши.
Фоновая выборка
API фоновой выборки позволяет сервисному работнику надежно загружать большие ресурсы, такие как фильмы или подкасты, в качестве фоновой службы. Чтобы регистрировать события фоновой выборки в течение трех дней, даже если DevTools не открыт:
- Откройте DevTools , например, на этой демонстрационной странице .
Перейдите в Приложение > Фоновые службы > Фоновая выборка и нажмите
Записывать . 
На демонстрационной странице нажмите «Хранить ресурсы локально ». Это вызывает некоторую фоновую активность выборки. DevTools записывает события в таблицу.
Нажмите на событие, чтобы просмотреть подробную информацию о нем под таблицей.
Вы можете закрыть DevTools и оставить запись на срок до трех дней. Чтобы остановить запись, нажмите
Останавливаться .
Фоновая синхронизация
API фоновой синхронизации позволяет автономному сервисному работнику отправлять данные на сервер после восстановления надежного подключения к Интернету. Чтобы регистрировать события фоновой синхронизации в течение трех дней, даже если DevTools не открыт:
- Откройте DevTools , например, на этой демонстрационной странице .
Перейдите в Приложение > Фоновые службы > Фоновая синхронизация и нажмите
Записывать . 
На демонстрационной странице нажмите «Зарегистрировать фоновую синхронизацию» , чтобы зарегистрировать соответствующего сервисного работника, и нажмите «Разрешить» при появлении запроса.
Регистрация сервисного работника — это действие фоновой синхронизации. DevTools записывает события в таблицу.
Нажмите на событие, чтобы просмотреть подробную информацию о нем под таблицей.
Вы можете закрыть DevTools и оставить запись на срок до трех дней. Чтобы остановить запись, нажмите
Останавливаться .
(Экспериментальное) Устранение последствий отслеживания отказов
Эксперимент по снижению риска отслеживания отказов в Chrome позволяет вам определять и удалять состояние сайтов, которые, по-видимому, выполняют межсайтовое отслеживание, используя технику отслеживания отказов. Вы можете вручную принудительно применить меры отслеживания и просмотреть список сайтов, состояния которых были удалены.
Чтобы принудительно принять меры по смягчению последствий отслеживания:
- Заблокируйте сторонние файлы cookie в Chrome . Перейдите к и включите
> Настройки > 
Конфиденциальность и безопасность > Файлы cookie и другие данные сайта > 
Блокируйте сторонние файлы cookie . - В
chrome://flagsустановите для эксперимента по устранению последствий отслеживания отказов значение «Включено с удалением» . - Откройте DevTools , например, на демонстрационной странице , и перейдите в раздел «Приложение» > «Фоновые службы» > «Устранение последствий отслеживания отказов ».
- На демонстрационной странице щелкните ссылку возврата и подождите (10 секунд), пока Chrome зафиксирует отказ. Вкладка «Проблемы» предупреждает вас о предстоящем удалении состояния.
- Нажмите Принудительный запуск , чтобы немедленно удалить состояние.
Уведомления
После того как работник службы получил push-сообщение от сервера, он использует API уведомлений для отображения данных пользователю. Чтобы регистрировать уведомления в течение трех дней, даже если DevTools не открыт:
- Откройте DevTools , например, на этой демонстрационной странице .
Перейдите в Приложение > Фоновые службы > Уведомления и нажмите
Записывать . 
На демонстрационной странице нажмите «Запланировать уведомление» и «Разрешить» при появлении запроса.
Дождитесь появления уведомления. DevTools записывает события уведомлений в таблицу.
Нажмите на событие, чтобы просмотреть подробную информацию о нем под таблицей.
Вы можете закрыть DevTools и оставить запись на срок до трех дней. Чтобы остановить запись, нажмите
Останавливаться .
Спекулятивная нагрузка
Спекулятивная загрузка обеспечивает практически мгновенную загрузку страницы на основе заданных вами правил спекуляции. Это позволяет вашему веб-сайту выполнять предварительную выборку и предварительную обработку наиболее часто посещаемых страниц.
Предварительная выборка заранее извлекает ресурс, а предварительный рендеринг идет на шаг дальше и визуализирует всю страницу в скрытом фоновом процессе рендеринга.
Отладку спекулятивных нагрузок можно выполнить в разделе Приложение > Фоновые службы > Спекулятивные нагрузки . Раздел содержит три представления:
- Спекулятивные нагрузки . Содержит спекулятивный статус текущей страницы, текущий URL-адрес, страницы, которые текущая страница пытается загрузить спекулятивно, и их статусы.
- Правила . Содержит наборы правил на текущей странице панели «Элементы» и общий статус спекуляций.
- Спекуляции . Содержит таблицу с информацией о попытках спекулятивной загрузки и их статусах. Если попытка не удалась, вы можете щелкнуть ее в таблице, чтобы просмотреть подробную информацию и причину неудачи.
Попробуйте отладить спекулятивные нагрузки на этой демонстрационной странице :
Откройте DevTools на странице и выберите Приложение > Фоновые службы > Спекулятивные нагрузки . Если вы не видите никаких спекулятивных загрузок, инициированных страницей, перезагрузите ее.
Начальная страница демо-версии выполняет предварительную обработку двух страниц и не выполняет предварительную обработку одной. Нажмите «Просмотреть все предположения» .
В разделе «Предположения» выберите предположение со статусом «Сбой» , чтобы увидеть причину сбоя в разделе с подробной информацией внизу.
В этом случае предварительная обработка не удалась, поскольку на веб-сайте нет страницы
/next3.html.Откройте раздел «Правила» и нажмите « Статус» , чтобы увидеть набор правил внизу. Щелкнув ссылку «Набор правил», вы перейдете на панель «Элементы» и увидите, где определено правило спекуляции.
Более подробное описание см. в разделе Отладка правил спекуляций .
Push-сообщения
Чтобы отобразить push-уведомление пользователю, сервисный работник должен сначала использовать API push-сообщений для получения данных с сервера. Когда работник службы готов отобразить уведомление, он использует API уведомлений . Чтобы регистрировать push-сообщения в течение трех дней, даже если DevTools не открыт:
- Откройте DevTools , например, на этой демонстрационной странице .
Перейдите в Приложение > Фоновые службы > Push-сообщения и нажмите
Записывать . 
На демонстрационной странице включите переключатель «Включить push-уведомления» , при появлении запроса нажмите «Разрешить », введите сообщение и отправьте его. DevTools записывает события уведомлений в таблицу.
Нажмите на событие, чтобы просмотреть подробную информацию о нем под таблицей.
Вы можете закрыть DevTools и оставить запись на срок до трех дней. Чтобы остановить запись, нажмите
Останавливаться .
API отчетов
Некоторые ошибки случаются только на производстве. Вы никогда не увидите их локально или во время разработки, потому что реальные пользователи, сети и устройства меняют игру.
Например, предположим, что ваш новый сайт использует стороннее программное обеспечение, которое использует document.write() для загрузки важных сценариев. Новые пользователи со всего мира открывают ваш сайт, но у них может быть более медленное соединение, чем вы тестировали. Неизвестно вам, что ваш сайт начинает ломаться для них, потому что Chrome вмешивается в работу document.write() в медленных сетях. В качестве альтернативы вы можете следить за устаревшими или скоро устаревающими API-интерфейсами, которые может использовать ваша кодовая база.
API отчетов предназначен для того, чтобы помочь вам отслеживать устаревшие вызовы API, нарушения безопасности вашей страницы и многое другое. Вы можете настроить отчеты, как описано в разделе Мониторинг вашего веб-приложения с помощью API отчетов .
Чтобы просмотреть отчеты, созданные страницей:
- Перейдите на
chrome://flags/#enable-experimental-web-platform-features, установите для экспериментальных функций веб-платформы значение «Включено» и перезапустите Chrome. Откройте DevTools и перейдите в раздел «Приложение» > «Фоновые службы» > «API отчетов» . Например, вы можете просмотреть отчеты на этой демонстрационной странице .
Вкладка Reporting API разделена на три части:
- Таблица «Отчеты» со следующей информацией по каждому отчету:
- URL , вызвавший создание отчета
- Тип нарушения
- Статус отчета
- Конечная точка назначения
- Создано по временной метке
- Тело отчета
- Раздел предварительного просмотра тела отчета . Чтобы просмотреть текст отчета, щелкните отчет в таблице отчетов.
- Раздел «Конечные точки» с обзором всех конечных точек, настроенных в заголовке
Reporting-Endpoints.
Статус отчета
В столбце «Статус» указано, успешно ли Chrome отправил отчет, собирается его отправить или произошла ошибка.
| Положение дел | Описание |
|---|---|
Success | Браузер отправил отчет, и конечная точка ответила кодом успеха ( 200 или другим кодом ответа об успехе 2xx ). |
Pending | Браузер пытается отправить отчет. |
Queued | Отчет создан, но браузер еще не пытается его отправить. Отчет отображается как Queued в одном из этих двух случаев:
|
MarkedForRemoval | После повторной попытки в течение некоторого времени ( Queued ) браузер прекратил попытки отправить отчет и вскоре удалит его из списка отчетов для отправки. |
Отчеты удаляются через некоторое время независимо от того, успешно ли они отправлены.