Faça com que os aplicativos da web instalados se tornem gerenciadores de arquivos

Agora que os aplicativos da web são capazes de ler e gravar arquivos , a próxima etapa lógica é permitir que os desenvolvedores declarem esses mesmos aplicativos da web como gerenciadores de arquivos para os arquivos que seus aplicativos podem criar e processar. A API de gerenciamento de arquivos permite que você faça exatamente isso. Depois de registrar um aplicativo de editor de texto como um gerenciador de arquivos e depois de instalá-lo, você pode clicar com o botão direito em um arquivo .txt no macOS e selecionar "Obter informações" para instruir o sistema operacional de que ele deve sempre abrir arquivos .txt com este aplicativo como padrão .

# Casos de uso sugeridos para a API de gerenciamento de arquivos

Exemplos de sites que podem usar essa API incluem:

• Aplicativos de escritório como editores de texto, aplicativos de planilhas e criadores de apresentações de slides.
• Editores gráficos e ferramentas de desenho.
• Ferramentas de edição de níveis de videogames.

# Como usar a API de gerenciamento de arquivos

# Ativando via about: // flags

Para testar a API de gerenciamento de arquivos localmente, sem um token de teste de origem, habilite o sinalizador #file-handling-api em about://flags .

# Aprimoramento progressivo

A API de gerenciamento de arquivos por si só não permite polyfill. A funcionalidade de abrir arquivos com um aplicativo da web, no entanto, pode ser obtida por dois outros meios:

• A API de destino de compartilhamento da web permite que os desenvolvedores especifiquem seu aplicativo como um destino de compartilhamento para que os arquivos possam ser abertos a partir da planilha de compartilhamento do sistema operacional.
• A API de acesso ao sistema de arquivos pode ser integrada à função de arrastar e soltar arquivos, para que os desenvolvedores possam processar arquivos soltos no aplicativo já aberto.

# Detecção de recursos

Para verificar se a API gerenciamento de arquivos é compatível, use:

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

# A parte declarativa da API de gerenciamento de arquivos

Como uma primeira etapa, os aplicativos da web precisam descrever declarativamente em seu manifesto do aplicativo da web que tipo de arquivos eles podem gerenciar. A API de gerenciamento de arquivos estende o manifesto do aplicativo da web com uma nova propriedade chamada "file_handlers" que aceita uma matriz de, bem, gerenciadores de arquivo. Um gerenciador de arquivo é um objeto com duas propriedades:

• Uma propriedade "action" que aponta para um URL dentro do escopo do aplicativo como seu valor.
• Uma propriedade "accept" com um objeto de tipo MIME como chaves e listas de extensões de arquivo como seus valores.
• Uma propriedade "icons" com uma matriz de ícones ImageResource. Alguns sistemas operacionais permitem que uma associação de tipo de arquivo exiba um ícone que não é apenas o ícone do aplicativo associado, mas um ícone especial relacionado ao uso desse tipo de arquivo com o aplicativo.

O exemplo abaixo, mostrando apenas o trecho relevante do manifesto do aplicativo da web, deve deixar isso mais claro:

{
  "file_handlers": [
    {
      "action": "/open-csv",
      "accept": {
        "text/csv": [".csv"]
      },
      "icons": [
        {
          "src": "csv-icon.png",
          "sizes": "256x256",
          "type": "image/png"
        }
      ]
    },
    {
      "action": "/open-svg",
      "accept": {
        "image/svg+xml": ".svg"
      },
      "icons": [
        {
          "src": "svg-icon.png",
          "sizes": "256x256",
          "type": "image/png"
        }
      ]
    },
    {
      "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"
        }
      ]
    }
  ]
}

Isso é para um aplicativo hipotético que processa arquivos .csv de valores separados por vírgula em /open-csv , arquivos de gráficos vetoriais escaláveis ( .svg em /open-svg e um formato de arquivo Grafr inventado com .grafr , .graf ou .graph como a extensão em /open-graf .

# A parte fundamental da API de gerenciamento de arquivos

Agora que o aplicativo declarou quais arquivos ele pode teoricamente gerenciar em qual URL em escopo, ele precisa imperativamente fazer algo com os arquivos de entrada na prática. É aqui que o launchQueue entra em ação. Para acessar os arquivos iniciados, um site precisa especificar um consumidor para o objeto window.launchQueue. Os lançamentos são enfileirados até serem tratados pelo consumidor especificado, que é chamado exatamente uma vez para cada lançamento. Dessa forma, todo lançamento é realizado, independentemente de quando o consumidor foi especificado.

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

# Suporte para DevTools

Não havia suporte para DevTools no momento em que este artigo foi redigido, mas preenchi uma solicitação de recurso para que o suporte seja adicionado.

# Demo

Adicionei suporte para o gerenciamento de arquivos ao Excalidraw , um aplicativo de desenho ao estilo cartoon. Para testá-lo, primeiro você precisa instalar o Excalidraw. Ao criar um arquivo com ele e armazená-lo em algum lugar do sistema de arquivos, você pode abrir o arquivo com um clique duplo ou com o botão direito e selecionar "Excalidraw" no menu de contexto. Você pode verificar a implementação no código-fonte.

.

# Segurança

A equipe do Chrome projetou e implementou a API de gerenciamento de arquivos usando os princípios básicos definidos em Controle de acesso a recursos poderosos da plataforma da Web , incluindo controle do usuário, transparência e ergonomia.

# Permissões, persistência de permissões e atualizações do gerenciador de arquivos

Para garantir a confiança do usuário e a segurança dos seus arquivos quando a API gerenciador de arquivos é usada para abrir um arquivo, um prompt de permissão será exibido antes que um PWA possa visualizar um arquivo. Este prompt de permissão será exibido logo após o usuário selecionar o PWA para abrir um arquivo, de forma que a permissão seja rigorosamente associada à ação de abrir um arquivo usando o PWA, tornando-o mais compreensível e relevante.

Essa permissão será exibida toda vez, até que o usuário clique em Permitir ou Bloquear o gerenciamento de arquivos para o site ou ignorar o prompt três vezes (após o qual o Chromium embargará e bloqueará essa permissão). A configuração selecionada será mantida com o fechamento e reabertura do PWA.

Quando atualizações e mudanças de manifesto na seção "file_handlers" forem detectadas, as permissões serão redefinidas.

# Desafios relacionados a arquivos

Há uma grande categoria de vetores de ataque que se abrem ao permitir que sites acessem arquivos. Eles são descritos no artigo sobre API de acesso ao sistema de arquivos . O recurso adicional relacionado à segurança que a API de gerenciamento de arquivos proporciona para a API de acesso ao sistema de arquivos é a capacidade de conceder acesso a determinados arquivos por meio da IU integrada do sistema operacional, em vez de por meio de um seletor de arquivos exibido por um aplicativo da web.

Ainda existe o risco de que os usuários possam conceder acidentalmente o acesso a um aplicativo da Web para um arquivo, ao abri-lo. No entanto, geralmente se entende que a abertura de um arquivo permite que o aplicativo com o qual foi aberto leia e / ou gerencie esse arquivo. Portanto, a escolha explícita do usuário de abrir um arquivo em um aplicativo instalado, como por meio de um menu de contexto "Abrir com …", pode ser lida como um sinal suficiente de confiança no aplicativo.

# Desafios do gerenciador padrão

A exceção é quando não há aplicativos no sistema anfitrião para um determinado tipo de arquivo. Nesse caso, alguns sistemas operacionais anfitriões podem promover automaticamente o gerenciador recém registrado para gerenciador padrão para esse tipo de arquivo, de forma silenciosa e sem nenhuma intervenção do usuário. Isso significa que, se o usuário clicar duas vezes em um arquivo desse tipo, ele será aberto automaticamente no aplicativo da web registrado. Em tais sistemas operacionais anfitriões, quando o agente do usuário determina que não há um gerenciador padrão existente para o tipo de arquivo, um prompt de permissão explícito pode ser necessário a fim de evitar o envio acidental do conteúdo de um arquivo para um aplicativo da web sem o consentimento do usuário.

# Controle do usuário

A especificação afirma que os navegadores não devem registrar todos os sites que podem gerenciar arquivos como um gerenciador. Em vez disso, o registro de gerenciamento de arquivo deve ser bloqueado por trás da instalação e nunca acontecer sem a confirmação explícita do usuário, especialmente caso um site se torne o gerenciador padrão. Em vez de sequestrar extensões existentes como .json para as quais o usuário provavelmente já tem um gerenciador padrão registrado, os sites devem considerar a criação de suas próprias extensões.

# Transparência

Todos os sistemas operacionais permitem que os usuários alterem as associações de arquivos presentes. Isso está fora do escopo do navegador.

# Feedback

A equipe do Chrome deseja saber mais sobre suas experiências com a API gerenciamento de arquivos.

# Conte-nos sobre o design da API

Existe algo na API que não funciona como você esperava? Ou faltam métodos ou propriedades de que você precisa para implementar sua ideia? Você tem uma pergunta ou comentário sobre o modelo de segurança?

• Registre um problema de especificação no repositório GitHub correspondente ou acrescente suas ideias a um problema existente.

# Comunicar um problema com a implementação

Você encontrou um bug com a implementação do Chrome? Ou a implementação é diferente da especificação?

• Registre um bug em new.crbug.com. Inclua o máximo de detalhes que puder, instruções simples para reprodução e insira UI>Browser>WebAppInstalls>FileHandling na caixa Componentes. Glitch funciona muito bem para compartilhar reproduções rápidas e fáceis.

# Mostre suporte para a API

Você pretende usar a API de gerenciamento de arquivos? Seu suporte público ajuda a equipe do Chrome a priorizar os recursos e mostra a outros fornecedores de navegadores como é fundamental apoiá-los.

• Compartilhe como você planeja usá-lo no tópico de WICG Discourse.
• Envie um tweet para @ChromiumDev usando a hashtag #FileHandling e diga-nos onde e como você está usando-a.

# Links úteis

• Explicador público
• Demonstração da API de gerenciamento de arquivos | Fonte de demonstração da API de gerenciamento de arquivos
• Bug de rastreamento do Chromium
• Entrada ChromeStatus.com
• Componente Blink: UI>Browser>WebAppInstalls>FileHandling
• Revisão de TAG
• Posição dos padrões da Mozilla

# Reconhecimentos

A API de gerenciamento de arquivos foi especificada por Eric Willigers , Jay Harris e Raymes Khoury . Este artigo foi revisado por Joe Medley .