El tutorial está realizado con jQuery, pero fácilmente se puede mirar a JS Vanilla
En el PHP archivoExcel.php:
<?php
header('Content-type: application/vnd.ms-excel');
header("Content-Disposition: attachment; filename=Movimientos.xls");
header("Pragma: no-cache");
header("Expires: 0");
?>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<table>
<tbody>
<tr><th>Salidas</th></tr>
<tr>
<td>Dato 1</td>
<td>Dato 2</td>
<td><?= $_POST['variable1']; ?></td>
</tr>
</tbody>
</table>Explicaciones:
- Se puede apreciar que le ponemos Filename al php, pero realmente no lo vamos a usar, donde se asigna el nombre será en el JS.
- Se puede acceder al archivo ejm: localhost/archivoExcel.php, en caso de no usar el $_POST va a descargarlo sin problema, pero el tutorial que vamos a usar es en base a ajax.
- No olvidar la etiqueta meta, sino tendremos problemas con las Tildes y Eñes del formato español.
Ahora la mejor parte que hace toda la magia en el JS
function obtenerExcel(){
$.ajax({url: 'php/ventas/guardarReporteCuadreCajaExcel.php',
type: 'POST',
cache: false,
data: {
variable1: 'HOLA MUNDO'
}}).success(function(data) {
const fileName = `Cuadre_Caja_${moment().format('YYYYMMDD_hmm')}.xls`
if (window.navigator.msSaveOrOpenBlob) {
window.navigator.msSaveBlob(res, fileName)
} else {
const downloadLink = window.document.createElement('a')
downloadLink.href = window.URL.createObjectURL(new Blob([data]), { type: 'data:application/vnd.openxmlformats-officedocument.spreadsheetml.sheet' })
downloadLink.download = fileName
document.body.appendChild(downloadLink)
downloadLink.click()
document.body.removeChild(downloadLink)
}
});
Llamamos o ejecutamos esa función, enviándole la data en este caso variable1 vía POST.
Se puede obtener también por vía GET, solo que POST no tiene límite. Get sólo permite hasta 2.083 caracteres por URL, imagínate si quieres pasar una tabla entera de 500 registros. No se puede, por eso se hizo el tutorial para que sea con POST.
En mi caso llamo al archivo incluido la fecha junta para que no exista duplicidad en archivos, esto lo logro con la librería de MomentJs.
Al abrir el archivo Excel nos saldrá una advertencia, aparentemente los archivos descargados de internet vienen con vulnerabilidades pero este no es el caso. Así que le damos en Sí
Finalmente tenemos nuestro archivo de Excel
