A API File System Access permite que os apps da Web leiam ou salvem alterações diretamente em arquivos e pastas no dispositivo do usuário.
O que é a API File System Access?
A API File System Access permite aos desenvolvedores criar apps da Web avançados que interagem com arquivos no dispositivo local do usuário, como ambientes de desenvolvimento integrado, editores de fotos e vídeos, de texto e muito mais. Depois um usuário concede acesso a um aplicativo da web, essa API permite que ele leia ou salve alterações diretamente em arquivos e pastas no dispositivo do usuário. Além de ler e gravar arquivos, a API File System Access oferece abrir um diretório e enumerar o conteúdo dele.
Se você já trabalhou com leitura e gravação de arquivos, muito do que vou compartilhar será familiares. Recomendo que você a leia mesmo assim, porque nem todos os sistemas são iguais.
A API File System Access é compatível com a maioria dos navegadores Chromium Windows, macOS, ChromeOS e Linux. Uma exceção notável é o Brave, que é disponível atualmente apenas atrás de uma sinalização. Estamos trabalhando no suporte para Android no contexto de crbug.com/1011535.
Como usar a API File System Access
Para mostrar a capacidade e a utilidade da API File System Access, criei um único arquivo text editor. Ele permite abrir e editar um arquivo de texto, salvar as alterações novamente no disco ou um novo arquivo e salvar as alterações no disco. Não é nada sofisticado, mas fornece o suficiente para ajudar você entender os conceitos.
Suporte ao navegador
Detecção de recursos
Para descobrir se a API File System Access é compatível, confira se o método do seletor em que você tem interesse.
if ('showOpenFilePicker' in self) {
// The `showOpenFilePicker()` method of the File System Access API is supported.
}
Testar
Confira a API File System Access em ação no demonstração do editor de texto.
Ler um arquivo do sistema de arquivos local
O primeiro caso de uso que quero resolver é pedir que o usuário escolha um arquivo, abra e leia esse arquivo. do arquivo do disco.
Pedir que o usuário escolha um arquivo para ler
O ponto de entrada para a API File System Access é
window.showOpenFilePicker()
Quando chamado, mostra uma caixa de diálogo de seletor de arquivos,
e solicita que o usuário selecione um arquivo. Depois de selecionarem um arquivo, a API retorna uma matriz de arquivos
alças Um parâmetro options
opcional permite influenciar o comportamento do seletor de arquivos, para
exemplo, permitindo que o usuário selecione vários arquivos, diretórios ou diferentes tipos de arquivos.
Sem opções especificadas, o seletor de arquivos permite que o usuário escolha um único arquivo. Isso é
perfeito para um editor de texto.
Como muitas outras APIs poderosas, chamar showOpenFilePicker()
deve ser feito de forma segura
context (em inglês) e precisa ser chamado de dentro de um gesto do usuário.
let fileHandle;
butOpenFile.addEventListener('click', async () => {
// Destructure the one-element array.
[fileHandle] = await window.showOpenFilePicker();
// Do something with the file handle.
});
Depois que o usuário seleciona um arquivo, showOpenFilePicker()
retorna uma matriz de identificadores. Nesse caso, um
matriz de um elemento com uma FileSystemFileHandle
que contém as propriedades e
métodos necessários para interagir com o arquivo.
É útil manter uma referência ao identificador do arquivo para que ele possa ser usado mais tarde. Será necessárias para salvar alterações no arquivo ou para executar qualquer outra operação de arquivo.
Ler um arquivo do sistema de arquivos
Agora que você tem um identificador para um arquivo, pode acessar as propriedades dele ou acessá-lo.
Por enquanto, vou ler o conteúdo dela. Chamar handle.getFile()
retorna um File
que contém um blob. Para obter os dados do blob, chame um dos re
métodos, (slice()
,
stream()
,
text()
ou
arrayBuffer()
).
const file = await fileHandle.getFile();
const contents = await file.text();
O objeto File
retornado por FileSystemFileHandle.getFile()
só pode ser lido se o
o arquivo subjacente em disco não mudou. Se o arquivo no disco for modificado, o objeto File
se tornará
ilegível, e você terá que chamar getFile()
novamente para obter um novo objeto File
e ler o
dados.
Como tudo funciona em conjunto
Quando os usuários clicam no botão Abrir, o navegador mostra um seletor de arquivos. Depois de selecionar um arquivo, a
O app lê o conteúdo e o coloca em uma <textarea>
.
let fileHandle;
butOpenFile.addEventListener('click', async () => {
[fileHandle] = await window.showOpenFilePicker();
const file = await fileHandle.getFile();
const contents = await file.text();
textArea.value = contents;
});
Gravar o arquivo no sistema de arquivos local
No editor de texto, há duas maneiras de salvar um arquivo: Salvar e Salvar como. Salvar grava as alterações de volta no arquivo original usando o identificador de arquivo recuperado anteriormente. Mas Salvar As cria um novo arquivo e, portanto, exige um novo identificador de arquivo.
Criar um novo arquivo
Para salvar um arquivo, chame showSaveFilePicker()
, que mostra o seletor de arquivos
em "salvar" permitindo que o usuário escolha um novo arquivo para salvar. Para o texto
eu também queria que ele adicionasse automaticamente uma extensão .txt
. Por isso, forneci algumas
parâmetros.
async function getNewFileHandle() {
const options = {
types: [
{
description: 'Text Files',
accept: {
'text/plain': ['.txt'],
},
},
],
};
const handle = await window.showSaveFilePicker(options);
return handle;
}
Salvar alterações no disco
Você pode encontrar todo o código para salvar mudanças em um arquivo na demonstração do editor de texto em
GitHub: As principais interações do sistema de arquivos estão em
fs-helpers.js
De forma mais simples, o processo se parece com o código a seguir.
Vou explicar cada etapa.
// fileHandle is an instance of FileSystemFileHandle..
async function writeFile(fileHandle, contents) {
// Create a FileSystemWritableFileStream to write to.
const writable = await fileHandle.createWritable();
// Write the contents of the file to the stream.
await writable.write(contents);
// Close the file and write the contents to disk.
await writable.close();
}
A gravação de dados no disco usa um objeto FileSystemWritableFileStream
, uma subclasse.
de WritableStream
. Crie o stream chamando createWritable()
no arquivo
identificador do objeto. Quando createWritable()
é chamado, o navegador verifica primeiro se o usuário concedeu
gravação no arquivo. Se a permissão para gravar não tiver sido concedida, o navegador solicitará
o usuário para conseguir a permissão. Se a permissão não for concedida, createWritable()
vai gerar uma
DOMException
. O app não poderá gravar no arquivo. No editor de texto, a
Os objetos DOMException
são processados no método saveFile()
.
O método write()
usa uma string, que é necessária para um editor de texto. Mas também pode demorar
um BufferSource ou Blob. Por exemplo, é possível canalizar um stream diretamente para
ele:
async function writeURLToFile(fileHandle, url) {
// Create a FileSystemWritableFileStream to write to.
const writable = await fileHandle.createWritable();
// Make an HTTP request for the contents.
const response = await fetch(url);
// Stream the response into the file.
await response.body.pipeTo(writable);
// pipeTo() closes the destination pipe by default, no need to close it.
}
Também é possível usar seek()
ou truncate()
no stream para atualizar o
em uma posição específica ou redimensione o arquivo.
Especificar um nome de arquivo sugerido e o diretório inicial
Em muitos casos, você pode querer que o aplicativo sugira um nome de arquivo ou local padrão. Por exemplo, um texto
o editor pode sugerir um nome de arquivo padrão de Untitled Text.txt
em vez de Untitled
. Você
pode fazer isso transmitindo uma propriedade suggestedName
como parte das opções showSaveFilePicker
.
const fileHandle = await self.showSaveFilePicker({
suggestedName: 'Untitled Text.txt',
types: [{
description: 'Text documents',
accept: {
'text/plain': ['.txt'],
},
}],
});
O mesmo vale para o diretório inicial padrão. Se você está criando um editor de texto, pode ser útil
inicie a caixa de diálogo para salvar ou abrir o arquivo na pasta documents
padrão, enquanto que, no caso de imagens
editor, comece na pasta pictures
padrão. É possível sugerir um início padrão
transmitindo uma propriedade startIn
para o showSaveFilePicker
, showDirectoryPicker()
ou
showOpenFilePicker
dessa forma.
const fileHandle = await self.showOpenFilePicker({
startIn: 'pictures'
});
Esta é a lista dos diretórios de sistema mais conhecidos:
desktop
: o diretório da área de trabalho do usuário, se houver.documents
: diretório em que os documentos criados pelo usuário normalmente são armazenados.downloads
: diretório onde os arquivos transferidos por download normalmente seriam armazenados.music
: diretório onde os arquivos de áudio normalmente seriam armazenados.pictures
: diretório onde fotos e outras imagens estáticas normalmente são armazenadas.videos
: diretório onde vídeos ou filmes normalmente seriam armazenados.
Além dos diretórios do sistema conhecidos, você também pode passar um identificador de arquivo ou diretório existente como
Um valor para startIn
A caixa de diálogo será aberta no mesmo diretório.
// Assume `directoryHandle` is a handle to a previously opened directory.
const fileHandle = await self.showOpenFilePicker({
startIn: directoryHandle
});
Especificar a finalidade de diferentes seletores de arquivos
Às vezes, os aplicativos têm seletores diferentes para diferentes finalidades. Por exemplo, um rich text
O editor pode permitir que o usuário abra arquivos de texto, mas também importe imagens. Por padrão, cada arquivo
o seletor abriria no último local lembrado. É possível contornar isso armazenando valores id
para cada tipo de seletor. Se um id
for especificado, a implementação do seletor de arquivos vai lembrar uma
separado da última vez em que foi usado para esse id
.
const fileHandle1 = await self.showSaveFilePicker({
id: 'openText',
});
const fileHandle2 = await self.showSaveFilePicker({
id: 'importImage',
});
Armazenar identificadores de arquivos ou diretórios no IndexedDB
Os manipuladores de arquivos e de diretório são serializáveis, o que significa que é possível salvar um arquivo ou
identificador de diretório para IndexedDB ou chame postMessage()
para enviá-los entre os mesmos
origem.
Salvar identificadores de arquivo ou diretório no IndexedDB significa que você pode armazenar o estado, ou lembrar quais arquivos ou diretórios em que o usuário estava trabalhando. Com isso, é possível manter uma lista de arquivos editados, oferecer a opção de reabrir o último arquivo quando o app for aberto, restaurar o funcionamento anterior e muito mais. No editor de texto, armazeno uma lista dos cinco arquivos mais recentes que o usuário aberto, possibilitando o acesso aos arquivos novamente.
O exemplo de código a seguir mostra como armazenar e recuperar um identificador de arquivo e um identificador de diretório. Você pode veja isso em ação no Glitch. (Eu uso a biblioteca idb-keyval para simplificar.
import { get, set } from 'https://unpkg.com/idb-keyval@5.0.2/dist/esm/index.js';
const pre1 = document.querySelector('pre.file');
const pre2 = document.querySelector('pre.directory');
const button1 = document.querySelector('button.file');
const button2 = document.querySelector('button.directory');
// File handle
button1.addEventListener('click', async () => {
try {
const fileHandleOrUndefined = await get('file');
if (fileHandleOrUndefined) {
pre1.textContent = `Retrieved file handle "${fileHandleOrUndefined.name}" from IndexedDB.`;
return;
}
const [fileHandle] = await window.showOpenFilePicker();
await set('file', fileHandle);
pre1.textContent = `Stored file handle for "${fileHandle.name}" in IndexedDB.`;
} catch (error) {
alert(error.name, error.message);
}
});
// Directory handle
button2.addEventListener('click', async () => {
try {
const directoryHandleOrUndefined = await get('directory');
if (directoryHandleOrUndefined) {
pre2.textContent = `Retrieved directroy handle "${directoryHandleOrUndefined.name}" from IndexedDB.`;
return;
}
const directoryHandle = await window.showDirectoryPicker();
await set('directory', directoryHandle);
pre2.textContent = `Stored directory handle for "${directoryHandle.name}" in IndexedDB.`;
} catch (error) {
alert(error.name, error.message);
}
});
Permissões e identificadores de arquivos ou diretórios armazenados
Como as permissões nem sempre são mantidas entre as sessões, você precisa verificar se o usuário
concedeu permissão ao arquivo ou diretório usando queryPermission()
. Caso contrário, ligue para
requestPermission()
para solicitá-la novamente. Isso funciona da mesma forma para identificadores de arquivos e diretórios. Você
executar fileOrDirectoryHandle.requestPermission(descriptor)
ou
fileOrDirectoryHandle.queryPermission(descriptor)
, respectivamente.
No editor de texto, criei um método verifyPermission()
que verifica se o usuário já
concedido e, se necessário, faz a solicitação.
async function verifyPermission(fileHandle, readWrite) {
const options = {};
if (readWrite) {
options.mode = 'readwrite';
}
// Check if permission was already granted. If so, return true.
if ((await fileHandle.queryPermission(options)) === 'granted') {
return true;
}
// Request permission. If the user grants permission, return true.
if ((await fileHandle.requestPermission(options)) === 'granted') {
return true;
}
// The user didn't grant permission, so return false.
return false;
}
Ao solicitar a permissão de gravação com a solicitação de leitura, o número de solicitações de permissão foi reduzido. o usuário vê uma solicitação ao abrir o arquivo e concede permissão para leitura e gravação.
Como abrir um diretório e enumerar o conteúdo
Para enumerar todos os arquivos em um diretório, chame showDirectoryPicker()
. O usuário
seleciona um diretório em um seletor. Depois disso, um FileSystemDirectoryHandle
é
retornado, o que permite enumerar e acessar os arquivos do diretório. Por padrão, o nível de leitura
acesso aos arquivos no diretório, mas se precisar de acesso de gravação, você poderá passar
{ mode: 'readwrite' }
ao método.
butDir.addEventListener('click', async () => {
const dirHandle = await window.showDirectoryPicker();
for await (const entry of dirHandle.values()) {
console.log(entry.kind, entry.name);
}
});
Se você também precisar acessar cada arquivo usando getFile()
para, por exemplo, recuperar o nome
tamanhos de arquivo diferentes, não use await
em cada resultado sequencialmente, mas processe todos os arquivos de
paralelo, por exemplo, usando Promise.all()
.
butDir.addEventListener('click', async () => {
const dirHandle = await window.showDirectoryPicker();
const promises = [];
for await (const entry of dirHandle.values()) {
if (entry.kind !== 'file') {
continue;
}
promises.push(entry.getFile().then((file) => `${file.name} (${file.size})`));
}
console.log(await Promise.all(promises));
});
Criar ou acessar arquivos e pastas em um diretório
Em um diretório, você pode criar ou acessar arquivos e pastas usando o
getFileHandle()
ou getDirectoryHandle()
, respectivamente.
. Ao transmitir um objeto options
opcional com uma chave de create
e um valor booleano de
true
ou false
, é possível determinar se um novo arquivo ou pasta precisa ser criado, caso não exista.
// In an existing directory, create a new directory named "My Documents".
const newDirectoryHandle = await existingDirectoryHandle.getDirectoryHandle('My Documents', {
create: true,
});
// In this new directory, create a file named "My Notes.txt".
const newFileHandle = await newDirectoryHandle.getFileHandle('My Notes.txt', { create: true });
Como resolver o caminho de um item em um diretório
Ao trabalhar com arquivos ou pastas em um diretório, pode ser útil resolver o caminho do item
em questão. Isso pode ser feito com o método resolve()
nomeado corretamente. Para a resolução, o
item pode ser um filho direto ou indireto do diretório.
// Resolve the path of the previously created file called "My Notes.txt".
const path = await newDirectoryHandle.resolve(newFileHandle);
// `path` is now ["My Documents", "My Notes.txt"]
Exclusão de arquivos e pastas de um diretório
Se você obteve acesso a um diretório, pode excluir os arquivos e pastas contidos com a
método removeEntry()
. Para pastas, a exclusão pode ser recursiva e incluir
todas as subpastas e os arquivos contidos nelas.
// Delete a file.
await directoryHandle.removeEntry('Abandoned Projects.txt');
// Recursively delete a folder.
await directoryHandle.removeEntry('Old Stuff', { recursive: true });
Exclusão direta de um arquivo ou uma pasta
Se você tiver acesso a um identificador de arquivo ou diretório, chame remove()
em um FileSystemFileHandle
ou
FileSystemDirectoryHandle
para removê-lo.
// Delete a file.
await fileHandle.remove();
// Delete a directory.
await directoryHandle.remove();
Renomear e mover arquivos e pastas
É possível renomear ou mover arquivos e pastas para um novo local chamando move()
no
FileSystemHandle
. FileSystemHandle
tem as interfaces filhas FileSystemFileHandle
e
FileSystemDirectoryHandle
O método move()
usa um ou dois parâmetros. A primeira pode
ser uma string com o novo nome ou um FileSystemDirectoryHandle
para a pasta de destino. Na
no último caso, o segundo parâmetro opcional é uma string com o novo nome. Assim, a movimentação e a renomeação podem
acontecem em uma única etapa.
// Rename the file.
await file.move('new_name');
// Move the file to a new directory.
await file.move(directory);
// Move the file to a new directory and rename it.
await file.move(directory, 'newer_name');
Integração de arrastar e soltar
A
Interfaces de HTML com arrastar e soltar
permitir que aplicativos da Web aceitem
arquivos arrastados e soltos
em uma página da Web. Durante uma operação de arrastar e soltar, o arquivo e os itens de diretório arrastados são associados
com entradas de arquivo e entradas de diretório, respectivamente. O DataTransferItem.getAsFileSystemHandle()
retorna uma promessa com um objeto FileSystemFileHandle
se o item arrastado for um arquivo e um
com um objeto FileSystemDirectoryHandle
se o item arrastado for um diretório. A listagem a seguir
mostra isso em ação. A interface de arrastar e soltar
DataTransferItem.kind
é
"file"
para arquivos e diretórios, enquanto FileSystemHandle.kind
da API File System Access é
"file"
para arquivos e "directory"
para diretórios.
elem.addEventListener('dragover', (e) => {
// Prevent navigation.
e.preventDefault();
});
elem.addEventListener('drop', async (e) => {
e.preventDefault();
const fileHandlesPromises = [...e.dataTransfer.items]
.filter((item) => item.kind === 'file')
.map((item) => item.getAsFileSystemHandle());
for await (const handle of fileHandlesPromises) {
if (handle.kind === 'directory') {
console.log(`Directory: ${handle.name}`);
} else {
console.log(`File: ${handle.name}`);
}
}
});
Como acessar o sistema de arquivos particular de origem
O sistema de arquivos particular de origem é um endpoint de armazenamento que, como o nome sugere, é particular ao
origem da página. Embora os navegadores normalmente implementem isso mantendo o conteúdo deste
sistema de arquivos particular de origem para o disco em algum lugar, não é pretendido que o conteúdo seja usado
acessíveis. Da mesma forma, não há expectativa de que os arquivos ou diretórios com nomes
nomes de filhos do sistema de arquivos particular de origem. Embora o navegador possa fazer parecer que
internamente, já que o sistema de arquivos é de origem privada, o navegador pode armazenar
esses "arquivos" em um banco de dados ou em qualquer outra estrutura de dados. Basicamente, se você usar essa API,
não espere encontrar os arquivos criados que correspondem um para um em algum lugar do disco rígido. Você pode operar normalmente
o sistema de arquivos particular de origem quando tiver acesso à raiz FileSystemDirectoryHandle
.
const root = await navigator.storage.getDirectory();
// Create a new file handle.
const fileHandle = await root.getFileHandle('Untitled.txt', { create: true });
// Create a new directory handle.
const dirHandle = await root.getDirectoryHandle('New Folder', { create: true });
// Recursively remove a directory.
await root.removeEntry('Old Stuff', { recursive: true });
Acessar arquivos otimizados para desempenho no sistema de arquivos particular de origem
O sistema de arquivos particular de origem oferece acesso opcional a um tipo especial de arquivo altamente
otimizado para desempenho, por exemplo, oferecendo acesso de gravação exclusivo e no local aos arquivos
conteúdo. No Chromium 102 e versões mais recentes, há um método extra no sistema de arquivos particular de origem para
Simplificação do acesso ao arquivo: createSyncAccessHandle()
(para operações síncronas de leitura e gravação).
Ele está exposto em FileSystemFileHandle
, mas exclusivamente em
Web Workers.
// (Read and write operations are synchronous,
// but obtaining the handle is asynchronous.)
// Synchronous access exclusively in Worker contexts.
const accessHandle = await fileHandle.createSyncAccessHandle();
const writtenBytes = accessHandle.write(buffer);
const readBytes = accessHandle.read(buffer, { at: 1 });
Fibra de polietileno
Não é possível aplicar completamente o polyfill aos métodos da API File System Access.
- O método
showOpenFilePicker()
pode ser aproximado com um elemento<input type="file">
. - O método
showSaveFilePicker()
pode ser simulado com um elemento<a download="file_name">
, embora isso acione um download programático e não permita a substituição de arquivos existentes. - O método
showDirectoryPicker()
pode ser emulado de alguma forma com a interface não padrão<input type="file" webkitdirectory>
.
Desenvolvemos uma biblioteca chamada browser-fs-access, que usa os arquivos API System Access sempre que possível e que recorre às próximas melhores opções em todas as outras casos de uso diferentes.
Segurança e permissões
A equipe do Chrome projetou e implementou a API File System Access usando os princípios básicos. definido em Como controlar o acesso a recursos avançados da Web Platform, incluindo controle, transparência e ergonomia do usuário.
Abrir ou salvar um arquivo novo
![Seletor de arquivos para abrir um arquivo para leitura](https://developer.chrome.com/static/docs/capabilities/web-apis/file-system-access/image/file-picker-open-file-8cb5f6783ee89.jpg?authuser=2&hl=pt)
Ao abrir um arquivo, o usuário fornece permissão para ler um arquivo ou diretório usando o seletor de arquivos.
O seletor de arquivo aberto só pode ser mostrado com um gesto do usuário quando veiculado de um ambiente de nuvem seguro
contexto. Se os usuários mudarem de ideia, eles poderão cancelar a seleção no arquivo
seletor e o site não terá acesso a nada. Esse é o mesmo comportamento do
<input type="file">
.
![Seletor de arquivos para salvar um arquivo em disco.](https://developer.chrome.com/static/docs/capabilities/web-apis/file-system-access/image/file-picker-save-file-bd54ae001799a.jpg?authuser=2&hl=pt)
Da mesma forma, quando um app da Web quer salvar um novo arquivo, o navegador mostra o seletor para salvar arquivos, permitindo que o usuário especifique o nome e o local do novo arquivo. Como o usuário está salvando um novo arquivo ao dispositivo (em vez de substituir um arquivo existente), o seletor de arquivos concede ao aplicativo permissão para gravar no arquivo.
Pastas restritas
Para ajudar a proteger os usuários e seus dados, o navegador pode limitar a capacidade do usuário de salvar a determinados pastas, por exemplo, pastas principais do sistema operacional, como Windows, pastas "Biblioteca do macOS". Quando isso acontece, o navegador mostra uma solicitação e pede ao usuário para escolher uma do Compute Engine.
Como modificar um arquivo ou diretório
Um aplicativo da web não pode modificar um arquivo em disco sem obter permissão explícita do usuário.
Comando de permissão
Se uma pessoa quiser salvar alterações em um arquivo ao qual ela concedeu acesso de leitura, o navegador mostra um prompt de permissão, solicitando permissão para o site gravar alterações no disco. A solicitação de permissão só pode ser acionada por um gesto do usuário, por exemplo, clicando no botão .
![Solicitação de permissão mostrada antes de salvar um arquivo.](https://developer.chrome.com/static/docs/capabilities/web-apis/file-system-access/image/permission-prompt-shown-p-823d180f97ad5.png?authuser=2&hl=pt)
Como alternativa, um app da Web que edita vários arquivos, como um ambiente de desenvolvimento integrado, também pode pedir permissão para salvar. no momento da abertura.
Se o usuário selecionar Cancelar e não conceder acesso de gravação, o aplicativo da web não poderá salvar as alterações no arquivo local. Ele deve fornecer um método alternativo para o usuário salvar seus dados, por exemplo, fornecendo uma maneira de "fazer download" o arquivo ou salvar dados na nuvem.
Transparência
![Ícone da omnibox](https://developer.chrome.com/static/docs/capabilities/web-apis/file-system-access/image/omnibox-icon-5797e9a831603.jpg?authuser=2&hl=pt)
Depois que um usuário concede permissão a um app da Web para salvar um arquivo local, o navegador mostra um ícone na barra de endereço. Clicar no ícone abre um pop-over mostrando a lista de arquivos que o usuário forneceu acesso. O usuário pode revogar esse acesso a qualquer momento, se quiser.
Persistência da permissão
O aplicativo da web pode continuar salvando alterações no arquivo sem solicitar até que todas as guias de seu são fechadas. Quando uma guia é fechada, o site perde todo o acesso. Na próxima vez que o usuário usar o aplicativo da Web, ele receberá uma nova solicitação de acesso aos arquivos.
Feedback
Queremos saber como foi sua experiência com a API File System Access.
Fale sobre o design da API
Alguma coisa na API não funciona como você esperava? Ou há métodos faltando ou propriedades de que precisa para implementar sua ideia? Tem uma pergunta ou comentário sobre a segurança modelo?
- Registre um problema de especificação no repositório do GitHub sobre acesso ao sistema de arquivos WiCG (em inglês) ou deixe seu feedback a um problema existente.
Problemas com a implementação?
Você encontrou um bug na implementação do Chrome? Ou a implementação é diferente das especificações?
- Registre um bug em https://new.crbug.com. Não deixe de incluir
o máximo de detalhes possível,
instruções de reprodução e defina Componentes como
Blink>Storage>FileSystem
. O Glitch é ótimo para compartilhar reproduções rápidas.
Planeja usar a API?
Planejando usar a API File System Access no site? Seu apoio público nos ajuda a priorizar e mostra a outros fornecedores de navegador como é fundamental oferecer suporte a eles.
- Compartilhe como você planeja usá-la na conversa sobre a WCG (em inglês).
- Envie um tweet para @ChromiumDev usando a hashtag
#FileSystemAccess
e informe onde e como está usando o serviço.
Links úteis
- Explicações públicas
- Especificação de acesso ao sistema de arquivos e Especificação do arquivo
- Rastreamento de bug
- Entrada de ChromeStatus.com
- Definições do TypeScript
- API File System Access: modelo de segurança do Chromium
- Componente Blink:
Blink>Storage>FileSystem
Agradecimentos
A especificação da API File System Access foi escrita por Marijn Kruisselbrink.