Consenti alle PWA installate di gestire i link che usano un protocollo specifico per un'esperienza più integrata.
Informazioni sugli schemi (ovvero protocolli)
Un URI (Uniform Resource Identifier) è una sequenza compatta di caratteri che identifica una risorsa astratta o fisica. Ogni URI inizia con un nome schema che fa riferimento a una specifica per l'assegnazione di identificatori all'interno di quello schema. Di conseguenza, la sintassi dell'URI è un sistema di denominazione federato ed estensibile in cui la specifica di ogni schema può limitare ulteriormente la sintassi e la semantica degli identificatori che utilizzano quello schema. Gli schemi sono noti anche come protocolli. Puoi vedere alcuni esempi di programmi di seguito.
tel:+1-816-555-1212
mailto:Jane.Doe@example.com
news:comp.infosystems.www.servers.unix
https://web.dev/
Il termine Uniform Resource Locator (URL) si riferisce al sottoinsieme di URI che, oltre a identificare una risorsa, forniscono un mezzo per individuare la risorsa descrivendone il meccanismo di accesso principale (ad esempio la località della rete).
Informazioni generali sul metodo registerProtocolHandler()
Il metodo Navigator
basato solo su contenuti sicuri
registerProtocolHandler()
consente ai siti di registrare la loro capacità di aprire o gestire determinati schemi di URL. Pertanto, i siti devono
chiamare il metodo in questo modo: navigator.registerProtocolHandler(scheme, url)
. I due parametri sono
definiti come segue:
scheme
: una stringa contenente il protocollo che il sito vuole gestire.url
: una stringa contenente l'URL del gestore. Questo URL deve includere%s
, come segnaposto che verrà sostituito con l'URL con caratteri di escape da gestire.
Lo schema deve essere uno degli schemi inclusi nella lista sicura (ad esempio mailto
, bitcoin
o magnet
) oppure iniziare con web+
, seguito da almeno una o più lettere ASCII minuscole dopo il prefisso web+
, ad esempio web+coffee
.
Per renderlo più chiaro, ecco un esempio concreto della procedura:
- L'utente visita un sito in
https://coffeeshop.example.com/
che effettua la seguente chiamata:navigator.registerProtocolHandler('web+coffee', 'coffee?type=%s')
. - In un secondo momento, durante la visita a
https://randomsite.example.com/
, l'utente fa clic su un link, ad esempio<a href="web+coffee:latte-macchiato">All about latte macchiato</a>
. - Questo fa sì che il browser acceda al seguente URL:
https://coffeeshop.example.com/coffee?type=web%2Bcoffee%3A%2F%2Flatte-macchiato
. La stringa di ricerca decodificata con URL restituisce quindi?type=web+coffee://latte-macchiato
.
Oggetto della gestione dei protocolli
L'attuale meccanismo di registrazione del gestore di protocollo URL per le PWA riguarda l'offerta della registrazione dei gestori di protocollo come parte di un'installazione PWA tramite il relativo manifest. Dopo aver registrato una PWA come gestore di protocollo, quando un utente fa clic su un link ipertestuale con uno schema specifico come mailto
, bitcoin
o web+music
da un browser o un'app specifica della piattaforma, la PWA registrata si aprirà e riceverà l'URL. È importante notare che sia la registrazione basata su manifest proposta sia
la tradizionale registerProtocolHandler()
svolgono ruoli molto simili nella pratica, pur
consentendo la possibilità di esperienze utente complementari:
- Le somiglianze includono requisiti relativi all'elenco di schemi che è possibile registrare, al nome e al formato dei parametri e così via.
- Le differenze nella registrazione basata su manifest sono minime, ma potrebbero essere utili per migliorare l'esperienza per gli utenti di PWA. Ad esempio, la registrazione della PWA basata su manifest potrebbe non richiedere un'ulteriore azione dell'utente oltre all'installazione della PWA avviata dall'utente.
casi d'uso
- In una PWA di elaborazione testi, l'utente in un documento trova un link a una presentazione, ad esempio
web+presentations://deck2378465
. Quando l'utente fa clic sul link, la PWA della presentazione si apre automaticamente nell'ambito corretto e mostra la presentazione. - In un'app di chat specifica per la piattaforma, l'utente in un messaggio di chat riceve un link a un URL
magnet
. Dopo aver fatto clic sul link, viene avviata una PWA torrent installata e avviata il download. - L'utente ha installato una PWA streaming di musica. Quando un amico condivide un link a un brano come
web+music://songid=1234&time=0:13
e l'utente fa clic sul brano, la PWA di streaming musicale verrà avviata automaticamente in una finestra indipendente.
Come utilizzare la registrazione del gestore di protocolli URL per le PWA
L'API per la registrazione del gestore di protocollo URL è modellata strettamente su
navigator.registerProtocolHandler()
. Solo questa volta le informazioni vengono passate in modo dichiarativo tramite il manifest dell'app web in una nuova proprietà denominata "protocol_handlers"
che accetta un array di oggetti con le due chiavi richieste "protocol"
e "url"
. Lo snippet di codice riportato di seguito mostra come
registrare web+tea
e web+coffee
. I valori sono stringhe contenenti l'URL del gestore con il segnaposto %s
richiesto per l'URL con caratteri di escape.
{
"protocol_handlers": [
{
"protocol": "web+tea",
"url": "/tea?type=%s"
},
{
"protocol": "web+coffee",
"url": "/coffee?type=%s"
}
]
}
Più app che si registrano per lo stesso protocollo
Se più applicazioni si registrano come gestori per lo stesso schema, ad esempio il protocollo mailto
, il sistema operativo mostrerà all'utente un selettore e gli consentirà di decidere quale dei gestori registrati utilizzare.
La stessa app si registra per più protocolli
La stessa app può registrarsi per più protocolli, come puoi vedere nell'esempio di codice riportato sopra.
Aggiornamenti delle app e registrazione dei gestori
Le registrazioni dei gestori vengono sincronizzate con l'ultima versione del file manifest fornita dall'app. Esistono due casi:
- Un aggiornamento che aggiunge nuovi gestori attiva la registrazione dei gestori (separata dall'installazione dell'app).
- Un aggiornamento che rimuove i gestori attiva l'annullamento della registrazione dei gestori (separato dalla disinstallazione delle app).
Debug del gestore di protocollo in DevTools
Vai alla sezione Gestori di protocollo tramite il riquadro Applicazione > Manifest. Puoi visualizzare e testare tutti i protocolli disponibili qui.
Ad esempio, installa questa PWA demo. Nella sezione Gestori di protocollo, digita "americano" e fai clic su Verifica protocollo per aprire la pagina relativa al caffè nella PWA.
Demo
Puoi vedere una demo della registrazione del gestore di protocolli URL per le PWA su Glitch.
- Vai a https://protocol-handler.glitch.me/, installa la PWA e ricarica l'app dopo l'installazione. Il browser ha ora registrato la PWA come gestore del protocollo
web+coffee
con il sistema operativo. - Nella finestra della PWA installata, fai clic sul link https://protocol-handler-link.glitch.me/. Si aprirà una nuova scheda del browser con tre link. Fai clic sul primo o sul secondo (latte macchiato o
americano). Il browser ora mostrerà un messaggio e ti chiederà se vuoi che l'app sia un gestore di protocollo per il protocollo
web+coffee
. Se accetti, la PWA si aprirà e mostrerà il caffè selezionato. - Per un confronto con il flusso tradizionale che utilizza
navigator.registerProtocolHandler()
, fai clic sul pulsante Registra gestore di protocollo nella PWA. Poi nella scheda del browser fai clic sul terzo link (chai). Allo stesso modo, mostrerà un prompt, ma aprirà la PWA in una scheda, non in una finestra del browser. - Inviati un messaggio su un'applicazione specifica della piattaforma come Skype su Windows con un link come
<a href="web+coffee://americano">Americano</a>
e fai clic sul link. Allo stesso modo, dovrebbe aprire la PWA installata.
Considerazioni sulla sicurezza
Poiché l'installazione di PWA richiede che il contesto sia sicuro, la gestione dei protocolli eredita questo vincolo. L'elenco dei gestori di protocollo registrati non è esposto al web in alcun modo, quindi non può essere utilizzato come vettore di fingerprinting.
Tentativi di navigazione non avviati dall'utente
I tentativi di navigazione non avviati dall'utente, ma che sono programmatici, non possono aprire le app. L'URL del protocollo personalizzato può essere utilizzato solo in contesti di navigazione di primo livello ma non, ad esempio, come URL di un iframe.
Lista consentita di protocolli
Proprio come con registerProtocolHandler()
, esiste una lista consentita di protocolli che le app possono gestire.
Richiesta di consenso
Al primo avvio della PWA a causa di un protocollo richiamato, all'utente viene visualizzata una finestra di dialogo delle autorizzazioni. Questa finestra di dialogo mostra il nome e l'origine dell'app e chiede all'utente se l'app è autorizzata a gestire i link dal protocollo. Se un utente rifiuta la finestra di dialogo delle autorizzazioni, il gestore di protocollo registrato verrà ignorato dal sistema operativo. Per annullare la registrazione del gestore di protocollo, l'utente deve disinstallare la PWA da cui è stato registrato. Il browser annulla la registrazione del gestore di protocollo anche se l'utente seleziona "Memorizza la mia scelta" e "Non consentire".
Feedback
Il team di Chromium vuole conoscere la tua esperienza con la registrazione del gestore di protocolli URL per le PWA.
Parlaci della progettazione dell'API
C'è qualcosa nell'API che non funziona come previsto? Oppure mancano metodi o proprietà di cui hai bisogno per implementare la tua idea? Hai domande o commenti sul modello di sicurezza? Segnala un problema relativo alle specifiche nel repository GitHub corrispondente o aggiungi le tue opinioni su un problema esistente.
Segnala un problema con l'implementazione
Hai trovato un bug nell'implementazione di Chromium? Oppure l'implementazione è diversa dalle specifiche?
Segnala un bug all'indirizzo new.crbug.com. Assicurati di includere il maggior numero di dettagli possibile e di istruzioni semplici per la riproduzione e inserisci UI>Browser>WebAppInstalls
nella casella Componenti. Glitch funziona benissimo per condividere riproduzioni rapide e semplici.
Mostra il supporto dell'API
Intendi utilizzare la registrazione del gestore di protocolli URL per le PWA? Il tuo supporto pubblico aiuta il team di Chromium a dare la priorità alle funzionalità e mostra ad altri fornitori di browser quanto è fondamentale supportarle.
Condividi come prevedi di utilizzarlo nel thread del discorso WiCG. Invia un tweet a
@ChromiumDev usando l'hashtag
#ProtocolHandler
e facci sapere dove e come lo stai usando.
Link utili
Ringraziamenti
La registrazione del gestore di protocolli URL per le PWA è stata implementata e specificata da Fabio Rocha, Diego González, Connor Moody e Samuel Tang del team di Microsoft Edge. Questo articolo è stato esaminato da Joe Medley e Fabio Rocha. Immagine hero di JJ Ying su Unsplash.