Chrome Dev รองรับ Blob ใน IndexedDB แล้ว
นี่เป็นฟีเจอร์ที่รอคอยกันมานานสำหรับ Chrome ซึ่งช่วยให้ IndexedDB API จัดเก็บและเรียกดู Blob ได้โดยไม่ต้องแปลงเป็นสตริง Base64
IndexedDB มีพื้นที่เก็บข้อมูลแบบคีย์-ค่าขนาดใหญ่แบบถาวรที่ใช้ได้ในเบราว์เซอร์สมัยใหม่ส่วนใหญ่ (ดูเหมือนว่า Safari จะรองรับใน iOS8 และ Mac OS X 10.10) ตรวจสอบสถานะการติดตั้งใช้งาน
Blob คือออบเจ็กต์ไบนารีที่มีลักษณะคล้ายไฟล์ซึ่งเครื่องมือ JavaScript สมัยใหม่จัดการได้ ออบเจ็กต์ไฟล์จะรับค่ามาจาก Blob นอกจากนี้ คุณยังเรียกข้อมูลรูปภาพและไฟล์เป็น Blob ผ่าน XMLHttpRequest ได้ด้วย ตรวจสอบสถานะการติดตั้งใช้งาน
การจัดเก็บ BLOB ใน IndexedDB
ไม่สามารถตรวจหาความพร้อมใช้งานของ Blob ใน IndexedDB โดยพื้นฐานแล้ว คุณต้องใช้ 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);
}
การรองรับ Blob สำหรับ IndexedDB มีให้บริการใน Firefox และ Internet Explorer อยู่แล้ว ต้องมีการตรวจสอบการสนับสนุนของ Safari
ขอให้สนุกกับการรับชม