Редактирование файлов в zip-папке исключительно в браузере с использованием zip.js - PullRequest
Новая
       54

Редактирование файлов в zip-папке исключительно в браузере с использованием zip.js

0 голосов
/ 20 декабря 2018

Я хочу редактировать содержимое нескольких текстовых файлов, хранящихся в zip-папке, используя zip.js.Это необходимо сделать исключительно в веб-браузере, не загружая zip-папку на внутренний сервер.

Это оказалось довольно сложной задачей, особенно из-за необходимого количества функций обратного вызова.Мне удалось открыть zip-папку и распечатать содержимое всех текстовых файлов, содержащихся в ней, но я не могу понять, как открыть текстовый файл, отредактировать содержимое, а затем сохранить файл в zip-файле.папка снова.Кроме того, я хочу сделать это для всех текстовых файлов в zip-папке.

Самым простым, вероятно, является просмотр кода в GitHub .Просто клонируйте его и откройте индексный файл, чтобы проверить его.

Где мне не хватает, решение находится в этом разделе кода, который можно найти в file-converter2.js : 

function addFile(filename, content) {
  zip.createWriter(new zip.BlobWriter(), function(writer) {
    // use a TextReader to read the String to add
    writer.add(filename, new zip.TextReader(content), function() {
      // onsuccess callback
      // close the zip writer
      writer.close(function(blob) {
        // HOW TO SAVE BACK INTO ZIP HERE?
      });
    });
  }, handleInProgress, onerror);
}

Здесь я редактируютекстовый файл, но я не знаю, как сохранить отредактированный файл обратно в zip-папку (перезаписывая старый контент).Чтобы иметь возможность редактировать, мне сначала нужно прочитать содержимое текстового файла, прежде чем редактировать содержимое: 

function readAndEditBlob(el, reader, i, length, editFunc, showFileCounter = true) {
  let filename = getFilename(el);
  el.getData(new zip.TextWriter(), function(data) {
    if (DEBUG) {
      console.log('File content of zip file is:')
      console.log(data);
    }
    if (editFunc) {
      editFunc(filename, ' Hello world.'); // "editFunc" would be "addFile" in this case.
    }
    reader.close(function() {
      if (showFileCounter) { handleClose(i + 1, length); }
    });
  }, handleInProgress);
}

function readAndEditFiles(file, editFunc, showFileCounter = true) {
  zip.createReader(
    new zip.BlobReader(file), 
    function(reader) {
      reader.getEntries(function(entries) {
        let length = entries.length
        if (length) {
          entries.forEach(function(el, i) {
            readAndEditBlob(el, reader, i, length, editFunc, showFileCounter);
          });
        }
      });
    },
    onerror
  );
}

Прямо сейчас мой код может перебирать все файлы в zip-файле.папку и распечатайте содержимое текстовых файлов, содержащихся в нем.Мне также удалось создать блоб с отредактированным контентом, но я не могу найти способ сохранить эти изменения обратно в zip-папку.

Скажем, у меня есть zip-папка, содержащая некоторые файлы с контентом:

test.zip /
test1.txt # Содержимое: это тест 1.
test2.txt # Содержимое: это тест 2.

После запуска сценария папка zip должна быть такой же, но с новым содержимым текстового файла:

test.zip /
test1.txt # Содержимое: это тест 1Привет, мир.
test2.txt # Содержание: Это тест 2. Привет, мир.

...