Перейти к основному содержимому

Интеграция с аналитическими инструментами

Подключение внешних аналитических сервисов для отслеживания поведения пользователей и метрик бизнеса.

Поддерживаемые сервисы​

Google Analytics 4​

Самый популярный инструмент веб-аналитики от Google.

Настройка GA4​

interface GA4Config {
  measurement_id: string;
  api_secret: string;
  enhanced_ecommerce: boolean;
  user_id_tracking: boolean;
  custom_dimensions: CustomDimension[];
}

interface CustomDimension {
  name: string;
  parameter_name: string;
  scope: 'user' | 'session' | 'item';
}

Отслеживаемые события​

  • Просмотры страниц
  • Покупки и транзакции
  • Добавления в корзину
  • Регистрации пользователей
  • Поиск товаров
  • Просмотры товаров

Пример интеграции​

// Инициализация GA4
gtag('config', 'GA_MEASUREMENT_ID', {
  send_page_view: false,
  user_id: userId
});

// Отправка события покупки
gtag('event', 'purchase', {
  transaction_id: orderId,
  value: totalAmount,
  currency: 'RUB',
  items: orderItems.map(item => ({
    item_id: item.product_id,
    item_name: item.name,
    category: item.category,
    quantity: item.quantity,
    price: item.price
  }))
});

Яндекс.Метрика​

Ведущий российский сервис веб-аналитики.

Настройка Метрики​

interface YandexMetrikaConfig {
  counter_id: number;
  webvisor: boolean;
  click_map: boolean;
  track_links: boolean;
  accurate_track_bounce: boolean;
  ecommerce: boolean;
}

E-commerce отслеживание​

// Покупка
ym(counterId, 'reachGoal', 'purchase', {
  order_id: orderId,
  order_price: totalAmount,
  currency: 'RUR'
});

// Данные электронной торговли
window.dataLayer = window.dataLayer || [];
dataLayer.push({
  ecommerce: {
    purchase: {
      actionField: {
        id: orderId,
        revenue: totalAmount
      },
      products: orderItems
    }
  }
});

Adobe Analytics​

Корпоративное решение для анализа данных.

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

interface AdobeAnalyticsConfig {
  report_suite_id: string;
  tracking_server: string;
  ssl_tracking_server: string;
  visitor_namespace: string;
  custom_variables: AdobeVariable[];
}

Hotjar​

Анализ поведения пользователей с помощью тепловых карт и записей сессий.

Настройка Hotjar​

interface HotjarConfig {
  site_id: number;
  version: number;
  trigger_recording: TriggerRule[];
  heatmap_pages: string[];
}

interface TriggerRule {
  condition: string;
  action: 'start_recording' | 'stop_recording';
}

Кастомная аналитика​

Внутренняя система метрик​

interface CustomAnalytics {
  events: AnalyticsEvent[];
  metrics: BusinessMetric[];
  dashboards: AnalyticsDashboard[];
  reports: AnalyticsReport[];
}

interface AnalyticsEvent {
  id: string;
  name: string;
  category: EventCategory;
  properties: EventProperty[];
  frequency: TrackingFrequency;
}

Отслеживание пользовательских метрик​

// Отправка кастомного события
analytics.track('product_viewed', {
  product_id: productId,
  category: productCategory,
  price: productPrice,
  user_segment: userSegment,
  page_location: window.location.href
});

// Установка пользовательских свойств
analytics.identify(userId, {
  plan: 'premium',
  signup_date: signupDate,
  total_orders: orderCount
});

Настройка целей и конверсий​

Цели электронной торговли​

interface EcommerceGoal {
  id: string;
  name: string;
  type: GoalType;
  value: number;
  conditions: GoalCondition[];
}

type GoalType = 
  | 'purchase'
  | 'add_to_cart'
  | 'begin_checkout'
  | 'sign_up'
  | 'page_view';

Воронки конверсии​

interface ConversionFunnel {
  name: string;
  steps: FunnelStep[];
  timeframe: number; // часы
  attribution_model: AttributionModel;
}

interface FunnelStep {
  name: string;
  condition: StepCondition;
  required: boolean;
}

Сегментация аудитории​

Пользовательские сегменты​

interface UserSegment {
  id: string;
  name: string;
  conditions: SegmentCondition[];
  size: number;
  auto_update: boolean;
}

interface SegmentCondition {
  property: string;
  operator: ComparisonOperator;
  value: any;
  timeframe?: TimeRange;
}

Когортный анализ​

interface CohortAnalysis {
  metric: CohortMetric;
  period: CohortPeriod;
  retention_periods: number[];
  segments: UserSegment[];
}

type CohortMetric = 'retention' | 'revenue' | 'activity';
type CohortPeriod = 'daily' | 'weekly' | 'monthly';

Отчетность и дашборды​

Автоматические отчеты​

interface AnalyticsReport {
  id: string;
  name: string;
  schedule: ReportSchedule;
  recipients: string[];
  content: ReportContent;
  format: ReportFormat;
}

interface ReportSchedule {
  frequency: 'daily' | 'weekly' | 'monthly';
  time: string;
  timezone: string;
  days_of_week?: number[];
}

Кастомные дашборды​

interface CustomDashboard {
  id: string;
  name: string;
  widgets: DashboardWidget[];
  filters: DashboardFilter[];
  sharing: SharingSettings;
}

GDPR и приватность​

Соблюдение GDPR​

interface PrivacySettings {
  cookie_consent: boolean;
  data_anonymization: boolean;
  retention_period: number; // дни
  user_opt_out: boolean;
  data_export: boolean;
}

Управление согласием​

// Проверка согласия пользователя
if (hasUserConsent('analytics')) {
  // Инициализация аналитики
  initializeAnalytics();
} else {
  // Запрос согласия
  showConsentBanner();
}

Производительность и оптимизация​

Ленивая загрузка скриптов​

interface ScriptLoading {
  defer: boolean;
  async: boolean;
  conditional: LoadingCondition[];
  timeout: number;
}

interface LoadingCondition {
  type: 'user_interaction' | 'page_loaded' | 'scroll_depth';
  threshold?: number;
}

Кеширование данных​

interface AnalyticsCaching {
  strategy: CacheStrategy;
  duration: number;
  storage: StorageType;
  compression: boolean;
}

Интеграция через API​

Measurement Protocol​

// Google Analytics Measurement Protocol
const payload = {
  v: '1',
  tid: 'GA_TRACKING_ID',
  cid: clientId,
  t: 'event',
  ec: 'ecommerce',
  ea: 'purchase',
  ev: orderValue
};

fetch('https://www.google-analytics.com/collect', {
  method: 'POST',
  body: new URLSearchParams(payload)
});

Server-side отслеживание​

// Отправка серверных событий
await analytics.track({
  userId: userId,
  event: 'subscription_created',
  properties: {
    plan: 'premium',
    amount: 99.99,
    currency: 'USD'
  },
  timestamp: new Date()
});