HTML5 Rocks

HTML5 Rocks

HTML5 Recursos

Acesso a arquivos

HTML5 fornece APIs muito poderosas para interagir com dados binários e com o sistema de arquivos local de um usuário. As APIs de arquivos fornecem aos aplicativos da web a capacidade de realizar tarefas como ler arquivos de forma [as]síncrona, criar Blobs arbitrários, gravar arquivos em um local temporário, ler um diretório de arquivos recursivamente, arrastar e soltar arquivos do desktop para o navegador e fazer upload de dados binários usando XMLHttpRequest2.

As APIs de arquivos podem ser usadas, por exemplo, ​​para criar uma pré-visualização de miniaturas de imagens enquanto elas são enviadas para o servidor ou permitir que um aplicativo salve uma referência de arquivo enquanto o usuário está off-line. Usando a API de áudio da web, seu aplicativo pode ler um arquivo. mp3 e exibir uma visualização da música enquanto ela é reproduzida. Além disso, você poderia usar a lógica do lado do cliente para verificar se o tipo mime de um upload corresponde a sua extensão de arquivo ou restringir o tamanho de um upload.

O que há de novo

Demonstrações

HTML5 Demos: Drag files from the desktop to the browser

Em funcionamento

GMail
MugTug Darkroom

Recursos

  • W3C Spec: File Esta especificação W3C define as APIs de arquivo: arquivo, FileList, FileReader, Blob.
  • W3C Spec: FileSystem APIs Esta especificação W3C define as APIs FileSystem, que fornecem uma interface para ler e gravar arquivos e diretórios em um sistema de arquivos em área restrita.
  • W3C Spec: FileWriter Esta especificação W3C define a API FileWriter, que fornece uma interface para gravação de arquivos a partir de aplicativos da web.
  • W3C Spec: ProgressEvents Esta especificação W3C define o ProgressEvent, que fornece atualizações assíncronas sobre o desenvolvimento da leitura de um arquivo.
  • WHATWG Spec: Drag and Drop Esta especificação whatwg define as APIs nativas da função arrastar e soltar em HTML5
  • Mozilla Hacks: Interactive file uploads Tutorial sobre o uso de Arraste e Solte, FileAPI e XMLHttpRequest para fazer o upload de arquivos.
  • MDC: Drag Operations Referência sobre as várias opções da função arrastar disponíveis na API Drag and Drop
  • HTML5 Doctor: Native Drag and Drop Artigo sobre o uso de arrastar e soltar nativo no HTML5. Explica a função arrastar e soltar arquivos a partir da área de trabalho.