Прочитать содержание запроса

Question

Когда я делаю запрос к серверу, он возвращает поток zip

const response = await axios.get('http://192.168.1.100:3030', {
    params: this.getParams(),
    responseType: 'blob' 
});

console.log(response.data);

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

PK ¥ZksÛÆ=³þ~ç§N;1  d2Ã,S!EÔ_2­¦ÎÈ+Ûéã×ö§ôîÙ%........

Однако ожидаемое значение будет

Lorem Ipsum is simply dummy text of the printing and typesetting industry.

. Я обнаружил, что этот пример похож.Но это не работает для меня: Распакуйте gzip и строку zlib в javascript

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

Answer 1

Как уже упоминали другие, вам нужно распаковать zip на стороне клиента, чтобы увидеть содержимое zip. Для браузера blob - это просто набор двоичных данных без какого-либо значения. Если вы внимательно посмотрите на результат, вы получите:

PK ¥ ZksÛÆ = ³þ ~ ç§N; 1

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

Довольно популярная библиотека Javascript для операций с zip-файлами: JSZip .

Вот пример, который загружает zip-файл, содержащий JqueryUI (из-за ограничений CORS мы должны получить его через прокси - yacdn.org). После успешной загрузки JSZip используется для получения списка файлов внутри zip-архива. Это делается с помощью метода loadAsync JSZip и передачи ему большого двоичного объекта в качестве параметра.

 zip.loadAsync(response.data).then(function(contents) {
   console.log(Object.keys(contents.files));
 });

Возвращенный массив файлов содержит текстовый файл jquery-ui-1.12.1 / AUTHORS.txt Если мы хотим увидеть реальный файл - и поскольку вы пытались просмотреть текстовый файл - нам понадобится еще немного кода.

contents.files["jquery-ui-1.12.1/AUTHORS.txt"].async("string").then(function(data) {
      console.log(data);
    });

Полный код:

async function loadZip() {
  const response = await axios.get('https://yacdn.org/serve/https://jqueryui.com/resources/download/jquery-ui-1.12.1.zip', {
    responseType: 'blob'
  });

  var zip = new JSZip();
  zip.loadAsync(response.data).then(function(contents) {
    console.log(Object.keys(contents.files));
    contents.files["jquery-ui-1.12.1/AUTHORS.txt"].async("string").then(function(data) {
      console.log(data);
    });
  });
}
loadZip();

<script src="https://unpkg.com/axios/dist/axios.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jszip/3.2.0/jszip.min.js"></script>