An introduction to the File API
summary
Introduces the DOM input.files list, shows using a FileReader with readAsText, readAsDataURL and readAsArrayBuffer to get a string, a data URL and an ArrayBuffer/Uint8Array, demos extracting JPEG EXIF orientation and rotating the preview, and contrasts data URLs (4 MB photo becomes ~5 MB) with URL.createObjectURL + revokeObjectURL to avoid copies. Covers drag‑and‑drop file access, xhr send(file), and current limits: no full directory traversal and no simple save‑as with a filename; advises polyfills for older IE/Safari.
AI-written summary · about
chapters (7)
- 0:00Introduction to File API
- 1:09Accessing file metadata
- 2:31Reading file content
- 4:43Data URLs for images
- 6:12Binary data access
- 8:23Blob URLs and performance
- 10:25API limitations and support
related talks
01h 01mThe 2021 edition of dealing with files on the Web
45mBytes and blobs
34mFile API: Client-Side File Handling and Uploading to the Server
57mThe Naked Truth About Files
50mMost useful browser APIs
01h 13mHTML
44mWeb APIs You Should Be Using in 2026: Unlocking Next-Level Web Experiences
35mHTML5 APIs - The New Frontier