This is the js code for downloading the file and persisting to the database:
<script type="text/javascript">
(function () {
window.indexedDB = window.indexedDB || window.webkitIndexedDB ||
window.mozIndexedDB || window.OIndexedDB ||
window.msIndexedDB;
var IDBTransaction = window.IDBTransaction ||
window.webkitIDBTransaction ||
window.OIDBTransaction ||
window.msIDBTransaction;
var dbVersion = 1.0;
var indexedDB = window.indexedDB;
var dlStatusText = document.getElementById("fetchstatus");
// Create/open database
var request = indexedDB.open("Syafunda_Videos", dbVersion),
db,
createObjectStore = function (dataBase) {
dataBase.createObjectStore("Videos",{ keyPath: "id", autoIncrement:true });
},
getVideoFile = function () {
var xhr = new XMLHttpRequest(),
blob;
// Get the Video file from the server.
xhr.open("GET", "<?php echo $name ?>", true);
xhr.responseType = "blob";
xhr.addEventListener("load", function () {
if (xhr.status === 200) {
blob = xhr.response;
addVideoInDb(blob);
dlStatusText.innerHTML = "DOWNLOAD COMPLETE: Video file downloaded.";
}
else {
dlStatusText.innerHTML = "ERROR: Unable to download video.";
}
}, false);
xhr.send();
},
addVideoInDb = function (blob) {
var transaction = db.transaction(["Videos"], "readwrite");
var add = transaction.objectStore("Videos").put(blob);
//console.log(objectStore.autoIncrement);
};
request.onerror = function (event) {
console.log("Error creating/accessing IndexedDB database");
};
request.onsuccess = function (event) {
console.log("Success creating/accessing IndexedDB database");
db = request.result;
db.onerror = function (event) {
console.log("Error creating/accessing IndexedDB database");
};
getVideoFile();
}
// For future use. Currently only in latest Firefox versions
request.onupgradeneeded = function (event) {
createObjectStore(event.target.result);
};
})();</script>
I'm trying to retrieve files from indexedDB. I keep on getting that error in the console:This is the js code for retrieving files from the databas,this is where I am getting the error:
Uncaught TypeError: Failed to execute 'createObjectURL' on 'URL': No function was found that matched the signature provided. at IDBRequest.transaction.objectStore.get.onsuccess)
Where am I going wrong? Here is a snippet of my JS code. Some pointers would be great:
<script type="text/javascript">
(function () {
// IndexedDB
window.indexedDB = window.indexedDB || window.webkitIndexedDB ||
window.mozIndexedDB || window.OIndexedDB ||
window.msIndexedDB,
IDBTransaction = window.IDBTransaction ||
window.webkitIDBTransaction ||
window.OIDBTransaction || window.msIDBTransaction,
dbVersion = 1.0;
var indexedDB = window.indexedDB;
// Create/open database
var request = indexedDB.open("Syafunda_Videos");
request.onerror = function (event) {
// Failed to Open the indexedDB database
};
request.onsuccess = function (event) {
db = request.result;
// Open a transaction to the database
var transaction = db.transaction(["Videos"], "readwrite");
//Retrieve the video file
transaction.objectStore("Videos").get("2").onsuccess =
function (event) {
var videoFile = event.target.result;
var URL = window.URL || window.webkitURL;
var videoURL = URL.createObjectURL(videoFile);
// Set video src to ObjectURL
var videoElement = document.getElementById("Video");
videoElement.setAttribute("src", videoURL);
var mimeDisplayElement = document.getElementById("vidMimeDisplay");
mimeDisplayElement.innerHTML = videoFile.type;
};
}
})();
</script>
on getting the video,i changed: get("2") to get(2) like so
//Retrieve the video file
transaction.objectStore("Videos").get(2).onsuccess =
function (event) { //code...}