HTML5 Rocks

HTML5 Rocks

HTML5 Características

File Access

HTML5 proporciona API muy potentes que permiten interactuar con datos binarios y con el sistema de archivos local del usuario. Las API de archivos permiten que las aplicaciones web realicen tareas como leer archivos de forma síncrona o asíncrona, crear objetos BLOB arbitrarios, escribir archivos en una ubicación temporal, leer un directorio de archivos de forma recurrente, arrastrar archivos del escritorio y soltarlos en el navegador y subir datos binarios con XMLHttpRequest2.

Las API de archivos se pueden utilizar, por ejemplo, para crear una vista previa en miniatura de las imágenes que se envían al servidor o para permitir que una aplicación guarde un archivo de referencia mientras el usuario no está conectado. Con el API de audio web, la aplicación podría leer un archivo .mp3 y mostrar una visualización de la canción mientras se reproduce. También se podría utilizar lógica de cliente para verificar si el tipo MIME de un archivo subido coincide con su extensión o para limitar el tamaño de una subida.

Novedades

Demostraciones

HTML5 Demos: Drag files from the desktop to the browser

En estado puro

GMail
MugTug Darkroom

Recursos

  • W3C Spec: File Esta especificación W3C define las API de archivos File, FileList, FileReader y Blob.
  • W3C Spec: FileSystem APIs La especificación W3C define las API de sistemas de archivos (FileSystem APIs), lo que proporciona una interfaz para leer y escribir archivos y directorios en un sistema de archivos protegido.
  • W3C Spec: FileWriter La especificación W3C define el API de escritura de archivos (FileWriter API),lo que proporciona una interfaz para escribir en archivos de aplicaciones web.
  • W3C Spec: ProgressEvents Esta especificación W3C define el objeto ProgressEvent, que ofrece actualizaciones asíncronas sobre el progreso de la lectura de un archivo.
  • WHATWG Spec: Drag and Drop Esta especificación whatwg define las API nativas de la función de arrastrar y soltar de HTML5.
  • Mozilla Hacks: Interactive file uploads Tutorial sobre el uso de la función de arrastrar y soltar, el API de archivos (FileAPI) y XMLHttpRequest para subir archivos
  • MDC: Drag Operations Referencia sobre las diferentes opciones de arrastre disponibles en el API de la función de arrastrar y soltar (DnD API)
  • HTML5 Doctor: Native Drag and Drop Artículo sobre el uso de la función de arrastrar y soltar nativa en HTML5 que proporciona información sobre cómo arrastrar y soltar archivos desde el escritorio