Eiji Kitamura
Chrome Dev에서 IndexedDB의 Blob 지원이 출시되었습니다.
IndexedDB API가 Blob을 Base64 문자열로 변환하지 않고도 Blob을 저장하고 검색할 수 있도록 하는 Chrome에서 오래 기다려온 기능입니다.
IndexedDB는 대부분의 최신 브라우저에서 사용할 수 있는 대규모 키-값 유형 영구 저장소를 제공합니다 (Safari는 iOS8 및 Mac OS X 10.10에서 지원될 예정). 구현 상태를 확인합니다.
Blob은 최신 JavaScript 엔진에서 처리할 수 있는 파일과 같은 바이너리 객체입니다. 파일 객체는 Blob에서 상속됩니다. XMLHttpRequest를 통해 이미지와 파일을 Blob으로 가져올 수도 있습니다. 구현 상태를 확인합니다.
IndexedDB에 Blob 저장
IndexedDB에서 Blob 가용성을 기능 감지할 방법은 없습니다. 기본적으로 try-catch를 실행한 후 Blob을 사용할 수 없는 경우 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);
}
IndexedDB의 Blob 지원은 이미 Firefox 및 Internet Explorer에서도 사용할 수 있습니다. Safari 지원을 조사해야 합니다.
도움이 되기를 바랍니다.