Реалізація відкриття PWA на iOS за deep-link з WhatsApp
1. Загальний опис
Проєкт створений на платформі Lovable.
Додаток працює як PWA (Progressive Web App) та встановлюється користувачами на iPhone через Safari ("Додати на екран додому").
Необхідно реалізувати механізм, при якому:
Користувач отримує повідомлення у WhatsApp
У повідомленні міститься URL з конкретним маршрутом (наприклад:
https://domain.com/order/123)
При натисканні на посилання:
якщо PWA встановлений — відкривається саме PWA,
і одразу відкривається сторінка, що відповідає URL
якщо PWA не встановлений — відкривається веб-версія у Safari
2. Функціональні вимоги
2.1 Deep Linking
Реалізувати коректну обробку deep-link у PWA на iOS:
Підтримка відкриття маршруту типу:
/order/:id
/client/:id
інші внутрішні маршрути (SPA-навігація)
При відкритті через Safari або WhatsApp:
якщо додаток встановлений через Home Screen → відкривається PWA
маршрут не втрачається
сторінка не редіректиться на головну
2.2 Поведінка при встановленому PWA
Якщо користувач вже встановив PWA:
Посилання з WhatsApp повинно:
відкривати саме встановлений додаток
зберігати маршрут
коректно ініціалізувати стан (auth, дані, токени)
2.3 Поведінка при неавторизованому користувачі
Якщо користувач не залогінений:
Після відкриття deep-link:
відкривається сторінка логіну
після успішної авторизації — редірект на первинний маршрут
3. Технічні вимоги
3.1 PWA конфігурація
Перевірити та при необхідності реалізувати:
Коректний manifest.json
start_url
scope
display: standalone
HTTPS обов'язково
Коректна робота Service Worker
Відсутність повних перезавантажень сторінок (SPA)
3.2 iOS специфіка
Врахувати особливості iOS:
PWA відкривається в окремому standalone-контексті
Потрібно забезпечити:
правильну обробку window.location
коректну ініціалізацію роутера
збереження параметрів URL
3.3 Маршрутизація
Якщо використовується:
Next.js / React Router / інший SPA роутер —
необхідно гарантувати:
роботу прямого відкриття маршруту
роботу при оновленні сторінки
роботу через deep-link
4. Приклад сценарію
Статус замовлення змінюється
Система відправляє WhatsApp повідомлення з URL:
Копировать код
https://domain.com/order/4582
Користувач натискає посилання
Якщо PWA встановлений:
відкривається PWA
відкривається сторінка замовлення №4582
Якщо PWA не встановлений:
відкривається веб-версія
5. Очікуваний результат
PWA коректно відкривається з deep-link на iOS
Маршрут не губиться
Не відбувається редірект на головну
Авторизація зберігається
Поведінка стабільна при повторному відкритті
6. Бажано
Тестування на реальному iPhone
Перевірка відкриття з:
WhatsApp
Safari
Telegram
Врахування edge-cases:
додаток у фоні
додаток повністю закритий
закінчився токен