IndexedDB: Храните файл в виде файла или Blob или ArrayBuffer. Каков наилучший вариант?

Теперь большинство браузеров поддерживают IndexedDB для хранения данных/файлов непосредственно как Файл, Blob или ArrayBuffer.

Этот код сохраняет ключ IDB 'File1' как Файл

<input type="file" id="userfile" />
var a = document.getElementById("userfile");
var b = a.files[0];

Теперь мы можем напрямую сохранить этот файл в IDB, используя следующий код

//LocalForage is a library for indexedDB developed by Mozilla
//Note: localforage._config.driver=asyncStorage (IDB method)
function run(){
  //"File1" = IDB data table key and b=value
  localforage.setItem("File1", b, function(err, value) {
    console.log(err)
  });
}

a.onchange = function(){
  run()
}

Этот код сохраняет ключ IDB 'BlobFile' как Blob

mb = new Blob([b],{type:b.type});

function runB(){
  localforage.setItem("BlobFile", mb, function(err, value){
    console.log(err)
  });    
}

a.onchange = function(){
  runB()
}

Я хочу знать, что лучше всего хранить файл в IDB. (File/Blob/ArrayBuffer)

Файлы могут быть изображениями или изображениями небольшого размера.

Ответы

Ответ 1

Я рекомендую использовать Blob для изображений и видео, поскольку API достаточно прост для загрузки в качестве blob и сохранения в db, а также для извлечения из db и создания URL-адреса для атрибута src

Проверьте этот пример здесь для реализации https://hacks.mozilla.org/2012/02/storing-images-and-files-in-indexeddb/

Ответ 2

Это спорный вопрос, но есть некоторые строки, которые мы можем здесь сделать, я цитирую MDN здесь:

Интерфейс File основан на Blob, наследует функциональность blob и расширяет ее для поддержки файлов в пользовательской системе.

так между файлом и блобом, это вопрос необходимой функциональности (я предпочитаю blob, поскольку это немного более удобно).

теперь между blob и ArrayBuffer, этот сложный процесс, поскольку он полностью зависит от того, что вам нужно, ArrayBuffer очень полезен в некоторых случаях, но он структурирован и он

контейнер с фиксированной длиной для двоичных данных

поэтому размер вашего файла может иметь огромное значение.

Другая важная точка: ArrayBuffer находится в памяти, в то время как blob может быть любым, где, на диске или в памяти, поэтому с использованием blob вы можете значительно сократить количество голов. поэтому для вашего дела, imho, blob выигрывает.

теперь на стороне заметки, я не знаю, что вы пытаетесь сделать точно, но сохранение всего файла в db не является хорошей идеей, если ваша цель не индексирует весь контент файла и не запрашивает его, не все пользовательские устройства могут обрабатывать этот тип перегрузки, поэтому, если вам не нужен контент, индексируйте имена файлов только, это экономит время и пространство для хранения.

Надеюсь, это поможет.