localforage blob存储本地上传图片实例页面

HTML代码：

<label class="ui-button ui-button-warning" for="fileImg">上传图片</label>
<input type="file" id="fileImg" accept="image/gif, image/jpeg, image/png" hidden> 
<p id="result"></p>
                

JS代码：

var eleResult = document.getElementById('result');
// 图片资源
var eleImg = document.createElement('img');
// 获取本地存储数据
localforage.getItem('zxxImg', function (err, value) {
    if (err == null && value) {
        eleImg.src = value;
        eleResult.appendChild(eleImg);
    }
});
// 选择本地文件
var reader = new FileReader();
// 文件base64化，以便获知图片原始尺寸
reader.onload = function(event) {
    if (!eleImg.src) {
        eleResult.appendChild(eleImg);
    }
    var blob = URL.createObjectURL(new Blob([event.target.result]));
    eleImg.src = blob;
    // blob本地存储
    localforage.setItem('zxxImg', blob);
};
// 选择的文件对象
var file = null;
document.getElementById('fileImg').addEventListener('change', function (event) {
    file = event.target.files[0];
    // 选择的文件是图片
    if (file.type.indexOf("image") == 0) {
        reader.readAsArrayBuffer(file);    
    }
});