我想在JavaScript中将文件内容(带blob)放在localstorage中。但Firefox上的本地存储限制为5MB,只有Firefox和Opera可以增加Dom存储(localstorage)的大小。我已成功将视频文件存储在localstorage上:
var urlVideo = "sample.mp4";
var videoStorage = localStorage.getItem("sample.mp4");
var videoElement = document.getElementById("video");
var videoSource = document.getElementById("source");
if (videoStorage)
{
// Loaded from localstorage
videoElement.setAttribute("src", videoStorage);
}
else
{
// Loaded online
var xhr = new XMLHttpRequest(),
blob,
fileReader = new FileReader();
xhr.open("GET", urlVideo, true);
xhr.responseType = "arraybuffer";
xhr.addEventListener("load", function () {
if (xhr.status === 200) {
blob = new Blob([xhr.response], { type: "video/mp4" });
fileReader.onload = function (evt) {
var result = evt.target.result;
try {
localStorage.setItem("sample.mp4", result);
}
catch (e) {
console.log("Failed : " + e);
}
};
fileReader.readAsDataURL(blob);
videoElement.src = window.URL.createObjectURL(blob);
}
}, false);
xhr.send();
}
所以我希望在JavaScript中有一个简单的方法,可以在每个浏览器上本地存储大文件内容,而无需浏览器设置。所以我听说使用indexedDB是可能的,但似乎更复杂。