Вызов Jquery Ajax завершается ошибкой с типом данных «двоичный», потому что значение типа ответа-arraybuffer, а не текст

#jquery #ajax #xmlhttprequest #arraybuffer #responsetext

Вопрос:

Я должен выполнить вызов jquery ajax, чтобы загрузить файл. URL-адрес ссылается на метод контроллера, который возвращает HttpResponseMessage, и с этой стороны нет ни одной проблемы (код состояния 200, байт файла, все кажется в порядке).

Вот вызов ajax

 $.ajax({
  url: self.downloadAttachmentUrl,
  type: 'GET',
  cache: false,
  dataType: 'binary',
  data: {
    fileKey: fileKey,
    userId: userId
  },
  xhrFields: {
    responseType: 'arraybuffer'
  },
  beforeSend: function (xhr) {
    Object.keys(customAjaxHeaders).forEach(function (headerName) {
      var headerValue = customAjaxHeaders[headerName];
      xhr.setRequestHeader(headerName, headerValue);
    });
  },
  success: function (data, textStatus, jqXHR) {
    var fileName = self.getFileNameFromHeaders(jqXHR.getAllResponseHeaders());
    var blob = new Blob([data], { type: "application/octetstream" });
    self.downloadFile(blob, fileName)
  },
  error: function (jqXHR, textStatus, message) {
    console.error(textStatus, message);
  }
})*/
 

Этот вызов возвращает следующую ошибку

DOMException: Failed to read the 'responseText' property from 'XMLHttpRequest': The value is only accessible if the object's 'responseType' is '' or 'text' (was 'arraybuffer').

Я заметил, что если я использую «родной ajax» (так что без jQuery), я не получаю этой ошибки, но я не хочу использовать ее для обеспечения согласованности проекта (который довольно плотный).

 var headers = new Headers();

Object.keys(customAjaxHeaders).forEach(function (headerName) {
  var headerValue = customAjaxHeaders[headerName];
  headers.append(headerName, headerValue)
});

var init = {
  method: 'GET',
  headers: headers
};

var fetchUrl = self.downloadAttachmentUrl   '?'   $.param({ fileKey: fileKey, userId: userId })

fetch(fetchUrl, init)
  .then(async response => {
    var blob = await response.blob();
    var fileName = self.getFileNameFromHeaders(response.headers.get('Content-Disposition'));
    var link = document.createElement('a');
    link.href = window.URL.createObjectURL(blob);
    link.setAttribute('download', fileName);
    link.click();
  })
});
 

Есть ли способ заставить вызов jQuery ajax работать без ошибок ? Спасибо за помощь.