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 가용성을 기능을 감지할 수 있는 방법은 없습니다. 기본적으로 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);
}
IndexedDB에 대한 Blob 지원은 이미 Firefox와 Internet Explorer에서 지원됩니다. Safari 지원 여부를 조사해야 합니다.
즐거운 시간 되세요.