Opening PWA for IOS

Implementation of opening PWA on iOS via deep-link from WhatsApp

1. General description

The project is created on the Lovable platform.

The application works as a PWA (Progressive Web App) and is installed by users on iPhone through Safari ("Add to Home Screen").

It is necessary to implement a mechanism where:

The user receives a message in WhatsApp

The message contains a URL with a specific route (for example:

https://domain.com/order/123)

When clicking on the link:

if the PWA is installed — the PWA opens,

and the page corresponding to the URL opens immediately

if the PWA is not installed — the web version opens in Safari

2. Functional requirements

2.1 Deep Linking

Implement correct handling of deep-link in PWA on iOS:

Support for opening routes of the type:

/order/:id

/client/:id

other internal routes (SPA navigation)

When opened via Safari or WhatsApp:

if the app is installed via Home Screen → the PWA opens

the route is not lost

the page is not redirected to the main

2.2 Behavior with installed PWA

If the user has already installed the PWA:

The link from WhatsApp should:

open the installed application

preserve the route

correctly initialize the state (auth, data, tokens)

2.3 Behavior with unauthorized user

If the user is not logged in:

After opening the deep-link:

the login page opens

after successful authorization — redirect to the original route

3. Technical requirements

3.1 PWA configuration

Check and implement if necessary:

Correct manifest.json

start_url

scope

display: standalone

HTTPS is mandatory

Correct operation of Service Worker

No full page reloads (SPA)

3.2 iOS specifics

Consider the features of iOS:

PWA opens in a separate standalone context

It is necessary to ensure:

correct handling of window.location

correct initialization of the router

preservation of URL parameters

3.3 Routing

If using:

Next.js / React Router / another SPA router —

it is necessary to guarantee:

the direct opening of the route works

it works when refreshing the page

it works via deep-link

4. Example scenario

The order status changes

The system sends a WhatsApp message with the URL:

Copy code

https://domain.com/order/4582

The user clicks the link

If the PWA is installed:

the PWA opens

the order page №4582 opens

If the PWA is not installed:

the web version opens

5. Expected result

The PWA opens correctly from the deep-link on iOS

The route is not lost

No redirect to the main page occurs

Authorization is preserved

Behavior is stable upon reopening

6. Desirable

Testing on a real iPhone

Checking opening from:

WhatsApp

Safari

Telegram

Considering edge-cases:

the app in the background

the app completely closed

token expired