Відкриття PWA для IOS

Заказчик: AI | Опубликовано: 03.03.2026

Реалізація відкриття 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: додаток у фоні додаток повністю закритий закінчився токен