# Настройка веб-пушей Чтобы начать отправку веб-пушей с помощью Pushwoosh, вам необходимо настроить платформу для веб-пушей и включить запрос на подписку, который будет показываться пользователям. Чтобы начать настройку, перейдите в **Settings > Platform Configuration > Web Push Notifications** и нажмите **Configure**. ![Настройка веб-пушей](/web-configuration-1.webp) ## Настройка веб-пушей для всех браузеров (кроме старых версий Safari) Эта конфигурация применяется ко всем современным браузерам, включая последние версии Safari, которые теперь поддерживают веб-пуши нативно. **Примечание:** Старые версии Safari (macOS 10.14–12) требуют отдельной настройки. Вы можете настроить их в специальном разделе. Узнать больше Чтобы начать настройку, нажмите **Configure** в разделе **All browsers configuration**. ![Настройка веб-пушей для всех браузеров](/web-configuration-2.webp) В окне конфигурации выберите один из следующих вариантов: * **Create a new push configuration** Рекомендуется, если вы ранее не настраивали веб-пуши через другой сервис. Pushwoosh автоматически сгенерирует новую пару ключей VAPID. * **Use existing configuration** Выберите этот вариант, если у вас уже есть ключи VAPID, например, из Firebase, и вы хотите продолжать их использовать, не прося пользователей подписываться заново. ### Создать новую конфигурацию пушей Выберите **Create a new push configuration**, если вы ранее не настраивали веб-пуши с помощью другого сервиса. Pushwoosh автоматически сгенерирует для вас необходимые ключи VAPID (Voluntary Application Server Identification).
Что такое ключи VAPID? Ключи VAPID — это пара из открытого и закрытого ключей, используемая в протоколе Web Push для аутентификации сервера приложений при отправке push-уведомлений в веб-браузеры. **Открытый ключ** передается браузеру, когда пользователь подписывается на уведомления. **Закрытый ключ** остается на вашем сервере и используется для безопасной подписи каждого отправляемого вами сообщения.
Нажмите **Configure**, чтобы сгенерировать и применить ключи. ![Создание новой конфигурации пушей](/web-configuration-3.webp) После создания Pushwoosh будет автоматически использовать эти ключи в конфигурации SDK. [Узнайте больше об интеграции Web Push SDK](/ru/developer/pushwoosh-sdk/web-push-notifications/web-push-sdk-30/) ### Использовать существующую конфигурацию Если у вас уже есть ключи VAPID (например, сгенерированные через Firebase), вы можете использовать их для настройки веб-пушей в Pushwoosh. Для этого: 1. Выберите **Use existing configuration**. 2. В поле **Web Push Certificate** введите ваш **открытый ключ VAPID**. 3. В поле **Web Push Private Key** введите ваш **закрытый ключ VAPID**. 4. Нажмите **Configure**, чтобы сохранить и применить настройки. ![Использование существующей конфигурации](/web-configuration-4.webp) #### Как найти ключи VAPID в Firebase Если вы переходите с Firebase и хотите использовать существующие ключи VAPID, выполните следующие шаги, чтобы их найти. ##### Сертификат Web Push 1. В **Firebase** перейдите в **Project Settings → Cloud Messaging**. 2. Прокрутите вниз до раздела **Web Configuration** и скопируйте существующую пару ключей. ![Поиск сертификата Web Push](/web-configuration-6.webp) 3. Вставьте его в поле **Web Push Certificate** в форме конфигурации Pushwoosh. ![Вставка в поле Web Push Certificate](/web-configuration-7.webp) ##### Закрытый ключ Web Push 1. В **Firebase Console** перейдите в **Project Settings → Cloud Messaging → Web Configuration**. 2. Нажмите на **меню с тремя точками** в разделе **Actions** рядом с парой ключей и выберите **Show private key**. Этот ключ необходим для корректной работы веб-пушей. ![Поиск закрытого ключа Web Push](/web-configuration-8.webp) 3. Скопируйте отображаемый ключ в буфер обмена. 4. В форме **Pushwoosh Web Configuration** вставьте его в поле **Web Push Private Key**. ![Вставка закрытого ключа Web Push](/web-configuration-9.webp) 5. Нажмите **Apply**, чтобы сохранить изменения. ### Перенастройка веб-пушей Если вы уже настроили веб-пуши, но вам нужно обновить учетные данные (например, заменить ключи VAPID), вот как это сделать: 1. Нажмите **Reconfigure** в разделе **All browsers configuration**. ![Перенастройка веб-пушей](/web-configuration-5.webp) 2. В появившемся окне введите ваши новые ключи VAPID: * **Web Push Certificate**: ваш новый открытый ключ VAPID * **Web Push Private Key**: ваш новый закрытый ключ VAPID 3. Нажмите **Configure**, чтобы сохранить изменения. ### Настройка запроса на подписку Чтобы отправлять push-уведомления, пользователи должны явно дать разрешение через системный запрос браузера. Без этого разрешения уведомления не могут быть доставлены. Из-за недавних изменений в политике Chrome и Firefox, нативное всплывающее окно с запросом на разрешение может появиться только после того, как пользователь взаимодействует со страницей (например, нажмет на кнопку). Чтобы соответствовать этому требованию, Pushwoosh по умолчанию отображает [виджет запроса на подписку](/ru/developer/guides/messaging-channels/subscription-prompt/). Этот виджет побуждает пользователей дать согласие и, при их согласии, вызывает нативный запрос браузера. Чтобы настроить текст и внешний вид запроса, нажмите **Settings**. ![Настройка запроса на подписку](/web-configuration-16.webp) #### Типы запросов Доступны два типа запросов на подписку: * **Виджет по умолчанию** Предоставляется Pushwoosh и отображается автоматически. [Узнайте, как настроить виджет по умолчанию](/ru/developer/guides/messaging-channels/subscription-prompt/default-widget/). * **Пользовательский виджет** Используйте свой собственный дизайн виджета. [Узнать больше](/ru/developer/guides/messaging-channels/subscription-prompt/custom-subscription-widget/) > **Примечание:** Из-за ограничений платформы изменения в виджете могут появиться с задержкой до 30 минут. Если изменения не отображаются, свяжитесь со службой поддержки Pushwoosh. ### Конфигурация Safari (macOS 10.14–12) Для поддержки push-уведомлений в старых версиях Safari (macOS 10.14–12) вам необходимо выполнить отдельный процесс настройки, используя ваши учетные данные Apple Developer. Этот шаг требуется только для этих старых версий, так как новые версии Safari (macOS Ventura и более поздние) поддерживают стандартную настройку веб-пушей, включенную в [конфигурацию для всех браузеров](#configure-web-push-for-all-browsers-except-older-safari-versions). #### Получите необходимые учетные данные от Apple 1. Перейдите в раздел [Certificates, Identifiers & Profiles](https://developer.apple.com/account/overview.action) на портале Apple Developer. 2. Добавьте новый сертификат. Опция добавления нового сертификата на портале Apple Developer 3. Выберите тип **Website Push ID Certificate** и нажмите **Continue**. Выбор типа Website Push ID Certificate на портале Apple Developer 4. Выберите **Website Push ID** — вашу уникальную строку в формате обратного домена, например, _web.com.example.domain_ (должна начинаться с _web._). Выбор Website Push ID на портале Apple Developer 5. Загрузите **Certificate Signing Request**. Чтобы узнать больше о создании запросов на подписание сертификата, обратитесь к [статье справки Developer Account](https://developer.apple.com/help/account/create-certificates/create-a-certificate-signing-request). 6. После этого загрузите сертификат push-уведомлений. Загрузка сертификата push-уведомлений с портала Apple Developer #### Настройка Safari в Pushwoosh 1. Нажмите **Configure** в разделе **Safari Configuration**. ![Настройка Safari в Pushwoosh](/web-configuration-11.webp) 2. Заполните следующие поля в форме конфигурации: | | | | ------------------------ | ---------------------------------------------------------------------------------------------------------------------- | | **Website name** | Название вашего сайта, которое отображается в запросе на подписку. | | **Allowed domains** | Список доменов, которым разрешено запрашивать разрешение на уведомления (по одному в строке). | | **URL template** | URL, который открывается, когда пользователь нажимает на уведомление. Поддерживает плейсхолдеры, такие как `%@`, для вставки динамических значений. Пример: `https://yourwebsite.com/%@` | | **Website icon** | Загрузите квадратное изображение в формате PNG (256×256 пикселей). Pushwoosh автоматически изменяет его размер для различных интерфейсов. | | **Key file** | Загрузите сертификат `.p12`, экспортированный из вашего аккаунта Apple Developer. | | **Private key password** | Пароль, использованный при экспорте файла `.p12`. | ![Заполнение формы конфигурации Safari](/web-configuration-12.webp) 3. Нажмите **Configure**, чтобы сохранить изменения. Pushwoosh автоматически сгенерирует push-пакет с набором иконок, JSON-словарем сайта и файлом манифеста, который Safari запрашивает с сервера. Вы можете скачать его в любое время.