Подтвердить что ты не робот

Можете ли вы использовать локальное хранилище HTML5 для хранения файла? Если нет, то как?

Как сделать кеширование/управление многими большими файлами (видео) на пользовательском компьютере через механизмы браузера (плагины являются приемлемыми решениями). Из того, что я могу сказать, локальное хранилище связано с данными типа базы данных, а не с файлами.

4b9b3361

ОТВЕТЫ

Ответ 1

API FileSystem [1,2] будет лучшим выбором в будущем, и в какой-то момент это было очень кровоточащим краем. Однако он был оставлен w3c. Из собственной документации:

Работа над этим документом была прекращена, и на нее не следует ссылаться или использоваться в качестве основы для реализации.

Ответ 2

API-интерфейс HTML5 FileSystem мертв, как говорили другие. Другим вариантом является IndexedDB. См. здесь.

Ответ 3

Ответ на этот вопрос зависит от ваших ответов на следующие вопросы:

  • Вы в порядке с тем, что поддержка записи файлов в настоящее время существует только в браузерах на основе Chrome (Chrome и Opera)?
  • Вы в порядке с использованием API-интерфейсов as-of-now, чтобы воспользоваться такой возможностью?
  • Вы в порядке с возможностью удаления указанного API в будущем?
  • Вы в порядке с сужением файлов, созданных с указанным API, на песочницу (место, за пределами которого файлы не могут повлиять) на диске?
  • Вы в порядке с использованием виртуальной файловой системы (структура каталогов, которая не обязательно существует на диске в той же форме, что и при доступе из браузера) для представления таких файлов?

Если вы ответили "да" на все вышеперечисленное, затем File, FileWriter и FileSystem, вы можете читать и записывать файлы из контекста вкладки/окна браузера, используя Javascript.

Вот простые примеры того, как API используются, прямо или косвенно, в тандеме, чтобы делать такие вещи:

BakedGoods *

Записать файл:

//"SGVsbG8gd29ybGQh" is "Hello world!" encoded in Base64; raw binary data can
//also be written with the use of Typed Arrays and the appropriate mime type
bakedGoods.set({
    data: [{key: "testFile", value: "SGVsbG8gd29ybGQh", dataFormat: "text/plain"}],
    storageTypes: ["fileSystem"],
    options: {fileSystem:{storageType: Window.PERSISTENT}},
    complete: function(byStorageTypeStoredItemRangeDataObj, byStorageTypeErrorObj){}
});

Считать файл:

bakedGoods.get({
        data: ["testFile"],
        storageTypes: ["fileSystem"],
        options: {fileSystem:{storageType: Window.PERSISTENT}},
        complete: function(resultDataObj, byStorageTypeErrorObj){}
});

Использование необработанных файлов, API FileWriter и FileSystem

Записать файл:

function onQuotaRequestSuccess(grantedQuota)
{

    function saveFile(directoryEntry)
    {

        function createFileWriter(fileEntry)
        {

            function write(fileWriter)
            {
                //"SGVsbG8gd29ybGQh" is "Hello world!" encoded in Base64;
                //raw binary data can also be written with the use of 
                //Typed Arrays and the appropriate mime type
                var dataBlob = new Blob(["SGVsbG8gd29ybGQh"], {type: "text/plain"});
                fileWriter.write(dataBlob);              
            }

            fileEntry.createWriter(write);
        }

        directoryEntry.getFile(
            "testFile", 
            {create: true, exclusive: true},
            createFileWriter
        );
    }

    requestFileSystem(Window.PERSISTENT, grantedQuota, saveFile);
}

var desiredQuota = 1024 * 1024 * 1024;
var quotaManagementObj = navigator.webkitPersistentStorage;
quotaManagementObj.requestQuota(desiredQuota, onQuotaRequestSuccess);

Считать файл:

function onQuotaRequestSuccess(grantedQuota)
{

    function getfile(directoryEntry)
    {

        function readFile(fileEntry)
        {

            function read(file)
            {
                var fileReader = new FileReader();

                fileReader.onload = function(){var fileData = fileReader.result};
                fileReader.readAsText(file);             
            }

            fileEntry.file(read);
        }

        directoryEntry.getFile(
            "testFile", 
            {create: false},
            readFile
        );
    }

    requestFileSystem(Window.PERSISTENT, grantedQuota, getFile);
}

var desiredQuota = 1024 * 1024 * 1024;
var quotaManagementObj = navigator.webkitPersistentStorage;
quotaManagementObj.requestQuota(desiredQuota, onQuotaRequestSuccess);

Так как вы также открыты для не-родных (plug-in based) решений, вы можете воспользоваться возможностью ввода/вывода файлов в Silverlight в IsolatedStorage, доступ к которому предоставляется через Silverlight.

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

Конечно, решение, которое использует дополнительный управляемый код, оставляя его только с Javascript для записи, вполне входит в сферу этого вопроса;):

//Write file to first of either FileSystem or IsolatedStorage
bakedGoods.set({
    data: [{key: "testFile", value: "SGVsbG8gd29ybGQh", dataFormat: "text/plain"}],
    storageTypes: ["fileSystem", "silverlight"],
    options: {fileSystem:{storageType: Window.PERSISTENT}},
    complete: function(byStorageTypeStoredItemRangeDataObj, byStorageTypeErrorObj){}
});

* BakedGoods поддерживается не кем иным, как этим парнем прямо здесь:)

Ответ 5

Хорошо объясняется большая часть локального хранилища html5.

здесь fooobar.com/questions/256295/... был аналогичный вопрос, а не о видео, но если вы можете добавить xml в локальное хранилище.

Я упомянул статью в своем ответе в статье. javascript используется для синтаксического анализа xml для локального хранилища и для его запроса в автономном режиме.

Можете помочь вам.

Ответ 6

FSO.js обернет вам API-интерфейс HTML5 FileSystem, что упростит хранение, управление и управление наборами больших файлов в изолированная файловая система.