### Blob() Constructor Source: https://www.w3.org/TR/FileAPI Documentation for the Blob constructor, including its parameters and usage examples. ```APIDOC ## [Constructor] Blob() ### Description Creates a new Blob object. The constructor can accept an optional array of BlobPart values (ArrayBuffer, ArrayBufferView, Blob, or DOMString) and an optional options object with a type property. ### Method Constructor ### Parameters #### Request Body - **blobParts** (Array) - Optional - An array of BlobPart values (ArrayBuffer, ArrayBufferView, Blob, or DOMString) to be included in the Blob. - **options** (BlobPropertyBag) - Optional - An object with a `type` property (DOMString) specifying the media type of the Blob. ### Request Example ```js // Create a new Blob object var a = new Blob(); // Create a 1024-byte ArrayBuffer var buffer = new ArrayBuffer(1024); // Create ArrayBufferView objects based on buffer var shorts = new Uint16Array(buffer, 512, 128); var bytes = new Uint8Array(buffer, shorts.byteOffset + shorts.byteLength); var b = new Blob(["foobarbazetcetc" + "birdiebirdieboo"], {type: "text/plain;charset=utf-8"}); var c = new Blob([b, shorts]); var a = new Blob([b, c, bytes]); var d = new Blob([buffer, b, c, bytes]); ``` ### Response #### Success Response Returns a new Blob object. ``` -------------------------------- ### FileReader example: read file as UTF-16 with progress and error handling Source: https://www.w3.org/TR/FileAPI Example from the File API introduction showing how to read a file asynchronously using FileReader. It includes functions for starting the read, handling progress, success, and errors. The example uses readAsText with UTF-16 encoding and checks for NotReadableError. ```javascript function startRead() { // obtain input element through DOM var file = document.getElementById('file').files[0]; if(file){ getAsText(file); } } function getAsText(readFile) { var reader = new FileReader(); // Read file into memory as UTF-16 reader.readAsText(readFile, "UTF-16"); // Handle progress, success, and errors reader.onprogress = updateProgress; reader.onload = loaded; reader.onerror = errorHandler; } function updateProgress(evt) { if (evt.lengthComputable) { // evt.loaded and evt.total are ProgressEvent properties var loaded = (evt.loaded / evt.total); if (loaded < 1) { // Increase the prog bar length // style.width = (loaded * 200) + "px"; } } } function loaded(evt) { // Obtain the read file data var fileString = evt.target.result; // Handle UTF-16 file dump if(utils.regexp.isChinese(fileString)) { //Chinese Characters + Name validation } else { // run other charset test } // xhr.send(fileString) } function errorHandler(evt) { if(evt.target.error.name == "NotReadableError") { // The file could not be read } } ``` -------------------------------- ### Access selected files from an input element Source: https://www.w3.org/TR/FileAPI JavaScript example showing how to access the first selected file from an element via a form. Includes an alternative syntax using item(0) and a check before performing file operations. ```javascript // uploadData is a form element // fileChooser is input element of type 'file' var file = document.forms['uploadData']['fileChooser'].files[0]; // alternative syntax can be // var file = document.forms['uploadData']['fileChooser'].files.item(0); if(file) { // Perform file ops } ``` -------------------------------- ### FileReader.readAsBinaryString(blob) Source: https://www.w3.org/TR/FileAPI Starts reading the contents of the specified Blob as a binary string. ```APIDOC ## FileReader.readAsBinaryString(blob) ### Description Starts reading the contents of the specified Blob as a binary string. The result will be available in the result attribute after the read completes. ### Method readAsBinaryString(blob) ### Parameters - **blob** (Blob) - Required - The Blob or File to read. ### Example js reader.readAsBinaryString(file); ``` -------------------------------- ### Create and revoke a blob URL across windows Source: https://www.w3.org/TR/FileAPI Shows creating a blob URL in one window and revoking it in another window of the same origin. The example assumes window2 could be an iframe inside window1. ```javascript myurl = window1.URL.createObjectURL(myblob); window2.URL.revokeObjectURL(myurl); ``` -------------------------------- ### FileReader.readAsText(blob, encoding) Source: https://www.w3.org/TR/FileAPI Starts reading the contents of the specified Blob as text using the given encoding. ```APIDOC ## FileReader.readAsText(blob, encoding) ### Description Starts reading the contents of the specified Blob as text. The encoding parameter is optional and specifies the character encoding to use. ### Method readAsText(blob, encoding) ### Parameters - **blob** (Blob) - Required - The Blob or File to read. - **encoding** (DOMString) - Optional - The character encoding to use for decoding the text. ### Example js reader.readAsText(file, 'UTF-8'); ``` -------------------------------- ### FileReader.readAsArrayBuffer(blob) Source: https://www.w3.org/TR/FileAPI Starts reading the contents of the specified Blob as an ArrayBuffer. ```APIDOC ## FileReader.readAsArrayBuffer(blob) ### Description Starts reading the contents of the specified Blob as an ArrayBuffer. The result will be available in the result attribute after the read completes. ### Method readAsArrayBuffer(blob) ### Parameters - **blob** (Blob) - Required - The Blob or File to read. ### Example js reader.readAsArrayBuffer(file); ``` -------------------------------- ### FileReader.readAsDataURL(blob) Source: https://www.w3.org/TR/FileAPI Starts reading the contents of the specified Blob as a data URL. ```APIDOC ## FileReader.readAsDataURL(blob) ### Description Starts reading the contents of the specified Blob as a data URL. The result will be available in the result attribute after the read completes. ### Method readAsDataURL(blob) ### Parameters - **blob** (Blob) - Required - The Blob or File to read. ### Example js reader.readAsDataURL(file); ``` -------------------------------- ### File Interface Source: https://www.w3.org/TR/FileAPI Documentation for the File interface constructor and its attributes. ```APIDOC ## [Constructor] File() ### Description Creates a new File object from the provided file bits, file name, and optional properties. ### Method Constructor ### Parameters #### fileBits (sequence) - Required - A sequence of BufferSource, Blob, or USVString elements. #### fileName (USVString) - Required - The name of the file. #### options (FilePropertyBag) - Optional - A dictionary that may include a `lastModified` member (long long). ### Request Example ```js var file = new File(["content"], "example.txt", {lastModified: 1234567890}); ``` ### Response #### Success Response Returns a new File object with the specified name, type, size, and lastModified attributes. ``` ```APIDOC ## [Attribute] File.name ### Description Returns the name of the file as a string, without path information. ### Method Attribute (readonly) ### Response #### Success Response Returns a DOMString representing the file name. ``` ```APIDOC ## [Attribute] File.lastModified ### Description Returns the last modified date of the file as the number of milliseconds since the Unix Epoch. ### Method Attribute (readonly) ### Response #### Success Response Returns a long long representing the last modified time in milliseconds. ``` -------------------------------- ### File constructor Source: https://www.w3.org/TR/FileAPI Creates a new File object, which is a Blob with a name and last modified date. ```APIDOC ## File Constructor ### Description Creates a new File object, which is a Blob with a name and last modified date. ### Method Constructor ### Parameters - **fileBits** (sequence) - Required - The parts to concatenate into the File. - **fileName** (USVString) - Required - The name of the file. - **options** (FilePropertyBag) - Optional - An object with properties `type`, `endings`, and `lastModified` (long long). ### Returns A new File object. ``` -------------------------------- ### FileReader.readyState Source: https://www.w3.org/TR/FileAPI Read-only attribute that returns the current state of the FileReader. ```APIDOC ## FileReader.readyState ### Description Returns the current state of the FileReader (EMPTY, LOADING, or DONE). ### Property readonly attribute unsigned short readyState ### Constants - EMPTY = 0 - LOADING = 1 - DONE = 2 ### Returns unsigned short - The current state. ``` -------------------------------- ### FileReader.readyState Source: https://www.w3.org/TR/FileAPI Returns the current state of the FileReader as one of the constants EMPTY, LOADING, or DONE. ```APIDOC ## FileReader.readyState ### Description Returns the current state of the FileReader. The value is one of the constants EMPTY (0), LOADING (1), or DONE (2). ### Attribute - **readyState** (unsigned short) - readonly - The current state of the reader. ### Example js if (reader.readyState === FileReader.DONE) { ... } ``` -------------------------------- ### Blob() Constructor Source: https://www.w3.org/TR/FileAPI Creates a new Blob object. Can be invoked with zero or more parameters. When invoked with zero parameters, returns an empty Blob. Otherwise, processes the provided blob parts and options to create a Blob with the specified data and type. ```APIDOC ## Blob() Constructor ### Description Creates a new Blob object. Can be invoked with zero or more parameters. When invoked with zero parameters, returns an empty Blob. Otherwise, processes the provided blob parts and options to create a Blob with the specified data and type. ### Method Constructor ### Endpoint Blob() ### Parameters #### Constructor Parameters - **blobParts** (sequence) - Optional - A sequence of elements, each of which can be a BufferSource, Blob, or USVString. - **options** (BlobPropertyBag) - Optional - An object with optional members: - **type** (string) - Optional - The ASCII-encoded string in lower case representing the media type of the Blob. - **endings** (enum) - Optional - Can be "transparent" or "native". Default is "transparent". If "native", line endings in USVString elements are converted to native. ### Request Example ``` new Blob(["Hello, world!"], { type: "text/plain" }); ``` ### Response #### Success Response Returns a new Blob object with the specified byte sequence, size, and type. #### Response Example ``` Blob { size: 13, type: "text/plain" } ``` ``` -------------------------------- ### Blob() Source: https://www.w3.org/TR/FileAPI Constructor for creating a new Blob object from a sequence of BlobParts and an optional BlobPropertyBag. ```APIDOC ## [CONSTRUCTOR] Blob() ### Description Creates a new Blob object from a sequence of BlobParts and an optional BlobPropertyBag. ### Method Constructor ### Endpoint Blob(optional sequence blobParts, optional BlobPropertyBag options = {}) ### Parameters #### Constructor Parameters - **blobParts** (sequence) - Optional - A sequence of BlobPart items (BufferSource, Blob, or USVString) to concatenate into the Blob. - **options** (BlobPropertyBag) - Optional - A dictionary with `type` (DOMString, default "") and `endings` (EndingType, default "transparent"). ### Request Example ```js const blob = new Blob(["Hello, world!"], { type: "text/plain" }); ``` ### Response #### Success Response - **blob** (Blob) - The newly created Blob object. #### Response Example ```js Blob { size: 13, type: "text/plain" } ``` ``` -------------------------------- ### File constructor Source: https://www.w3.org/TR/FileAPI The File constructor creates a new File object from a sequence of BlobParts and a file name. ```APIDOC ## [File constructor] ### Description The `File` constructor creates a new `File` object from a sequence of `BlobPart` and a file name. ### Method constructor ### Endpoint new File(fileBits, fileName, options) ### Parameters #### Path Parameters - **fileBits** (sequence) - Required - The parts to include in the file. - **fileName** (USVString) - Required - The name of the file. - **options** (FilePropertyBag) - Optional - Additional options, including `lastModified`. ### Response #### Success Response Returns a new File object. ``` -------------------------------- ### URL.createObjectURL() Source: https://www.w3.org/TR/FileAPI Creates a URL for the given Blob or MediaSource object. ```APIDOC ## URL.createObjectURL() ### Description Creates a URL for the given Blob or MediaSource object. ### Method static DOMString createObjectURL((Blob or MediaSource) obj) ### Parameters - **obj** (Blob or MediaSource) - Required - The object to create a URL for. ### Returns DOMString - The generated object URL. ``` -------------------------------- ### FileReaderSync constructor Source: https://www.w3.org/TR/FileAPI Creates a new FileReaderSync object. When invoked, the user agent must return a new FileReaderSync object. ```APIDOC ## FileReaderSync() ### Description Creates a new FileReaderSync object. ### Method constructor ### Syntax new FileReaderSync() ### Parameters None. ### Return Value A new FileReaderSync object. ### Exceptions None. ``` -------------------------------- ### FileReader constructor Source: https://www.w3.org/TR/FileAPI Creates a new FileReader object. ```APIDOC ## FileReader Constructor ### Description Creates a new FileReader object for reading files asynchronously. ### Method Constructor ### Returns A new FileReader object. ``` -------------------------------- ### FileReaderSync constructor Source: https://www.w3.org/TR/FileAPI Creates a new FileReaderSync object. ```APIDOC ## FileReaderSync Constructor ### Description Creates a new FileReaderSync object for synchronous file reading in workers. ### Method Constructor ### Returns A new FileReaderSync object. ``` -------------------------------- ### Blob constructor Source: https://www.w3.org/TR/FileAPI Creates a new Blob object from a sequence of BlobParts and an optional BlobPropertyBag. ```APIDOC ## Blob Constructor ### Description Creates a new Blob object containing the concatenation of the given blob parts. ### Method Constructor ### Parameters - **blobParts** (sequence) - Optional - The parts to concatenate into the Blob. - **options** (BlobPropertyBag) - Optional - An object with properties `type` (DOMString, default "") and `endings` (EndingType, default "transparent"). ### Returns A new Blob object. ### Example ```js const blob = new Blob(['hello'], {type: 'text/plain'}); ``` ``` -------------------------------- ### Create a blob URL and assign to two img elements Source: https://www.w3.org/TR/FileAPI Creates a blob URL from a Blob object and assigns it to the src of two img elements. Both images reference the same blob URL. ```javascript url = URL.createObjectURL(blob); img1.src = url; img2.src = url; ``` -------------------------------- ### Create a File object with custom lastModified date Source: https://www.w3.org/TR/FileAPI Shows how to construct a File object with a specified lastModified date using a Date object. The File constructor takes an array of data, a filename, and an options object with type and lastModified. ```javascript var d = new Date(2013, 12, 5, 16, 23, 45, 600); var generatedFile = new File(["Rough Draft ...."], "Draft1.txt", {type: "text/plain", lastModified: d}) ``` -------------------------------- ### Display file metadata and generate file with last modified date Source: https://www.w3.org/TR/FileAPI Displays metadata from a file selected via a file picker, including its name and last modified date, and includes a placeholder for generating a file with a specific last modified date. ```javascript var file = document.getElementById("filePicker").files[0]; var date = new Date(file.lastModified); println("You selected the file " + file.name + " which was modified on " + date.toDateString() + "."); ... // Generate a file with a specific last modified date ``` -------------------------------- ### URL interface for blob URL creation and revocation Source: https://www.w3.org/TR/FileAPI Defines the static methods for creating and revoking blob URLs. The createObjectURL method returns the result of adding an entry to the blob URL store, while revokeObjectURL silently fails if the URL is not registered or was created in a different storage partition. ```webidl [Exposed=(Window,DedicatedWorker,SharedWorker)] partial interface URL { static DOMString createObjectURL((Blob or MediaSource) obj); static undefined revokeObjectURL(DOMString url); }; ``` -------------------------------- ### Blob.slice() Method Source: https://www.w3.org/TR/FileAPI Documentation for the Blob.slice() method, which creates a new Blob containing a subset of the original Blob's data. ```APIDOC ## [Method] Blob.slice() ### Description The slice() method returns a new Blob object with bytes ranging from the optional start parameter up to but not including the optional end parameter, and with a type attribute that is the value of the optional contentType parameter. ### Method slice ### Parameters #### Query Parameters - **start** (long long) - Optional - The start position of the slice. If omitted, the slice starts at the beginning. - **end** (long long) - Optional - The end position of the slice (exclusive). If omitted, the slice extends to the end. - **contentType** (DOMString) - Optional - The media type for the new Blob. ### Request Example ```js // obtain input element through DOM var file = document.getElementById('file').files[0]; if(file) { // create an identical copy of file // the two calls below are equivalent var fileClone = file.slice(); var fileClone2 = file.slice(0, file.size); // slice file into 1/2 chunk starting at middle of file // Note the use of negative number var fileChunkFromEnd = file.slice(-(Math.round(file.size/2))); // slice file into 1/2 chunk starting at beginning of file var fileChunkFromStart = file.slice(0, Math.round(file.size/2)); // slice file from beginning till 150 bytes before end var fileNoMetadata = file.slice(0, -150, "application/experimental"); } ``` ### Response #### Success Response Returns a new Blob object containing the specified byte range. ``` -------------------------------- ### FileReader event handlers Source: https://www.w3.org/TR/FileAPI Event handler attributes for loadstart, progress, load, abort, error, and loadend events. ```APIDOC ## FileReader event handlers ### Description These attributes allow setting event handlers for the FileReader's events: onloadstart, onprogress, onload, onabort, onerror, and onloadend. ### Attributes - **onloadstart** (EventHandler) - Fired when reading starts. - **onprogress** (EventHandler) - Fired during reading progress. - **onload** (EventHandler) - Fired when reading successfully completes. - **onabort** (EventHandler) - Fired when reading is aborted. - **onerror** (EventHandler) - Fired when an error occurs. - **onloadend** (EventHandler) - Fired when reading ends (success or failure). ### Example js reader.onload = function() { console.log(reader.result); }; ``` -------------------------------- ### URL.createObjectURL and URL.revokeObjectURL Source: https://www.w3.org/TR/FileAPI Static methods on the URL interface for creating and revoking blob URLs. ```APIDOC ## [STATIC] URL.createObjectURL(obj) ### Description Creates a blob URL for the given Blob or MediaSource object and returns a DOMString that can be used to reference the object. ### Method Static method on the URL interface. ### Endpoint URL.createObjectURL(obj) ### Parameters - **obj** (Blob or MediaSource) - Required - The object for which a blob URL is created. ### Returns - **DOMString** - The generated blob URL. ### Example ```js const url = URL.createObjectURL(blob); ``` ``` ```APIDOC ## [STATIC] URL.revokeObjectURL(url) ### Description Revokes a previously created blob URL, decoupling it from the resource it refers to. After revocation, dereferencing the URL results in a network error. ### Method Static method on the URL interface. ### Endpoint URL.revokeObjectURL(url) ### Parameters - **url** (DOMString) - Required - The blob URL to revoke. ### Behavior - If the URL's scheme is not "blob", the method returns without action. - If the URL is not registered or was created in a different storage partition, the revocation silently fails. - Requests started before revocation should still succeed. ### Example ```js URL.revokeObjectURL(url); ``` ``` -------------------------------- ### FileReader() constructor Source: https://www.w3.org/TR/FileAPI Creates a new FileReader object for reading file contents asynchronously. ```APIDOC ## FileReader() constructor ### Description Constructs a new FileReader object. The object is initially in the EMPTY state with a null result and error. ### Method constructor() ### Example js var reader = new FileReader(); ``` -------------------------------- ### createObjectURL(obj) Source: https://www.w3.org/TR/FileAPI Creates a blob URL for a Blob or File object. ```APIDOC ## createObjectURL(obj) ### Description Creates a blob URL (also known as an object URL) for the given Blob or File object. The returned URL can be used to reference the object's data. ### Method createObjectURL ### Parameters - **obj** (Blob or File) - Required - The Blob or File object for which to create a blob URL. ### Returns A string representing the generated blob URL. ``` -------------------------------- ### readAsBinaryString(blob) Source: https://www.w3.org/TR/FileAPI Initiates an asynchronous read of a Blob or File, producing a binary string. Provided for backwards compatibility; prefer readAsArrayBuffer(). ```APIDOC ## [FileReader] readAsBinaryString(blob) ### Description Initiates a read operation for the given blob, producing a binary string. ### Method readAsBinaryString ### Parameters - **blob** (Blob) - Required - The blob to read. ### Response Returns a binary string where each byte is represented by a code unit of equal value [0..255]. ``` -------------------------------- ### FileReader.readAsBinaryString() Source: https://www.w3.org/TR/FileAPI Asynchronously reads the Blob as a binary string. ```APIDOC ## FileReader.readAsBinaryString() ### Description Starts reading the specified Blob as a binary string. ### Method undefined readAsBinaryString(Blob blob) ### Parameters - **blob** (Blob) - Required - The Blob to read. ### Returns undefined ``` -------------------------------- ### File.name Source: https://www.w3.org/TR/FileAPI The name attribute returns the name of the file. ```APIDOC ## [File.name] ### Description The `name` attribute returns the name of the file. ### Method attribute ### Endpoint File.name ### Parameters None. ### Response #### Success Response Returns a DOMString. ``` -------------------------------- ### File Interface Source: https://www.w3.org/TR/FileAPI The File interface extends Blob and represents a file on the user's file system. It adds properties for name, last modified time, and relative path. ```APIDOC ## File Interface ### Description The File interface represents a file on the user's file system. It inherits from Blob and adds file-specific attributes. ### Attributes - `name` (DOMString) - The name of the file. - `lastModified` (long long) - The last modified time of the file, in milliseconds since the Unix epoch. - `webkitRelativePath` (DOMString) - The path of the file relative to the directory selected by the user. ``` -------------------------------- ### FileList.item() Source: https://www.w3.org/TR/FileAPI Returns the File at the given index in the FileList. ```APIDOC ## FileList.item() ### Description Returns the File object at the specified index in the FileList. ### Method getter File? item(unsigned long index) ### Parameters - **index** (unsigned long) - Required - The index of the file to retrieve. ### Returns File? - The File at the given index, or null if out of range. ``` -------------------------------- ### FileList Interface Source: https://www.w3.org/TR/FileAPI The FileList interface represents a list of File objects, typically returned by file input elements or drag-and-drop operations. ```APIDOC ## FileList Interface ### Description The FileList interface represents a list of File objects. It is array-like and provides access to the files by index. ### Attributes - `length` (unsigned long) - The number of files in the list. ### Methods - `item(unsigned long index)` - Returns the File at the given index, or null if the index is out of range. ``` -------------------------------- ### Explicitly revoke a blob URL with URL.revokeObjectURL() Source: https://www.w3.org/TR/FileAPI Creates a blob URL from a file, assigns it to two Image objects, then revokes it after both images load so subsequent references throw an exception. ```javascript var blobURLref = URL.createObjectURL(file); img1 = new Image(); img2 = new Image(); // Both assignments below work as expected img1.src = blobURLref; img2.src = blobURLref; // ... Following body load // Check if both images have loaded if(img1.complete && img2.complete) { // Ensure that subsequent refs throw an exception URL.revokeObjectURL(blobURLref); } ``` -------------------------------- ### File.name Source: https://www.w3.org/TR/FileAPI Read-only attribute that returns the name of the file. ```APIDOC ## File.name ### Description Returns the name of the file. ### Property readonly attribute DOMString name ### Returns DOMString - The file name. ``` -------------------------------- ### FileReader.readAsText() Source: https://www.w3.org/TR/FileAPI Asynchronously reads the Blob as text. ```APIDOC ## FileReader.readAsText() ### Description Starts reading the specified Blob as text. ### Method undefined readAsText(Blob blob, optional DOMString encoding) ### Parameters - **blob** (Blob) - Required - The Blob to read. - **encoding** (DOMString) - Optional - The encoding to use for the text. ### Returns undefined ``` -------------------------------- ### FileReaderSync.readAsBinaryString() Source: https://www.w3.org/TR/FileAPI Synchronously reads the Blob as a binary string. ```APIDOC ## FileReaderSync.readAsBinaryString() ### Description Synchronously reads the specified Blob as a binary string. ### Method DOMString readAsBinaryString(Blob blob) ### Parameters - **blob** (Blob) - Required - The Blob to read. ### Returns DOMString - The binary string. ``` -------------------------------- ### FileList.length Source: https://www.w3.org/TR/FileAPI Returns the number of files in the FileList object. ```APIDOC ## FileList.length ### Description Returns the number of files in the FileList object. If there are no files, returns 0. ### Attribute - **length** (unsigned long) - readonly - The number of files in the FileList. ### Example js var count = fileList.length; ``` -------------------------------- ### Blob.text() Source: https://www.w3.org/TR/FileAPI Asynchronously reads the Blob's contents as text. ```APIDOC ## Blob.text() ### Description Returns a Promise that resolves with the contents of the Blob as a USVString (text). ### Method [NewObject] Promise text() ### Returns Promise - A promise that resolves with the text content. ``` -------------------------------- ### Blob.size Attribute Source: https://www.w3.org/TR/FileAPI Documentation for the Blob.size attribute, which returns the size of the Blob in bytes. ```APIDOC ## [Attribute] Blob.size ### Description Returns the size of the byte sequence in number of bytes. On getting, conforming user agents must return the total number of bytes that can be read by a FileReader or FileReaderSync object, or 0 if the Blob has no bytes to be read. ### Type unsigned long long (readonly) ### Response #### Success Response - **size** (unsigned long long) - The total number of bytes in the Blob. ``` -------------------------------- ### Blob.textStream() Source: https://www.w3.org/TR/FileAPI Returns a ReadableStream for reading the Blob's contents as text. ```APIDOC ## Blob.textStream() ### Description Returns a ReadableStream that can be used to read the contents of the Blob as text. ### Method [NewObject] ReadableStream textStream() ### Returns ReadableStream - A stream for reading the Blob's text content. ``` -------------------------------- ### Blob Interface Source: https://www.w3.org/TR/FileAPI The Blob interface represents immutable raw binary data. It provides constructors, attributes, and methods to access and manipulate the data. ```APIDOC ## Blob Interface ### Description The Blob interface represents a file-like object of immutable, raw data. It can be constructed from parts and provides methods to read its content in various formats. ### Constructors - `Blob(optional sequence blobParts, optional BlobPropertyBag options)` - Creates a new Blob object. ### Attributes - `size` (unsigned long long) - The size, in bytes, of the Blob. - `type` (DOMString) - The MIME type of the Blob, lowercased. ### Methods #### `slice()` - `Blob slice(optional long long start, optional long long end, optional DOMString contentType)` - Returns a new Blob object containing the bytes in the specified range. #### `stream()` - `ReadableStream stream()` - Returns a ReadableStream that can be used to read the contents of the Blob. #### `text()` - `Promise text()` - Returns a promise that resolves with the contents of the Blob as a string. #### `arrayBuffer()` - `Promise arrayBuffer()` - Returns a promise that resolves with the contents of the Blob as an ArrayBuffer. #### `bytes()` - `Promise bytes()` - Returns a promise that resolves with the contents of the Blob as a Uint8Array. #### `textStream()` - `ReadableStream textStream()` - Returns a ReadableStream that yields the contents of the Blob as text chunks. ``` -------------------------------- ### Blob.text() Source: https://www.w3.org/TR/FileAPI Returns a Promise that resolves with the contents of the Blob as a USVString (text). ```APIDOC ## [METHOD] Blob.text() ### Description Returns a Promise that resolves with the contents of the Blob as a USVString (text). ### Method text ### Endpoint Blob.text() ### Parameters None ### Response #### Success Response - **Promise** - A promise that resolves with the Blob's contents as a string. #### Response Example ```js const text = await blob.text(); ``` ``` -------------------------------- ### Blob.text() Source: https://www.w3.org/TR/FileAPI The text() method returns a promise that resolves with the contents of the Blob as a string, decoded as UTF-8. ```APIDOC ## [Blob.text()] ### Description The `text()` method returns a promise that resolves with the contents of the Blob as a string, decoded as UTF-8. ### Method text ### Endpoint Blob.text() ### Parameters None. ### Response #### Success Response Returns a Promise that resolves with a DOMString. ``` -------------------------------- ### readAsDataURL(blob) Source: https://www.w3.org/TR/FileAPI Initiates an asynchronous read of a Blob or File, producing a DataURL. ```APIDOC ## [FileReader] readAsDataURL(blob) ### Description Initiates a read operation for the given blob, producing a DataURL. ### Method readAsDataURL ### Parameters - **blob** (Blob) - Required - The blob to read. ### Response Returns a DataURL representation of the blob. ``` -------------------------------- ### Blob.bytes() Source: https://www.w3.org/TR/FileAPI Returns a Promise that resolves with the contents of the Blob as a Uint8Array. ```APIDOC ## [METHOD] Blob.bytes() ### Description Returns a Promise that resolves with the contents of the Blob as a Uint8Array. ### Method bytes ### Endpoint Blob.bytes() ### Parameters None ### Response #### Success Response - **Promise** - A promise that resolves with the Blob's contents as a Uint8Array. #### Response Example ```js const bytes = await blob.bytes(); ``` ``` -------------------------------- ### FileList.item(index) Source: https://www.w3.org/TR/FileAPI Returns the File object at the specified index in the FileList, or null if the index is out of range. ```APIDOC ## FileList.item(index) ### Description Returns the File object at the specified index in the FileList. If there is no such File object, returns null. ### Method item(index) ### Parameters - **index** (unsigned long) - Required - The position of the File object in the FileList, with 0 representing the first file. ### Returns - **File?** - The File object at the given index, or null if not found. ### Example js var file = fileList.item(0); ``` -------------------------------- ### FileList.length Source: https://www.w3.org/TR/FileAPI Read-only attribute that returns the number of files in the FileList. ```APIDOC ## FileList.length ### Description Returns the number of files in the FileList. ### Property readonly attribute unsigned long length ### Returns unsigned long - The number of files. ``` -------------------------------- ### FileReaderSync.readAsText() Source: https://www.w3.org/TR/FileAPI Synchronously reads the Blob as text. ```APIDOC ## FileReaderSync.readAsText() ### Description Synchronously reads the specified Blob as text. ### Method DOMString readAsText(Blob blob, optional DOMString encoding) ### Parameters - **blob** (Blob) - Required - The Blob to read. - **encoding** (DOMString) - Optional - The encoding to use. ### Returns DOMString - The text content. ``` -------------------------------- ### Blob.textStream() Source: https://www.w3.org/TR/FileAPI Returns a ReadableStream that can be used to read the contents of the Blob as text. ```APIDOC ## [METHOD] Blob.textStream() ### Description Returns a ReadableStream that can be used to read the contents of the Blob as text. ### Method textStream ### Endpoint Blob.textStream() ### Parameters None ### Response #### Success Response - **ReadableStream** - A ReadableStream for reading the Blob's text content. #### Response Example ```js const textStream = blob.textStream(); ``` ``` -------------------------------- ### Blob.bytes() Source: https://www.w3.org/TR/FileAPI Asynchronously reads the Blob's contents as a Uint8Array. ```APIDOC ## Blob.bytes() ### Description Returns a Promise that resolves with the contents of the Blob as a Uint8Array. ### Method [NewObject] Promise bytes() ### Returns Promise - A promise that resolves with the binary data as a Uint8Array. ``` -------------------------------- ### FileList interface WebIDL definition Source: https://www.w3.org/TR/FileAPI WebIDL definition of the FileList interface, which is a list of File objects. It has a getter for item(index) and a readonly length attribute. The interface is exposed to Window and Worker and is serializable. ```webidl [Exposed=(Window,Worker), Serializable] interface FileList { getter File? item(unsigned long index); readonly attribute unsigned long length; }; ``` -------------------------------- ### Blob.stream() Source: https://www.w3.org/TR/FileAPI Returns a ReadableStream for reading the Blob's contents. ```APIDOC ## Blob.stream() ### Description Returns a ReadableStream that can be used to read the contents of the Blob. ### Method [NewObject] ReadableStream stream() ### Returns ReadableStream - A stream for reading the Blob's data. ``` -------------------------------- ### Blob.stream() Source: https://www.w3.org/TR/FileAPI Returns a ReadableStream that can be used to read the contents of the Blob. ```APIDOC ## [METHOD] Blob.stream() ### Description Returns a ReadableStream that can be used to read the contents of the Blob. ### Method stream ### Endpoint Blob.stream() ### Parameters None ### Response #### Success Response - **ReadableStream** - A ReadableStream object for reading the Blob's data. #### Response Example ```js const stream = blob.stream(); ``` ``` -------------------------------- ### Blob.arrayBuffer() Source: https://www.w3.org/TR/FileAPI Returns a Promise that resolves with the contents of the Blob as an ArrayBuffer. ```APIDOC ## [METHOD] Blob.arrayBuffer() ### Description Returns a Promise that resolves with the contents of the Blob as an ArrayBuffer. ### Method arrayBuffer ### Endpoint Blob.arrayBuffer() ### Parameters None ### Response #### Success Response - **Promise** - A promise that resolves with the Blob's contents as an ArrayBuffer. #### Response Example ```js const buffer = await blob.arrayBuffer(); ``` ``` -------------------------------- ### readAsArrayBuffer(blob) Source: https://www.w3.org/TR/FileAPI Initiates an asynchronous read of a Blob or File, producing an ArrayBuffer. ```APIDOC ## [FileReader] readAsArrayBuffer(blob) ### Description Initiates a read operation for the given blob, producing an ArrayBuffer. ### Method readAsArrayBuffer ### Parameters - **blob** (Blob) - Required - The blob to read. ### Response Returns a new ArrayBuffer whose contents are the blob's bytes. ``` -------------------------------- ### FileReader.error Source: https://www.w3.org/TR/FileAPI Returns a DOMException describing the error that occurred during the read, or null if no error occurred. ```APIDOC ## FileReader.error ### Description Returns a DOMException object representing the error that occurred during the read operation, or null if no error occurred. ### Attribute - **error** (DOMException?) - readonly - The error that occurred, if any. ### Example js if (reader.error) { console.error(reader.error); } ``` -------------------------------- ### Blob.stream() Source: https://www.w3.org/TR/FileAPI The stream() method returns a ReadableStream that can be used to read the contents of the Blob. ```APIDOC ## [Blob.stream()] ### Description The `stream()` method returns a ReadableStream that can be used to read the contents of the Blob. ### Method stream ### Endpoint Blob.stream() ### Parameters None. ### Response #### Success Response Returns a ReadableStream. ``` -------------------------------- ### Blob.slice() Source: https://www.w3.org/TR/FileAPI Creates a new Blob containing a slice of the original Blob's data. ```APIDOC ## Blob.slice() ### Description Returns a new Blob object containing bytes in the specified range of the source Blob. ### Method Blob slice(optional [Clamp] long long start, optional [Clamp] long long end, optional DOMString contentType) ### Parameters - **start** (long long) - Optional - The start byte offset. Defaults to 0. - **end** (long long) - Optional - The end byte offset (exclusive). Defaults to the size of the Blob. - **contentType** (DOMString) - Optional - The MIME type for the new Blob. Defaults to the type of the source Blob. ### Returns A new Blob object. ``` -------------------------------- ### Blob.type Attribute Source: https://www.w3.org/TR/FileAPI Documentation for the Blob.type attribute, which returns the media type of the Blob. ```APIDOC ## [Attribute] Blob.type ### Description Returns the ASCII-encoded string in lower case representing the media type of the Blob. On getting, user agents must return the type of a Blob as an ASCII-encoded string in lower case, such that when it is converted to a byte sequence, it is a parsable MIME type, or the empty string if the type cannot be determined. ### Type DOMString (readonly) ### Response #### Success Response - **type** (DOMString) - The media type of the Blob as an ASCII-encoded string in lower case. ``` -------------------------------- ### readAsText(blob, encoding) Source: https://www.w3.org/TR/FileAPI Initiates an asynchronous read of a Blob or File, producing text using the specified encoding. ```APIDOC ## [FileReader] readAsText(blob, encoding) ### Description Initiates a read operation for the given blob, producing text using the specified encoding. ### Method readAsText ### Parameters - **blob** (Blob) - Required - The blob to read. - **encoding** (string) - Optional - The encoding label to use. If omitted, the encoding is determined from the blob's type or defaults to UTF-8. ### Response Returns the text content of the blob. ``` -------------------------------- ### Blob.type Source: https://www.w3.org/TR/FileAPI Read-only attribute that returns the media type of the Blob as a lowercased ASCII string. ```APIDOC ## [PROPERTY] Blob.type ### Description Returns the ASCII-encoded string in lower case representing the media type of the Blob's byte sequence. ### Method Read-only attribute ### Endpoint Blob.type ### Parameters None ### Response #### Success Response - **type** (DOMString) - The media type of the Blob, lowercased. #### Response Example ```js blob.type; // "text/plain" ``` ``` -------------------------------- ### FileReader.readAsDataURL() Source: https://www.w3.org/TR/FileAPI Asynchronously reads the Blob as a data URL. ```APIDOC ## FileReader.readAsDataURL() ### Description Starts reading the specified Blob as a data URL. ### Method undefined readAsDataURL(Blob blob) ### Parameters - **blob** (Blob) - Required - The Blob to read. ### Returns undefined ``` -------------------------------- ### Blob.bytes() Source: https://www.w3.org/TR/FileAPI The bytes() method returns a promise that resolves with a Uint8Array containing the Blob's data. ```APIDOC ## [Blob.bytes()] ### Description The `bytes()` method returns a promise that resolves with a Uint8Array containing the Blob's data. ### Method bytes ### Endpoint Blob.bytes() ### Parameters None. ### Response #### Success Response Returns a Promise that resolves with a Uint8Array. ``` -------------------------------- ### Blob.textStream() Source: https://www.w3.org/TR/FileAPI The textStream() method returns a ReadableStream that emits the Blob's data as text, decoded as UTF-8. ```APIDOC ## [Blob.textStream()] ### Description The `textStream()` method returns a ReadableStream that emits the Blob's data as text, decoded as UTF-8. ### Method textStream ### Endpoint Blob.textStream() ### Parameters None. ### Response #### Success Response Returns a ReadableStream. ``` -------------------------------- ### Blob.arrayBuffer() Source: https://www.w3.org/TR/FileAPI Asynchronously reads the Blob's contents as an ArrayBuffer. ```APIDOC ## Blob.arrayBuffer() ### Description Returns a Promise that resolves with the contents of the Blob as an ArrayBuffer. ### Method [NewObject] Promise arrayBuffer() ### Returns Promise - A promise that resolves with the binary data. ``` -------------------------------- ### Convert line endings to native in a string Source: https://www.w3.org/TR/FileAPI Algorithm to convert line endings in a string to the platform's native line ending (LF or CRLF). ```text 1. Let native line ending be the code point U+000A LF. 2. If the underlying platform’s conventions are to represent newlines as a carriage return and line feed sequence, set native line ending to the code point U+000D CR followed by the code point U+000A LF. 3. Set result to the empty string. 4. Let position be a position variable for s, initially pointing at the start of s. 5. Let token be the result of collecting a sequence of code points that are not equal to U+000A LF or U+000D CR from s given position. 6. Append token to result. 7. While position is not past the end of s: 1. If the code point at position within s equals U+000D CR: 1. Append native line ending to result. 2. Advance position by 1. 3. If position is not past the end of s and the code point at position within s equals U+000A LF advance position by 1. 2. Otherwise if the code point at position within s equals U+000A LF, advance position by 1 and append native line ending to result. 3. Let token be the result of collecting a sequence of code points that are not equal to U+000A LF or U+000D CR from s given position. 4. Append token to result. 8. Return result. ``` -------------------------------- ### FileReader API WebIDL definition Source: https://www.w3.org/TR/FileAPI WebIDL definition of the FileReader interface, which provides asynchronous methods to read Blob or File data as ArrayBuffer, binary string, text, or data URL. Includes states (EMPTY, LOADING, DONE), result, error, and event handler attributes. ```webidl [Exposed=(Window,Worker)] interface FileReader: EventTarget { constructor(); // async read methods undefined readAsArrayBuffer(Blob blob); undefined readAsBinaryString(Blob blob); undefined readAsText(Blob blob, optional DOMString encoding); undefined readAsDataURL(Blob blob); undefined abort(); // states const unsigned short EMPTY = 0; const unsigned short LOADING = 1; const unsigned short DONE = 2; readonly attribute unsigned short readyState; // File or Blob data readonly attribute (DOMString or ArrayBuffer)? result; readonly attribute DOMException? error; // event handler content attributes attribute EventHandler onloadstart; attribute EventHandler onprogress; attribute EventHandler onload; attribute EventHandler onabort; attribute EventHandler onerror; attribute EventHandler onloadend; }; ``` -------------------------------- ### FileReader event handlers Source: https://www.w3.org/TR/FileAPI Event handler attributes for the FileReader object. ```APIDOC ## FileReader event handlers ### Description Event handler attributes for the FileReader object. ### Attributes - **onloadstart** (EventHandler) - Fired when reading starts. - **onprogress** (EventHandler) - Fired during reading. - **onload** (EventHandler) - Fired when reading completes successfully. - **onabort** (EventHandler) - Fired when reading is aborted. - **onerror** (EventHandler) - Fired when an error occurs. - **onloadend** (EventHandler) - Fired when reading ends (success or failure). ``` -------------------------------- ### abort() Source: https://www.w3.org/TR/FileAPI Aborts the current read operation and resets the result to null. ```APIDOC ## [FileReader] abort() ### Description Aborts the current read operation and resets the result to null. ### Method abort ### Parameters None. ### Response Fires an 'abort' progress event and, if the state was 'loading', also fires a 'loadend' event. ``` -------------------------------- ### FileReader.abort() Source: https://www.w3.org/TR/FileAPI Aborts the current read operation and sets the state to DONE. ```APIDOC ## FileReader.abort() ### Description Aborts the current read operation. The state is set to DONE and the result is set to null. ### Method abort() ### Example js reader.abort(); ```