Playground for blob-util

Welcome to the docs and playground for blob-util!

Below you'll find API documentation, as well as a little Kirby GIF you can play around with.

Kirby

Here's some code to get you started. Copy-paste this into your console:


var img = document.getElementById('kirby');

blobUtil.imgSrcToBlob(img.src).then(function (blob) {
  var blobURL = blobUtil.createObjectURL(blob);

  var newImg = document.createElement('img');
  newImg.src = blobURL;

  img.parentNode.appendChild(newImg);
});

If you see two Kirbys, you're on your way!

Methods

arrayBufferToBlob(buffer, type) → {Promise}

Convert an ArrayBuffer to a Blob. Returns a Promise.
Parameters:
Name Type Description
buffer ArrayBuffer
type string | undefined the content type (optional)
Source:
Returns:
Promise that resolves with the Blob
Type
Promise

base64StringToBlob(base64, type) → {Promise}

Convert a base64-encoded string to a Blob. Returns a Promise.
Parameters:
Name Type Description
base64 string
type string | undefined the content type (optional)
Source:
Returns:
Promise that resolves with the Blob
Type
Promise

binaryStringToBlob(binary, type) → {Promise}

Convert a binary string to a Blob. Returns a Promise.
Parameters:
Name Type Description
binary string
type string | undefined the content type (optional)
Source:
Returns:
Promise that resolves with the Blob
Type
Promise

blobToArrayBuffer(blob) → {Promise}

Convert a Blob to an ArrayBuffer. Returns a Promise.
Parameters:
Name Type Description
blob Blob
Source:
Returns:
Promise that resolves with the ArrayBuffer
Type
Promise

blobToBase64String(blob) → {Promise}

Convert a Blob to a binary string. Returns a Promise.
Parameters:
Name Type Description
blob Blob
Source:
Returns:
Promise that resolves with the binary string
Type
Promise

blobToBinaryString(blob) → {Promise}

Convert a Blob to a binary string. Returns a Promise.
Parameters:
Name Type Description
blob Blob
Source:
Returns:
Promise that resolves with the binary string
Type
Promise

canvasToBlob(canvas, type) → {Promise}

Convert a canvas to a Blob. Returns a Promise.
Parameters:
Name Type Description
canvas string
type string | undefined the content type (optional, defaults to 'image/png')
Source:
Returns:
Promise that resolves with the Blob
Type
Promise

createBlob(parts, options) → {Blob}

Parameters:
Name Type Description
parts Array content of the Blob
options Object usually just {type: myContentType}
Source:
Returns:
Type
Blob

createObjectURL(blob) → {string}

Shim for URL.createObjectURL() to support browsers that only have the prefixed webkitURL (e.g. Android <4.4).
Parameters:
Name Type Description
blob Blob
Source:
Returns:
url
Type
string

dataURLToBlob(dataURL) → {Promise}

Convert a data URL string (e.g. 'data:image/png;base64,iVBORw0KG...') to a Blob. Returns a Promise.
Parameters:
Name Type Description
dataURL string
Source:
Returns:
Promise that resolves with the Blob
Type
Promise

imgSrcToBlob(src, type, crossOrigin) → {Promise}

Convert an image's src URL to a Blob by loading the image and painting it to a canvas. Returns a Promise.

Note: this will coerce the image to the desired content type, and it will only paint the first frame of an animated GIF.

Parameters:
Name Type Description
src string
type string | undefined the content type (optional, defaults to 'image/png')
crossOrigin string | undefined for CORS-enabled images, set this to 'Anonymous' to avoid "tainted canvas" errors
Source:
Returns:
Promise that resolves with the Blob
Type
Promise

imgSrcToDataURL(src, type, crossOrigin) → {Promise}

Convert an image's src URL to a data URL by loading the image and painting it to a canvas. Returns a Promise.

Note: this will coerce the image to the desired content type, and it will only paint the first frame of an animated GIF.

Parameters:
Name Type Description
src string
type string | undefined the content type (optional, defaults to 'image/png')
crossOrigin string | undefined for CORS-enabled images, set this to 'Anonymous' to avoid "tainted canvas" errors
Source:
Returns:
Promise that resolves with the data URL string
Type
Promise

revokeObjectURL(url)

Shim for URL.revokeObjectURL() to support browsers that only have the prefixed webkitURL (e.g. Android <4.4).
Parameters:
Name Type Description
url string
Source: