Chrome Dev 可为 IndexedDB 提供 Blob 支持

Chrome 开发者版已支持 IndexedDB 上的 Blob。

这是 Chrome 用户期待已久的功能,它让 IndexedDB API 能够存储和检索 Blob,而无需将其转换为 Base64 字符串。

IndexedDB 提供可在大多数现代浏览器上使用的大规模键值对类型永久存储空间(Safari 显然将在 iOS8 和 Mac OS X 10.10 中提供支持)。查看其实施状态

Blob 是一种类似文件的二进制对象,新型 JavaScript 引擎可以处理。文件对象继承自 Blob。您还可以通过 XMLHttpRequest 以 Blob 的形式提取图片和文件。查看其实施状态

在 IndexedDB 中存储 Blob

无法在 IndexedDB 中使用功能检测 Blob 可用性。基本上,您必须使用 try-catch 方法,然后使用字符串(如果 Blob 不可用)。以下是一些代码示例:

// Create an example Blob object
var blob = new Blob(['blob object'], {type: 'text/plain'});

try {
    var store = db.transaction(['entries'], 'readwrite').objectStore('entries');

    // Store the object  
    var req = store.put(blob, 'blob');
    req.onerror = function(e) {
        console.log(e);
    };
    req.onsuccess = function(event) {
        console.log('Successfully stored a blob as Blob.');
    };
} catch (e) {
    var reader = new FileReader();
    reader.onload = function(event) {
        // After exception, you have to start over from getting transaction.
        var store = db.transaction(['entries'], 'readwrite').objectStore('entries');

        // Obtain DataURL string
        var data = event.target.result;
        var req = store.put(data, 'blob');
        req.onerror = function(e) {
            console.log(e);
        };
        req.onsuccess = function(event) {
            console.log('Successfully stored a blob as String.');
        };
    };
    // Convert Blob into DataURL string
    reader.readAsDataURL(blob);
}

Firefox 和 Internet Explorer 也已支持 IndexedDB 的 Blob。需要调查 Safari 支持情况。

尽情享用吧!