Инструкция по подключению Safari web push


Аккаунты разработчика и Apple ID

Чтобы подключить Safari web push уведомления, нужно иметь учетную запись Apple ID https://appleid.apple.com

Apple ID

и аккаунт разработчика https://developer.apple.com/programs/

Аккаунт разработчика

Шаг 1. Регистрация Web-push ID

1. В аккаунте разработчика в разделе Website Push ID нужно создать новый Push ID

https://developer.apple.com/account/ios/identifier/websitePushId

Создание нового Push ID

Создание нового Push ID

 

В разделе регистрации нужно указать поля description и ID и нажимаем Continue

Заполнение полей description и ID

 

на следующем подтверждаем регистрацию

Подтверждение Website Push ID

и в конце нажимаем “Done”

Подтверждение регистрации

После подтверждения регистрации в списке Web push ID появится созданный вами ID

Созданный ID в списке

Шаг 2. Запрос сертификата в Связке ключей на MacOS

Далее нужно открыть программу Keychain Access. Она стандартная на компьютерах Apple. В меню программы выбрать пункт Certificate Assistant/Request a Certificate From a Certificate Authority

Certificate Assistant

В открывшемся меню заполнить Email пользователя и имя пользователя и выбрать пункт Saved to disk.

Certificate Information

...и сохранить файл

Сохранить настройки

 Шаг 3. Генерация сертификата

Возвращаемся в аккаунт разработчика https://developer.apple.com/account/ios/certificate/ и нажимем на «+»

Аккаунт разработчика

Нужно выбрать пункт Website Push ID Certificate

Website Push ID Certificate

На следующем шаге выбираем созданный нами Web push ID

Web push ID

На втором шаге визарда нажимаем «Continue»

Генерация сертификата .p8

На третьем шаге нужно загрузить сгенерированный через Keychain Access файл.

Keychain Access файл

На четвертом шаге скачиваем сертификат

Скачивание сертификата

Экспорт сертификата .p12

Дважды кликаем на скачанный файл. В открывшейся программе Keychain Access находим аккордеон нашего сертификата в списке My Certificates

Программа Keychain Access

Разворачиваем аккордеон и в контекстном меню выбираем пункт Export “...”

Экспорт сертификата

В диалоге генерации файла можно дополнительно задать пароль к файлу p.12

Генерация сертификата .p12

Получение сертификата .p8

Снова заходим в аккаунт разработчика в раздел Keys/All  https://developer.apple.com/account/ios/authkey/

Получение сертификата .p8

Кликаем на кнопку создания нового ключа

Создание нового ключа

Выбираем пункт Apple Push Notifications service (APNs)

Apple Push Notifications service (APNs)

На следующем шаге проверяем информацию информацию

Проверка информации

На последнем шаге скачиваем сертификат .p8

Скачивание сертификата .p8

 

Настройка Safari push в eSputnik

В своем аккаунте заходим в настройки

Настройка Safari push в eSputnik

в раздел Web push

Настройки для Web-push

Если вы добавляете Safari к существующему сайту, выберете его из списка. Если у вас еще нет сайта, нажмите кнопку Создать.

Настройки для Web-push

Для нового сайта вам понадобится заполнить все поля. Если сайт уже существует, заполните поле «Название сайта»

Привязка нового сайта

В разделе Web push для Safari нужно загрузить файлы .p8 и p.12

Настройки Web push для Safari

Key file password оставьте пустым, если при его создании вы не создавали к нему пароля.

Настройка Safari push в eSputnik

В поле Key ID нужно указать ID из кабинета разработчика. Его можно найти в разделе Keys, кликнув по соответствующему ключу.

Поле Key ID

Для отображения иконок в Safari нужно только квадратное изображение не менее 256 × 256 пикс. в формате PNG или JPEG. В отличие от подписчиков с других браузеров, для подписчиков Safari это изображение будет установлено только один раз и его нельзя будет изменить. При повторной смене этого изображения, старые подписчики будут получать уведомления со старым изображением, а новые с новым.

Загрузка изображения для веб-пуш

После сохранения всех настроек заходим на свой сайт с браузера Safari и видим приглашение получать уведомления!

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