Saltar al contenido

Usando jQuery AJAX para descargar un archivo binario

Si hallas algún fallo en tu código o proyecto, recuerda probar siempre en un entorno de testing antes subir el código al trabajo final.

Solución:

Simplemente use XHR directamente. Este ejemplo está tomado de MDN:

var oReq = new XMLHttpRequest();
oReq.open("GET", "/myfile.png", true);
oReq.responseType = "arraybuffer";

oReq.onload = function(oEvent) 
  var arrayBuffer = oReq.response;

  // if you want to access the bytes:
  var byteArray = new Uint8Array(arrayBuffer);
  // ...

  // If you want to use the image in your DOM:
  var blob = new Blob([arrayBuffer], type: "image/png");
  var url = URL.createObjectURL(blob);
  someImageElement.src = url;

  // whatever...
;

oReq.send();

Puede configurar un transporte $.ajax para modificar la configuración como se menciona aquí: http://www.henryalgus.com/reading-binary-files-using-jquery-ajax/

// use this transport for "binary" data type

$.ajaxTransport("+binary", function (options, originalOptions, jqXHR) 
    // check for conditions and support for blob / arraybuffer response type
    if (window.FormData && ((options.dataType && (options.dataType == 'binary')) );

y luego haz tu llamada ajax:

return $.ajax(
    url: url,
    method: 'GET',
    dataType: 'binary',
    processData: 'false',
    responseType: 'arraybuffer',
    headers:  'X-Requested-With': 'XMLHttpRequest' 
).then(function (response) 
    var data = new Uint8Array(response);
    //do something with the data
    return data;
, function (error) 
    alertify.error('There was an error! Error:' + error.name + ':' + error.status)
);

Si debe usar jQuery, puede usar $.ajaxSetup() para modificar la configuración de bajo nivel.

Ejemplo:

  // Set up AJAX settings for binary files:
  $.ajaxSetup(
    beforeSend: function (jqXHR, settings) 
      if (settings.dataType === 'binary') 
        settings.xhr().responseType = 'arraybuffer';
      
    
  )

  // Make the actual call:
  let result = await $.ajax(
    url: '/api/export/data',
    type: 'GET',
    contentType: 'application/json',
    dataType: 'binary',
    processData: false,
    headers: 
      token: localStorage.token,
    ,
  );

¡Haz clic para puntuar esta entrada!
(Votos: 0 Promedio: 0)



Utiliza Nuestro Buscador

Deja una respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *