Retrieve stored file from IndexedDB and create an ObjectURL

retrieve-indexeddb-file-create-object-url.js

// Retrieve the file that was just stored
transaction.objectStore("elephants").get("image").onsuccess = function (event) {
    var imgFile = event.target.result;
    console.log("Got elephant!" + imgFile);

    // Get window.URL object
    var URL = window.URL || window.webkitURL;

    // Create and revoke ObjectURL
    var imgURL = URL.createObjectURL(imgFile);

    // Set img src to ObjectURL
    var imgElephant = document.getElementById("elephant");
    imgElephant.setAttribute("src", imgURL);

    // Revoking ObjectURL
    URL.revokeObjectURL(imgURL);
};

Great work! Your tutorial has been very helpful!

You may want to change this so that the URL is only revoked on load, otherwise, it may invalidate the URL before the image can be used.
imgElephant.onload = function () {
URL.revokeObjectURL(imgURL);
};