Consenti alle applicazioni web installate di essere gestori di file

Registra un'app come gestore di file con il sistema operativo.

Thomas Steiner

Ora che le app web sono in grado di leggere e scrivere file, il passo logico successivo è consentire agli sviluppatori di dichiarare queste stesse app web come gestori di file per i file che le loro app possono creare ed elaborare. L'API File Handling ti consente di fare esattamente questo. Dopo aver registrato un'app di modifica del testo come gestore di file e dopo averla installata, puoi fare clic con il tasto destro del mouse su un file .txt su macOS e selezionare "Ottieni informazioni" per indicare al sistema operativo che deve sempre aprire i file .txt con questa app come impostazione predefinita.

Casi d'uso suggeriti per l'API File Handling

Ecco alcuni esempi di siti che potrebbero utilizzare questa API:

• Applicazioni Office come editor di testo, app per fogli di lavoro e programmi per creare presentazioni.
• Editor grafici e strumenti di disegno.
• Strumenti di editor di livelli di videogiochi.

Come utilizzare l'API File Handling

Potenziamento progressivo

L'API File Handling in sé non può essere polyfillata. Tuttavia, la funzionalità di apertura dei file con un'app web può essere ottenuta in due modi diversi:

• L'API Web Share Target consente agli sviluppatori di specificare la propria app come destinazione di condivisione in modo che i file possano essere aperti dal foglio di condivisione del sistema operativo.
• L'API File System Access può essere integrata con il trascinamento dei file, in modo che gli sviluppatori possano gestire i file trascinati nell'app già aperta.

Supporto browser

Rilevamento delle funzionalità

Per verificare se l'API File Handling è supportata, utilizza:

if ('launchQueue' in window && 'files' in LaunchParams.prototype) {
  // The File Handling API is supported.
}

La parte dichiarativa dell'API File Handling

Come primo passaggio, le app web devono descrivere in modo dichiarativo nel manifest dell'app web il tipo di file che possono gestire. L'API File Handling estende il manifest dell'app web con una nuova proprietà chiamata "file_handlers" che accetta un array di gestori di file. Un gestore di file è un oggetto con queste proprietà:

• Una proprietà "action" che punta a un URL nell'ambito dell'app come valore.
• Una proprietà "accept" con un oggetto di tipi MIME come chiavi ed elenchi di estensioni di file come valori.
• Una proprietà "icons" con una serie di icone ImageResource. Alcuni sistemi operativi consentono a un'associazione di tipi di file di visualizzare un'icona che non è solo l'icona dell'applicazione associata, ma un'icona speciale correlata all'utilizzo di quel tipo di file con l'applicazione.
• Una proprietà "launch_type" che definisce se più file devono essere aperti in un singolo client o in più client. Il valore predefinito è "single-client". Se l'utente apre più file e se il gestore di file è stato annotato con "multiple-clients" come "launch_type", si verificherà l'avvio di più app e, per ogni avvio, l'array LaunchParams.files (vedi più avanti) avrà un solo elemento.

L'esempio seguente, che mostra solo l'estratto pertinente del file manifest dell'app web, dovrebbe rendere più chiaro il concetto:

{
  "file_handlers": [
    {
      "action": "/open-csv",
      "accept": {
        "text/csv": [".csv"]
      },
      "icons": [
        {
          "src": "csv-icon.png",
          "sizes": "256x256",
          "type": "image/png"
        }
      ],
      "launch_type": "single-client"
    },
    {
      "action": "/open-svg",
      "accept": {
        "image/svg+xml": ".svg"
      },
      "icons": [
        {
          "src": "svg-icon.png",
          "sizes": "256x256",
          "type": "image/png"
        }
      ],
      "launch_type": "single-client"
    },
    {
      "action": "/open-graf",
      "accept": {
        "application/vnd.grafr.graph": [".grafr", ".graf"],
        "application/vnd.alternative-graph-app.graph": ".graph"
      },
      "icons": [
        {
          "src": "graf-icon.png",
          "sizes": "256x256",
          "type": "image/png"
        }
      ],
      "launch_type": "multiple-clients"
    }
  ]
}

Si tratta di un'applicazione ipotetica che gestisce file con valori separati da virgola (.csv) in /open-csv, file di grafica vettoriale scalabile (.svg) in /open-svg e un formato di file Grafr inventato con una delle estensioni .grafr, .graf o .graph in /open-graf. I primi due si apriranno in un singolo client, l'ultimo in più client se vengono gestiti più file.

La parte imperativa dell'API File Handling

Ora che l'app ha dichiarato quali file può gestire in quale URL incluso nell'ambito teorico, deve fare qualcosa di imperativo con i file in entrata in pratica. È qui che entra in gioco il launchQueue. Per accedere ai file avviati, un sito deve specificare un consumer per l'oggetto window.launchQueue. I lanci vengono messi in coda finché non vengono gestiti dal consumer specificato, che viene richiamato esattamente una volta per ogni lancio. In questo modo, ogni lancio viene gestito, indipendentemente dal momento in cui è stato specificato il consumatore.

if ('launchQueue' in window && 'files' in LaunchParams.prototype) {
  launchQueue.setConsumer((launchParams) => {
    // Nothing to do when the queue is empty.
    if (!launchParams.files.length) {
      return;
    }
    for (const fileHandle of launchParams.files) {
      // Handle the file.
    }
  });
}

Supporto di DevTools

Al momento della stesura di questo articolo, non è disponibile il supporto di DevTools, ma ho presentato una richiesta di funzionalità per l'aggiunta del supporto.

Demo

Ho aggiunto il supporto per la gestione dei file a Excalidraw, un'app di disegno in stile cartoon. Per provarla, devi prima installare Excalidraw. Quando crei un file con questo formato e lo memorizzi in un punto qualsiasi del file system, puoi aprirlo con un doppio clic o con un clic con il tasto destro del mouse e selezionando "Excalidraw" nel menu contestuale. Puoi controllare l'implementazione nel codice sorgente.

Sicurezza

Il team di Chrome ha progettato e implementato l'API File Handling utilizzando i principi fondamentali definiti in Controlling Access to Powerful Web Platform Features, tra cui controllo utente, trasparenza ed ergonomia.

Autorizzazioni, persistenza delle autorizzazioni e aggiornamenti del gestore di file

Per garantire la fiducia degli utenti e la sicurezza dei loro file, quando l'API File Handling apre un file, viene mostrato un prompt di autorizzazione prima che una PWA possa visualizzare un file. Questa richiesta di autorizzazione verrà mostrata subito dopo che l'utente seleziona la PWA per aprire un file, in modo che l'autorizzazione sia strettamente correlata all'azione di apertura di un file utilizzando la PWA, rendendola più comprensibile e pertinente.

Questa autorizzazione verrà visualizzata ogni volta finché l'utente non fa clic su Consenti o Blocca la gestione dei file per il sito o ignora la richiesta tre volte (dopo di che Chromium bloccherà questa autorizzazione). L'impostazione selezionata verrà mantenuta alla chiusura e alla riapertura della PWA.

Quando vengono rilevati gli aggiornamenti e le modifiche del manifest nella sezione "file_handlers", le autorizzazioni verranno reimpostate.

Sfide relative ai file

Esiste un'ampia categoria di vettori di attacco che vengono aperti consentendo ai siti web di accedere ai file. Questi sono descritti nell'articolo sull'API File System Access. La funzionalità aggiuntiva pertinente alla sicurezza fornita dall'API File Handling rispetto all'API File System Access è la possibilità di concedere l'accesso a determinati file tramite l'interfaccia utente integrata del sistema operativo, anziché tramite un selettore di file mostrato da un'applicazione web.

Esiste ancora il rischio che gli utenti concedano involontariamente a un'applicazione web l'accesso a un file aprendolo. Tuttavia, è generalmente inteso che l'apertura di un file consente all'applicazione con cui viene aperto di leggere e/o manipolare il file. Pertanto, la scelta esplicita di un utente di aprire un file in un'applicazione installata, ad esempio tramite un menu contestuale "Apri con…", può essere interpretata come un segnale sufficiente di affidabilità dell'applicazione.

Verifiche per il gestore predefinito

L'eccezione si verifica quando non sono presenti applicazioni sul sistema host per un determinato tipo di file. In questo caso, alcuni sistemi operativi host potrebbero promuovere automaticamente il nuovo gestore registrato a gestore predefinito per quel tipo di file in modo silenzioso e senza alcun intervento da parte dell'utente. Ciò significa che se l'utente fa doppio clic su un file di quel tipo, questo si aprirà automaticamente nell'app web registrata. Su questi sistemi operativi host, quando lo user agent determina che non esiste un gestore predefinito per il tipo di file, potrebbe essere necessario un prompt di autorizzazione esplicita per evitare di inviare accidentalmente i contenuti di un file a un'applicazione web senza il consenso dell'utente.

Controllo utenti

La specifica indica che i browser non devono registrare ogni sito in grado di gestire i file come gestore di file. Al contrario, la registrazione della gestione dei file deve essere controllata dall'installazione e non deve mai avvenire senza la conferma esplicita dell'utente, soprattutto se un sito deve diventare il gestore predefinito. Anziché dirottare estensioni esistenti come .json per cui l'utente probabilmente ha già registrato un gestore predefinito, i siti dovrebbero prendere in considerazione la creazione di estensioni personalizzate.

Trasparenza

Tutti i sistemi operativi consentono agli utenti di modificare le associazioni di file attuali. Questo non rientra nell'ambito del browser.

Feedback

Il team di Chrome vuole conoscere la tua esperienza con l'API File Handling.

Descrivi la progettazione dell'API

C'è qualcosa nell'API che non funziona come previsto? Oppure mancano metodi o proprietà che ti servono per implementare la tua idea? Hai una domanda o un commento sul modello di sicurezza?

• Segnala un problema relativo alle specifiche nel repository GitHub corrispondente o aggiungi i tuoi commenti a un problema esistente.

Segnalare un problema relativo all'implementazione

Hai trovato un bug nell'implementazione di Chrome? O l'implementazione è diversa dalla specifica?

• Segnala un bug all'indirizzo new.crbug.com. Assicurati di includere il maggior numero di dettagli possibile, istruzioni semplici per la riproduzione e inserisci UI>Browser>WebAppInstalls>FileHandling nella casella Componenti.

Mostrare il supporto per l'API

Intendi utilizzare l'API File Handling? Il tuo supporto pubblico aiuta il team di Chrome a dare la priorità alle funzionalità e mostra ad altri fornitori di browser quanto sia fondamentale supportarle.

• Condividi il modo in cui prevedi di utilizzarlo nel thread di discussione WICG.
• Invia un tweet a @ChromiumDev utilizzando l'hashtag #FileHandling e facci sapere dove e come lo utilizzi.

Link utili

• Spiegazione pubblica
• Demo dell'API File Handling | Origine della demo dell'API File Handling
• Bug di monitoraggio di Chromium
• Voce di ChromeStatus.com
• Componente Blink: UI>Browser>WebAppInstalls>FileHandling
• TAG Review
• Mozilla Standards Position

Ringraziamenti

L'API File Handling è stata specificata da Eric Willigers, Jay Harris e Raymes Khoury. Questo articolo è stato rivisto da Joe Medley.