SafariのIndexedDBにBlob型を格納できません

Question

Safariバージョン10.1.2のIndexedDBにBLOBを格納する際に問題があります（これはIOSの同じ問題に直面しています）。

私はangular2-indexeddbモジュールラッパーを使用していますが、モジュール自体に問題はないと思います。私のコードは、Chromeで正常に動作サファリのIndexedDBのBlobオブジェクトを置くしようとしたときただし、レコードは常に「NULL」として表示されます（FILEDATAフィールドを参照してください）：

私は別のさまざまなを試してみましたblobファイル（オーディオ、ビデオ、HTML）は常に 'null'として表示されます。このレコードを挿入するとき、IndexedDbから（可視の）エラーは返されません。

私が読んだことから、ブロブはSafariでサポートされるはずです。問題が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); 
     }); 

：以下

は、（より多くの情報が必要な場合ので、私に知らせてください、私はあまりここに含まれていない）私のコードのサンプルですSafari IndexedDBのArrayBufferとして問題なく使用できます。問題は、dbから取得するときにこれをblobに変換する必要があることです（必要な余分な処理能力は理想的ではありません）。

ご迷惑をおかけして申し訳ありません。

Answer 1

私は問題の原因を見つけることができました。私は

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

キーパス「ID」（私はオンラインチュートリアル次られた主な理由は）間違ったインデックスを参照して私の店を作成するときに私の店の中に存在していません。これは、ブロブを保存するときに問題を引き起こしていました（奇妙なことに、エラーは報告されていませんでした...それはクロムに問題を引き起こすようには見えませんでした）。

正しいコード：

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

'FileNameは、' 私のストアオブジェクト内のプロパティの名前です。これで、デスクトップのサファリに問題が修正されました。だからここでの教訓は、KeyPathが正しいことを確認することです。

しかし、今私は新しい問題に直面しています。 IOS Safariでは、blobはindexedDbに保持されません。私は次のエラーを取得する：

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

は、だから、ブロブIOSのSafari上のIndexedDB（私はこれはバグであると仮定しています）のためにサポートされていないことが表示されます。今のところ、私はちょうどblobの代わりにArrayBuffersを格納します。