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

Справочник Browser SDK

Справочник по Browser SDK (window.sdk): как со страницы предложить установку PWA, подписать посетителя на пуши, отправить события и что для этого нужно в настройках. Общее знакомство — в статье Browser SDK; как подключить его на свой прелендинг — в SDK на своём прелендинге.

Настройки window.pwaConfig

SDK читает настройки из объекта window.pwaConfig, который вы задаёте на странице до подключения скрипта. На страницах, которые обслуживает Qubix, объект подставляется автоматически; на своём прелендинге его задаёте вы.

ПолеЗачем
pwaIdИдентификатор PWA. Нужен для установки и для пушей
domainДомен страницы. Нужен для манифеста и для пушей
vapidKeyКлюч для пушей. Обычно подставляется автоматически при загрузке /sdk.js — вручную задавать не нужно
offerIdОффер (если нужно передать явно)
campaignIdКампания (если нужно передать явно)
paramsДополнительные метки трекинга
previewModeРежим предпросмотра: события не отправляются

Идентификатор PWA (pwaId) берётся из карточки приложения в разделе PWA Apps.

Подписка на пуши

Метод sdk.subscribePush() запрашивает у браузера разрешение на уведомления и оформляет подписку. Вызывать его нужно явно — например, по нажатию кнопки. Сам по себе он не срабатывает.

JavaScript
const subscription = await sdk.subscribePush()
if (subscription) {
// посетитель разрешил и подписан
}

Что происходит внутри:

  1. Показывается запрос разрешения браузера.
  2. Если посетитель разрешил — оформляется подписка и отправляется в Qubix.
  3. Повторные вызовы безопасны: если посетитель уже подписан, второй запрос не показывается.

Установка приложения для пушей не требуется — подписаться можно на обычной странице.

примечание

Пуши работают только на защищённом соединении (HTTPS) и на домене, заведённом в Qubix. Подробнее — в статье SDK на своём прелендинге.

Установка PWA

Если в window.pwaConfig задан pwaId, у SDK появляется набор методов sdk.pwa:

МетодЧто делает
sdk.pwa.init()Подготовка: регистрирует сервис-воркер и подключает манифест приложения
sdk.pwa.install()Показывает системный запрос установки приложения
sdk.pwa.canInstall()Доступна ли установка прямо сейчас
sdk.pwa.isInstalled()Установлено ли уже приложение
sdk.pwa.open()Открыть установленное приложение

init, install и isInstalled — асинхронные, вызывайте их через await. canInstall и open возвращают значение сразу.

JavaScript
if (sdk.pwa && sdk.pwa.canInstall()) {
await sdk.pwa.install()
}

Установку показывает сам браузер, поэтому действуют его правила: нужен HTTPS, подключённый манифест (SDK подключает его сам) и, как правило, действие посетителя на странице (клик, прокрутка). Поэтому кнопку установки обычно вешают на явное нажатие.

События

SDK сам сообщает в аналитику ключевые моменты — их видно в отчётах и в потоке событий:

СобытиеКогда
campaign_visitЗаход на страницу (отправляется автоматически)
push_prompt_shownПоказан запрос разрешения на пуши
push_allowПосетитель разрешил пуши
push_denyПосетитель запретил пуши
push_ignoredПосетитель закрыл запрос, не выбрав
install_acceptedПосетитель согласился установить приложение
install_rejectedПосетитель отказался от установки

Своё событие можно отправить вручную:

JavaScript
sdk.sendEvent('my_button_click', { place: 'hero' })

Данные трафика

Вспомогательные методы, чтобы прочитать контекст перехода:

МетодВозвращает
sdk.getOffer()Текущий оффер (идентификатор и ссылка)
sdk.getPwa()Текущее PWA
sdk.getPiuid()Идентификатор посетителя
sdk.getTrackingParams()Метки трекера, пришедшие с переходом
sdk.buildOfferUrl(url)Собрать ссылку оффера с проброшенными метками
sdk.showStore()Перейти на карточку-витрину PWA

Что делает SDK сам

Без вызовов с вашей стороны SDK при загрузке страницы: собирает данные об устройстве, разбирает метки трекинга из адреса, подключает манифест приложения (если задан pwaId) и отправляет событие захода campaign_visit. Установка и подписка на пуши сами не запускаются — их вы вызываете кодом.

Что дальше