Permettre aux applications Web installées de devenir gestionnaires de fichiers

Enregistrez une application en tant que gestionnaire de fichiers auprès du système d'exploitation.

Thomas Steiner

Maintenant que les applications Web sont capables de lire et d'écrire des fichiers, la prochaine étape logique consiste à laisser les développeurs déclarer ces applications Web comme gestionnaires de fichiers pour les fichiers que leurs applications peuvent créer et traiter. C'est exactement ce que vous permet l'API File Handling Après avoir enregistré une application d'éditeur de texte en tant que gestionnaire de fichiers et après l'avoir installée, vous pouvez effectuer un clic droit sur un fichier .txt sous macOS, puis sélectionner "Obtenir des informations" pour indiquer au système d'exploitation qu'il doit toujours ouvrir les fichiers .txt avec cette application par défaut.

Cas d'utilisation suggérés pour l'API File Handling

Voici quelques exemples de sites qui peuvent utiliser cette API:

• Applications bureautiques telles que les éditeurs de texte, les tableurs et les outils de création de diaporamas
• Éditeurs graphiques et outils de dessin
• Outils d'édition de niveaux de jeux vidéo.

Utiliser l'API File Handling

Amélioration progressive

L'API File Handling ne peut pas être polyfilled. Toutefois, la fonctionnalité d'ouverture de fichiers avec une application Web peut être obtenue grâce à deux autres moyens:

• L'API Web Share Target permet aux développeurs de spécifier leur application comme cible de partage afin que les fichiers puissent être ouverts depuis la feuille de partage du système d'exploitation.
• L'API File System Access peut être intégrée au glisser-déposer de fichiers afin que les développeurs puissent gérer les fichiers déposés dans l'application déjà ouverte.

Prise en charge des navigateurs

Détection de fonctionnalités

Pour vérifier si l'API File Handling est prise en charge, utilisez:

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

La partie déclarative de l'API File Handling

Dans un premier temps, les applications Web doivent décrire de manière déclarative dans leur fichier manifeste d'application Web le type de fichiers qu'elles peuvent gérer. L'API File Handling étend le fichier manifeste de l'application Web avec une nouvelle propriété appelée "file_handlers", qui accepte un tableau de gestionnaires de fichiers. Un gestionnaire de fichiers est un objet avec les propriétés suivantes:

• Une propriété "action" qui pointe vers une URL comprise dans le champ d'application de l'application comme valeur.
• Propriété "accept" avec un objet de types MIME comme clés et des listes d'extensions de fichier comme valeurs.
• Une propriété "icons" avec un tableau d'icônes ImageResource. Certains systèmes d'exploitation permettent d'afficher une icône associée à un type de fichier qui n'est pas seulement l'icône de l'application associée, mais plutôt une icône spéciale liée à l'utilisation de ce type de fichier avec l'application.
• Propriété "launch_type" qui définit si plusieurs fichiers doivent être ouverts dans un seul client ou dans plusieurs clients. La valeur par défaut est "single-client". Si l'utilisateur ouvre plusieurs fichiers et si le gestionnaire de fichiers a été annoté avec "multiple-clients" comme "launch_type", plusieurs lancements d'applications se produiront. Pour chaque lancement, le tableau LaunchParams.files (voir plus loin) ne contiendra qu'un seul élément.

L'exemple ci-dessous, qui n'affiche que l'extrait pertinent du fichier manifeste de l'application Web, devrait le rendre plus clair:

{
  "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"
    }
  ]
}

Il s'agit d'une application hypothétique qui gère des fichiers de valeurs séparées par des virgules (.csv) dans /open-csv, des fichiers de graphiques vectoriels évolutifs (.svg) dans /open-svg et un format de fichier Grafr inventé avec .grafr, .graf ou .graph comme extension à /open-graf. Les deux premiers s'ouvrent dans un seul client, le dernier dans plusieurs clients si plusieurs fichiers sont gérés.

Partie impérative de l'API File Handling

Maintenant que l'application a déclaré les fichiers qu'elle peut gérer à quelle URL de portée en théorie, elle doit impérativement faire quelque chose avec les fichiers entrants en pratique. C'est là que launchQueue entre en jeu. Pour accéder aux fichiers lancés, un site doit spécifier un consommateur pour l'objet window.launchQueue. Les lancements sont mis en file d'attente jusqu'à ce qu'ils soient gérés par le client spécifié, qui est appelé exactement une fois pour chaque lancement. De cette manière, chaque lancement est géré, quel que soit le moment où le consommateur a été spécifié.

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.
    }
  });
}

Compatibilité avec les outils de développement

Les DevTools ne sont pas compatibles pour le moment, mais j'ai envoyé une demande de fonctionnalité pour que cette compatibilité soit ajoutée.

Démo

J'ai ajouté la prise en charge de la gestion des fichiers à Excalidraw, une application de dessin de style cartoon. Pour le tester, vous devez d'abord installer Excalidraw. Lorsque vous créez un fichier avec celui-ci et le stockez quelque part dans votre système de fichiers, vous pouvez l'ouvrir en double-cliquant dessus ou en effectuant un clic droit, puis en sélectionnant "Excalidraw" dans le menu contextuel. Vous pouvez examiner l'implémentation dans le code source.

Sécurité

L'équipe Chrome a conçu et implémenté l'API File Handling en suivant les principes de base définis dans Controlling Access to Powerful Web Platform Features (Contrôler l'accès aux fonctionnalités puissantes de la plate-forme Web), y compris le contrôle utilisateur, la transparence et l'ergonomie.

Autorisations, persistance des autorisations et mises à jour du gestionnaire de fichiers

Pour garantir la confiance des utilisateurs et la sécurité de leurs fichiers, lorsqu'une PWA ouvre un fichier, une invite d'autorisation s'affiche avant que la PWA puisse afficher le fichier. Cette invite d'autorisation s'affiche immédiatement après que l'utilisateur a sélectionné la PWA pour ouvrir un fichier. L'autorisation est ainsi étroitement associée à l'action d'ouverture d'un fichier à l'aide de la PWA, ce qui la rend plus claire et pertinente.

Cette autorisation s'affiche à chaque fois que l'utilisateur clique sur Autoriser ou Bloquer la gestion des fichiers pour le site, ou qu'il ignore l'invite trois fois (après lequel Chromium embargo et bloque cette autorisation). Le paramètre sélectionné sera conservé même après la fermeture et la réouverture de la PWA.

Lorsque le fichier manifeste est mis à jour et que des modifications sont détectées dans la section "file_handlers", les autorisations sont réinitialisées.

Problèmes liés aux fichiers

Une grande catégorie de vecteurs d'attaque s'ouvre en autorisant les sites Web à accéder aux fichiers. Ces éléments sont décrits dans l'article sur l'API File System Access. La fonctionnalité supplémentaire liée à la sécurité que l'API File Handling fournit par rapport à l'API File System Access est la possibilité d'accorder l'accès à certains fichiers via l'interface utilisateur intégrée du système d'exploitation, plutôt que via un sélecteur de fichiers affiché par une application Web.

Il existe toujours un risque que les utilisateurs accordent involontairement à une application Web l'accès à un fichier en l'ouvrant. Toutefois, il est généralement admis que l'ouverture d'un fichier permet à l'application avec laquelle il est ouvert de le lire et/ou de le manipuler. Par conséquent, le choix explicite d'un utilisateur d'ouvrir un fichier dans une application installée, par exemple via un menu contextuel "Ouvrir avec…", peut être interprété comme un signal de confiance suffisant dans l'application.

Défis liés au gestionnaire par défaut

L'exception est que le système hôte ne contient aucune application pour un type de fichier donné. Dans ce cas, certains systèmes d'exploitation hôtes peuvent promouvoir automatiquement le gestionnaire nouvellement enregistré en tant que gestionnaire par défaut pour ce type de fichier, en mode silencieux et sans aucune intervention de l'utilisateur. Cela signifie que si l'utilisateur double-clique sur un fichier de ce type, il s'ouvre automatiquement dans l'application Web enregistrée. Sur ces systèmes d'exploitation hôtes, lorsque l'agent utilisateur détermine qu'il n'existe pas de gestionnaire par défaut pour le type de fichier, une invite d'autorisation explicite peut être nécessaire pour éviter d'envoyer accidentellement le contenu d'un fichier à une application Web sans l'autorisation de l'utilisateur.

Contrôle des utilisateurs

La spécification indique que les navigateurs ne doivent pas enregistrer chaque site pouvant gérer des fichiers en tant que gestionnaire de fichiers. Au lieu de cela, l'enregistrement de la gestion des fichiers doit être limité à l'installation et ne jamais se produire sans confirmation explicite de l'utilisateur, en particulier si un site doit devenir le gestionnaire par défaut. Plutôt que de pirater des extensions existantes comme .json pour lesquelles l'utilisateur a probablement déjà enregistré un gestionnaire par défaut, les sites doivent envisager de créer leurs propres extensions.

Transparence

Tous les systèmes d'exploitation permettent aux utilisateurs de modifier les associations de fichiers actuelles. Cela n'entre pas dans le champ d'application du navigateur.

Commentaires

L'équipe Chrome souhaite en savoir plus sur votre expérience avec l'API File Handling

Parlez-nous de la conception de l'API

L'API ne fonctionne-t-elle pas comme prévu ? Ou manque-t-il des méthodes ou des propriétés dont vous avez besoin pour implémenter votre idée ? Vous avez une question ou un commentaire sur le modèle de sécurité ?

• Signalez un problème de spécification dans le dépôt GitHub correspondant ou ajoutez vos commentaires à un problème existant.

Signaler un problème d'implémentation

Avez-vous trouvé un bug dans l'implémentation de Chrome ? Ou l'implémentation est-elle différente de la spécification ?

• Envoyez un bug sur new.crbug.com. Veillez à inclure autant de détails que possible, des instructions simples pour reproduire le problème et saisissez UI>Browser>WebAppInstalls>FileHandling dans le champ Composants. Glitch est idéal pour partager des reproductions rapidement et facilement.

Afficher la compatibilité avec l'API

Prévoyez-vous d'utiliser l'API File Handling ? Votre soutien public aide l'équipe Chrome à hiérarchiser les fonctionnalités et montre aux autres fournisseurs de navigateurs à quel point il est essentiel de les prendre en charge.

• Expliquez comment vous prévoyez de l'utiliser dans le fil de discussion Discourse de la WICM.
• Envoyez un tweet à @ChromiumDev en utilisant le hashtag #FileHandling et indiquez-nous où et comment vous l'utilisez.

Liens utiles

• Explication publique
• Démonstration de l'API File Handling | Source de la démonstration de l'API File Handling
• Bug de suivi Chromium
• Enregistrement sur ChromeStatus.com
• Composant clignotement : UI>Browser>WebAppInstalls>FileHandling
• Examen du TAG
• Position de Mozilla sur les normes

Remerciements

L'API File Handling a été spécifiée par Eric Willigers, Jay Harris et Raymes Khoury. Cet article a été relu par Joe Medley.