Question

我在Safari版本10.1.2上的IndexedDB中存储blob时遇到问题（在IOS上也面临同样的问题）。

我正在使用angular2-indexeddb模块包装器，但是 - 我不认为这是模块的问题。我的代码在Chrome中工作正常，但是当尝试在Safari indexedDb中放置blob对象时，记录始终显示为“null”（请参阅FileData字段）：

我尝试了各种不同的blob文件（音频，视频，HTML），它们总是显示为“null”。插入此记录时，IndexedDb不会返回任何（可见）错误。

从我读过的内容 - Safari应该支持blob。我认为问题可能与blob的创建方式有关？也许Safari不喜欢blob数据？

下面是我的代码示例（我在这里没有包含太多内容，如果需要更多信息，请告诉我们）：

      // create blob:
      const aFileParts = ['<a id="a"><b id="b">foo!</b></a>'];
      const oMyBlob = new Blob(aFileParts, {type : 'text/html'});

      console.log('blob type' + oMyBlob.type); // outputs as 'text/html'

      // initialize my indexeddb store:
      return this.initializeStores().then(() => {

        // add 'oMyBlob' to the FileData data store:
        return this.db.add('FileData',
          { FileName: 'foo', FileData: oMyBlob, FileType: 'audio' }).then(() => {

            // Success
            console.log('added ' + 'foo' + ' to FileData store.');

            // Get the file from the FileData store
            return this.db.getByIndex('FileData', 'FileName', 'foo').then((record) => {
              return Promise.resolve();
            });

          }, (error) => {
            console.log(error);
            this.handleError(error)
            return Promise.reject(error);
          });
      }, (error) => {
        this.handleError(error);
        return Promise.reject(error);
      });

作为旁注 - 我可以将这些数据作为ArrayBuffer存储在Safari IndexedDB中而不会出现任何问题。问题是，当我从数据库中检索它时，我必须将其转换回blob（所需的额外处理能力并不理想）。

非常感谢任何帮助。

Answer 1

所以我设法找到了问题的原因。在创建我的商店时，我引用了一个不正确的索引（主要是因为我正在关注在线教程）

const objectDataStore = evt.currentTarget.result.createObjectStore(
    'FileData', { keyPath: 'id', autoIncrement: true });

keypath＆＃39; id＆＃39;我的商店里面不存在。这导致了保存blob时的问题（奇怪的是没有报告错误......并且它似乎不会导致chrome问题）。

正确的代码：

const objectDataStore = evt.currentTarget.result.createObjectStore(
    'FileData', { keyPath: 'FileName', autoIncrement: true });

＆＃39;文件名＆＃39;是我的商店对象中的属性的名称。现在，这解决了桌面版Safari的问题。所以这里的教训是确保KeyPath正确。

然而，我现在面临一个新问题。在IOS Safari上，blob无法持久保存到indexedDb。我收到以下错误：

error: DOMError {name: "UnknownError", message: "An unknown error occurred within Indexed Database."}

因此看起来IOS Safari上的indexedDb不支持blob（我假设这是一个错误）。现在我只存储ArrayBuffers而不是blob。

Answer 2

是的，我可以确认在iOS Safari版本11.2.6上，IndexedDB无法将Blob存储为值。

我写了一小段代码来存储String值，它可以工作。如果我注释掉String并用Blob替换它，使用完全相同的代码，Safari会出现“未知错误”

{name：“UnknownError”，消息：“索引数据库中发生未知错误。”}

也许在存储之前尝试将Blob转换为ArrayBuffer。

Answer 3

如果iOS / OSX上的indexedDb仍然存在问题，请不要使用自动增量功能，因为这是Safari中的错误。

无法在Safari上的IndexedDB中存储Blob类型

3 个答案: