Quando l'utente installa la PWA, il browser ha bisogno di un modo per identificarla
in modo univoco. Tuttavia, fino a poco tempo fa, le specifiche del manifest dell'app web non definisce esplicitamente un modo per identificare in modo univoco una PWA, lasciando ai browser la decisione e portando a implementazioni diverse. In alcuni browser viene utilizzato start_url
, mentre in altri viene utilizzato il percorso del file manifest, che non consente di aggiornare entrambi i campi.
Per risolvere questo problema, nella specifica del file manifest dell'app web è disponibile una nuova proprietà id
facoltativa, che consente di definire in modo esplicito l'identificatore utilizzato per la PWA. L'aggiunta della proprietà id
al manifest rimuove la dipendenza da
start_url
o dalla posizione del manifest e consente di
aggiornarli in futuro.
Che cosa fa la proprietà id
?
La proprietà id
rappresenta l'identità della PWA sul browser. Quando il browser vede un manifest che non ha un'identità corrispondente a una PWA già installata, la considera come una nuova PWA, anche se viene pubblicata dallo stesso URL di un'altra PWA. Se, invece, vede un manifest con un'identità
che corrisponde alla PWA già installata, lo considera come la PWA installata.
Supporto del browser
Il supporto per la proprietà id
è arrivato in Chrome 96.
Che cosa devo fare se ho un'app senza id
?
Non è richiesta alcuna azione da parte tua e se non aggiungi id
al file manifest dell'app web (a condizione che start_url
e il percorso del manifest rimangano invariati). Per rendere la tua PWA a prova di futuro, puoi aggiungere una proprietà id
al manifest dell'app web.
Come faccio a determinare e impostare il mio id
?
Il modo più sicuro e preciso per determinare il id
per una PWA
è controllare il valore calcolato da Chrome.
- Utilizzando Chrome 96 o versioni successive, apri il riquadro Manifest del riquadro Applicazione in DevTools.
- Passa il mouse sopra l'icona
(!)
accanto alla proprietà ID app. L'icona della descrizione comando(!)
viene visualizzata solo seid
non è specificato nel file manifest dell'app web. - Tieni presente il valore
id
mostrato nella descrizione comando (vedi screenshot di seguito). - Aggiungi una proprietà
id
al manifest dell'app web utilizzando il valoreid
mostrato nella descrizione comando.
{
...
id: "/?homescreen=1",
start_url: "/?homescreen=1",
...
}
Cosa succede se non imposto un id
?
Non preoccuparti, non si verificherà nulla. A partire da Chrome 96, il browser genererà un id
se non ne esiste uno nel file manifest in base al start_url
nel manifest dell'app web.
L'aggiunta di un id
al manifest dell'app web consente di modificare start_url
e il percorso manifest (se e solo se la relativa origine specifica rimane invariata), poiché il browser identificherà la PWA in base al id
specificato, anziché al percorso start_url
o al percorso manifest.
Come faccio a testarlo?
Per verificare il comportamento:
- Installa la PWA.
- Apri
about://web-app-internals/
e controlla le proprietàunhashed_app_id
estart_url
della PWA installata. - Aggiungi una proprietà
id
al file manifest dell'app web seguendo i passaggi descritti in Come faccio a determinare e impostare il mioid
qui sopra. - Riavvia il browser utilizzando
chrome://restart
, avvia la PWA daabout://apps
, quindi chiudi la PWA per forzare l'aggiornamento del file manifest. - Apri
about://web-app-internals/
e controlla la proprietàmanifest_id
della PWA installata per verificare che non sia cambiata. - Modifica il
start_url
nel file manifest dell'app web. - Riavvia il browser utilizzando
chrome://restart
, avvia la PWA daabout://apps
, quindi chiudi la PWA per forzare l'aggiornamento del file manifest. - Apri
about://web-app-internals/
e controlla la proprietàstart_url
della PWA installata per verificare che sia stata aggiornata come previsto.