Safari의 IndexedDB에 Blob 유형을 저장할 수 없습니다.

Question

Safari 버전 10.1.2의 IndexedDB에 BLOB를 저장하는 데 문제가 있습니다 (IOS에서도 동일한 문제가 있음).

나는 angular2-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); 
     }); 

: 아래

(자세한 정보가 필요하면 그렇게 알려 주시기 바랍니다, 내가 너무 여기에 포함되지 않은) 내 코드의 샘플입니다 사파리 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 }); 

'파일 이름은'내 저장소 개체에서 속성의 이름입니다. 이제 데스크톱 사파리에서 문제가 해결됩니다. 따라서 여기서의 교훈은 KeyPath가 올바른지 확인하는 것입니다.

그러나 이제 새로운 문제가 발생합니다. IOS Safari에서 blob은 indexedDb에 지속되지 않습니다. 나는 다음과 같은 오류가 발생합니다 :

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

는 그래서 모양이 IOS 사파리에 색인화 (난이 버그가 있으리라 믿고있어) 지원되지 않습니다 것으로 보인다. 지금은 그냥 blob 대신 ArrayBuffers를 저장합니다.