Realizacja otwarcia PWA na iOS za deep-link z WhatsApp
1. Ogólny opis
Projekt stworzony na platformie Lovable.
Aplikacja działa jako PWA (Progressive Web App) i jest instalowana przez użytkowników na iPhone przez Safari ("Dodaj na ekranie głównym").
Konieczne jest wdrożenie mechanizmu, w którym:
Użytkownik otrzymuje wiadomość w WhatsApp
W wiadomości znajduje się URL z konkretną trasą (na przykład:
https://domain.com/order/123)
Po kliknięciu w link:
jeśli PWA jest zainstalowane — otwiera się PWA,
i od razu otwiera się strona odpowiadająca URL
jeśli PWA nie jest zainstalowane — otwiera się wersja webowa w Safari
2. Wymagania funkcjonalne
2.1 Deep Linking
Wdrożyć poprawne przetwarzanie deep-link w PWA na iOS:
Wsparcie dla otwierania tras typu:
/order/:id
/client/:id
inne wewnętrzne trasy (nawigacja SPA)
Po otwarciu przez Safari lub WhatsApp:
jeśli aplikacja jest zainstalowana przez Ekran Główny → otwiera się PWA
trasa nie jest tracona
strona nie jest przekierowywana na główną
2.2 Zachowanie przy zainstalowanym PWA
Jeśli użytkownik już zainstalował PWA:
Link z WhatsApp powinien:
otwierać zainstalowaną aplikację
zachować trasę
poprawnie inicjalizować stan (auth, dane, tokeny)
2.3 Zachowanie przy nieautoryzowanym użytkowniku
Jeśli użytkownik nie jest zalogowany:
Po otwarciu deep-link:
otwiera się strona logowania
po udanej autoryzacji — przekierowanie na pierwotną trasę
3. Wymagania techniczne
3.1 Konfiguracja PWA
Sprawdzić i w razie potrzeby wdrożyć:
Poprawny manifest.json
start_url
scope
display: standalone
HTTPS obowiązkowo
Poprawna praca Service Worker
Brak pełnych przeładowań stron (SPA)
3.2 Specyfika iOS
Uwzględnić cechy iOS:
PWA otwiera się w osobnym kontekście standalone
Należy zapewnić:
poprawne przetwarzanie window.location
poprawną inicjalizację routera
zachowanie parametrów URL
3.3 Routing
Jeśli używane jest:
Next.js / React Router / inny router SPA —
należy zagwarantować:
działanie bezpośredniego otwierania trasy
działanie przy odświeżaniu strony
działanie przez deep-link
4. Przykład scenariusza
Status zamówienia zmienia się
System wysyła wiadomość WhatsApp z URL:
Kopiować kod
https://domain.com/order/4582
Użytkownik klika w link
Jeśli PWA jest zainstalowane:
otwiera się PWA
otwiera się strona zamówienia nr 4582
Jeśli PWA nie jest zainstalowane:
otwiera się wersja webowa
5. Oczekiwany wynik
PWA poprawnie otwiera się z deep-link na iOS
Trasa nie ginie
Nie następuje przekierowanie na główną
Autoryzacja jest zachowywana
Zachowanie stabilne przy ponownym otwarciu
6. Pożądane
Testowanie na rzeczywistym iPhone
Sprawdzenie otwierania z:
WhatsApp
Safari
Telegram
Uwzględnienie edge-cases:
aplikacja w tle
aplikacja całkowicie zamknięta
token wygasł
