2

Tengo una aplicacion en php, la cual desde el backend genera un archivo excel, segun el departamento que se consulte. Este se genera sin problemas utilizando PhpSpreadsheet. Dejo parte del final del codigo para que sepan como se exporta:

...
$extension = 'Xlsx';
$writer = \PhpOffice\PhpSpreadsheet\IOFactory::createWriter($reporte, $extension);
header('Content-Type: application/vnd.openxmlformats-officedocument.spreadsheetml.sheet');
header("Content-Disposition: attachment; filename=\"".$nombreArchivo."\"");
// Limpiamos Buffer
ob_end_clean();
$writer->save('php://output');
exit;

El detalle, es que ahora necesito poder recibir ese archivo excel desde el backend con javascript a traves de fetch y poder descargarlo.

Probe usando una fetch, el cual envio a traves de post el departamento a consultar, dejo mi codigo:

datos = new FormData();
datos.append('departamento', departamento);

fetch(url,
{
    method: "POST",
    body: datos
})
.then(response => response.text())
.then(data => {
    console.log(data);
})

El console.log me devuelve lo siguiente:

introducir la descripción de la imagen aquí

Mi asunto hasta aqui, es ver de que forma puedo transformar eso en un archivo excel u otro metodo fetch con el cual pueda descargarlo.

Trate usando window.location, pero los navegadores bloquean las ventanas emergentes.

1 respuesta 1

3

Para poder descargarlo desde el cliente debes usar get ,y en php solo retornas el documento

 const downLoadFormat = () => {
        let routeDownload =url;
    
        
        var form = document.createElement("form");
        form.setAttribute("method", "get");
        form.setAttribute("action", routeDownload);
    
        var input = document.createElement("input");
        input.type = "hidden";
        input.name = "departamento";
        input.value = departamento;
        form.appendChild(input);
       document.body.appendChild(form);
        form.submit();
     document.body.removeChild(form);
      };

otra forma es recibiendo un blob desdepues de hacer la petición, donde data es el ecxel que retorno tu php, muy importante tu peticion al php debe especificar que la respuesta es tipo blob

 responseType: "blob", // important

ya despues de hacer la petición y esperando un blob asi se descargaria.

const url = window.URL.createObjectURL(new Blob([data]));
        const link = document.createElement("a");
        link.href = url;
        link.setAttribute("download", moment().format('Y-m-dhm:s')+"departamento.xls");
        document.body.appendChild(link);
        link.click();
2
  • 1
    Muchas gracias amigo! Justamente hice el cambio para recibir un blob y ahora puedo descargarlo!
    – Oriel
    el 11 feb. 2022 a las 22:45
  • me alegra que te sirva Oriel el 14 feb. 2022 a las 12:59

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.