Que había creado puesto de forma en PHP, donde el clic en el botón que estaba descargando un archivo de Excel y tuve algunos datos del formulario también registraron a la URL y archivo utilizado para descargar correctamente con HTML plano y enviar el formulario
En PHP esta función se activa cuando el formulario se ha publicado en el archivo
public function downloadExcel($fileName = '', $addTimeStamp = true) {
$fileName = (!$fileName) ? 'excel_download' : preg_replace('/\s+/', '_', $fileName);
if ($addTimeStamp) {
$fileName .= date('_d_m_Y_H_i_s');
}
$fileName .= '.xlsx';
$this->setActiveSheetIndex(0);
header('Content-Type: application/vnd.openxmlformats-officedocument.spreadsheetml.sheet');
header('Content-Disposition: attachment;filename="' . $fileName . '"');
header('Cache-Control: max-age=0');
header('Cache-Control: max-age=1');
header('Expires: Mon, 26 Jul 1997 05:00:00 GMT');
header('Last-Modified: ' . gmdate('D, d M Y H:i:s') . ' GMT');
header('Cache-Control: cache, must-revalidate');
header('Pragma: public');
$objWriter = PHPExcel_IOFactory::createWriter($this, 'Excel2007');
$objWriter->save('php://output');
}
Cuando estaba trabajando, tengo debajo de lo establecido en la solicitud encabezados
Y no era nada mostrando en la respuesta
Pero ahora estamos tratando de migrar frontend al marco angular de la que somos capaces de descargar el archivo, he tratado de su camino
downloadTheExport() {
this.downloadfile().subscribe((blob: any) => {
const blobdownload = new Blob([blob], { type: "application/vnd.ms-excel;charset=utf-8" });
saveAs(blobdownload, 'testdata.xls');
});
}
downloadfile(){
const formDataForExport: FormData = new FormData();
formDataForExport.append('export', 'ALL');
return this.http.post('http://localhost:8080/service/exportExcel.php', formDataForExport, {
headers: { 'Accept': 'text/html,application/xhtml+xml,application/xml;q=0.9,image/webp,image/apng,*/*;q=0.8,application/signed-exchange;v=b3;q=0.9' }
});
}
Y Cuando estoy intentando descargar en angular he observado que cuando la llamada se hace en angular parece cabecera Solicitud de Content-Type se cambia a Content-Type: multipart/form-data; boundary angular
, y también cuando veo en la pestaña de respuesta que muestra algunos datos de la siguiente manera.
¿Puede usted ayudarme por favor a cómo lograr una descarga en angular en esta situación
Es correcto para el Content-Type
en su encabezado de solicitud , ya que de hecho publicar una formDataForExport a través de php backend.
Pero la manera de manejar la respuesta parece mal. Propongo una solución por debajo de ayuda de mayo:
Suponiendo que si se hace referencia este fileSaver:
https://github.com/Hipparch/file-saver-typescript/blob/master/file-saver.ts
Recomendar a incluir script de arriba y utilizarlo para manejar desde diferentes comportamiento del navegador en el ahorro de archivos que se encuentra en la complejidad y no es bueno para volver a ponerlas en práctica.
downloadTheExport() {
this.downloadfile().subscribe((resp: any) => {
const fileSaver: any = new FileSaver();
fileSaver.responseData = resp.body;
fileSaver.strFileName = 'testdata.xls';
fileSaver.strMimeType = 'application/vnd.ms-excel;charset=utf-8';
fileSaver.initSaveFile();
});
}
downloadfile() {
const formDataForExport: FormData = new FormData();
formDataForExport.append('export', 'ALL');
return this.http.post('http://localhost:8080/service/exportExcel.php', formDataForExport, {
headers: { 'Accept': 'text/html,application/xhtml+xml,application/xml;q=0.9,image/webp,image/apng,*/*;q=0.8,application/signed-exchange;v=b3;q=0.9' },
responseType: 'blob',
observe: 'response'
});
}