Webhook уведомления

Webhook в контексте Lighthouse — это механизм автоматической отправки уведомлений о результатах аудита веб-страницы на указанный URL. Это позволяет интегрировать Lighthouse с внешними системами мониторинга, CI/CD пайплайнами или собственными инструментами анализа производительности.

Принципы работы Webhook

Webhook уведомления работают по принципу HTTP POST-запроса, который Lighthouse отправляет после завершения аудита. Запрос содержит JSON-объект с полными данными аудита, включая показатели производительности, доступность, SEO и рекомендации по улучшению.

Ключевые моменты:

  • Асинхронность: Lighthouse не ждёт ответа от сервера Webhook для завершения работы. Ошибки можно логировать, но основной процесс аудита не блокируется.
  • Формат данных: JSON-структура включает метаданные страницы (url, fetchTime), результаты категорий (performance, accessibility, best-practices, seo, pwa) и отдельные аудиторские записи.
  • Безопасность: рекомендуется использовать секретные токены или подписи HMAC для проверки подлинности запросов на стороне сервера.

Конфигурация Webhook

Для использования Webhook необходимо задать URL, на который будут отправляться уведомления. В Lighthouse это настраивается через объект конфигурации lighthouse.Config или параметры CLI.

Пример конфигурации через CLI:

lighthouse https://example.com --output=json --output-path=report.json --webhook-url=https://example.com/webhook

Через Node.js API:

const lighthouse = require('lighthouse');
const chromeLauncher = require('chrome-launcher');

async function runLighthouse(url, webhookUrl) {
  const chrome = await chromeLauncher.launch({chromeFlags: ['--headless']});
  const options = {
    port: chrome.port,
    output: 'json',
    webhook: {
      url: webhookUrl,
      headers: {
        'X-Auth-Token': 'секретный_токен'
      }
    }
  };
  const runnerResult = await lighthouse(url, options);
  await chrome.kill();
}
  • webhook.url — конечная точка для POST-запроса.
  • webhook.headers — дополнительные HTTP-заголовки, например для аутентификации.
  • Lighthouse автоматически сериализует результат аудита и отправляет его на указанный URL.

Обработка уведомлений на сервере

Серверная часть Webhook должна уметь:

  1. Принимать POST-запрос с Content-Type: application/json.
  2. Проверять подлинность (например, HMAC-подпись или секретный токен).
  3. Парсить JSON и извлекать необходимые данные для логирования, оповещений или аналитики.

Пример на Node.js с использованием Express:

const express = require('express');
const bodyParser = require('body-parser');

const app = express();
app.use(bodyParser.json());

app.post('/webhook', (req, res) => {
  const data = req.body;
  const url = data.url;
  const performanceScore = data.categories.performance.score;

  console.log(`Аудит страницы ${url}: производительность ${performanceScore}`);
  
  // Дальнейшая обработка, сохранение в базу данных или отправка уведомлений
  res.status(200).send('OK');
});

app.listen(3000, () => console.log('Webhook сервер запущен на порту 3000'));

Структура JSON уведомления

Webhook уведомления содержат несколько ключевых блоков:

  • fetchTime — время проведения аудита.

  • url — адрес проверяемой страницы.

  • categories — объект с ключевыми метриками:

    • performance — показатели производительности, включая First Contentful Paint, Speed Index и Total Blocking Time.
    • accessibility — оценка доступности элементов страницы.
    • best-practices — соблюдение современных веб-стандартов.
    • seo — базовые SEO-рекомендации.
    • pwa — соответствие критериям Progressive Web App.

  • audits — детализированные результаты отдельных проверок с описаниями и рекомендациями.

Пример фрагмента JSON:

{
  "url": "https://example.com",
  "fetchTime": "2026-03-24T12:00:00.000Z",
  "categories": {
    "performance": {"score": 0.92},
    "accessibility": {"score": 0.87},
    "seo": {"score": 0.95}
  },
  "audits": {
    "first-contentful-paint": {"score": 0.9, "displayValue": "1.2 s"},
    "interactive": {"score": 0.85, "displayValue": "2.5 s"}
  }
}

Рекомендации по использованию

  • Асинхронная обработка: избегать синхронных блокировок на сервере Webhook, чтобы Lighthouse не зависал.
  • Повторная отправка: предусматривать механизм повторной отправки в случае временных ошибок сети.
  • Фильтрация данных: при необходимости отправлять только критические метрики, чтобы уменьшить объём передаваемых данных.
  • Логирование: хранить все уведомления для аудита и анализа динамики производительности.

Интеграция с CI/CD

Webhook уведомления позволяют интегрировать Lighthouse в процессы автоматизированного тестирования:

  • Отправка результатов в Slack или Teams.
  • Автоматическое обновление дашбордов с метриками производительности.
  • Генерация отчётов о деградации скорости или доступности после релизов.

Преимущество такого подхода — полная автоматизация мониторинга без необходимости вручную запускать Lighthouse.

Оглавление