0

Estoy consumiendo el servicio de una API que me retorna un archivo pdf, el cliente quiere que al dar clic en el botón que ejecuta la acción se abra el archivo en otra ventana. Para lograr esto hago uso de un objeto blob.

Sin embargo cuando el usuario hace clic en el botón descargar pdf del navegador, este pone por defecto un hash como nombre del archivo.

introducir la descripción de la imagen aquí

Quiero saber como cambiar ese nombre por uno personalizado

Archivo blob.service

public getPDF(url): Observable<Blob> {
  return this.http.get(url, {responseType: 'blob'});
}

public showPDF(url, nombre_archivo): void {
    this.getPDF(url)
      .subscribe(file => {
        // Es necesario crear un nuevo objeto blob con el tipo mime establecido explícitamente
        // de lo contrario, solo Chrome funciona como debería
        var newBlob = new Blob([file], { type: 'application/pdf' });

        // IE no permite usar un objeto blob directamente como enlace href
        // en su lugar, es necesario usar msSaveOrOpenBlob
        if (window.navigator && window.navigator.msSaveOrOpenBlob) {
          window.navigator.msSaveOrOpenBlob(newBlob);
          return;
        }

        // Para otros navegadores:
        // Crea un enlace que apunta al ObjectURL que contiene el blob.
        const data = window.URL.createObjectURL(newBlob);

        var link = document.createElement('a');
        link.href = data;
        link.target = '_blank';
        // La siguiente linea es necesaria si se quiere descargar el archivo de forma automatica.
        // link.download = nombre_archivo + ".pdf";
        // Esto es necesario ya que link.click () no funciona en el último Firefox
        link.dispatchEvent(
          new MouseEvent('click', {
            bubbles: true,
            cancelable: true,
            view: window.open(link.href, link.target)
          })
        );
      });
  }

Método que hace uso del servicio

descargarFormatoSA(nombre_formato) {
    let url = `${env.apiUrl}/parametrizacion/descargar_formato_sa/${nombre_formato}/`;
    this.blobService.showPDF(url, nombre_formato);
  }

1 respuesta 1

1

Yo utilizo una librería que se llama FileSaver para guardar los archivos. FileSaver en npm esta es la documentación de la librería.

Un ejemplo de su uso sería:

import * as FileSaver from 'file-saver';

public downloadPdf(pdf: any): void {
    const file: Blob = new Blob([pdf] {type: 'application/pdf'});
    FileSaver.saveAs(file, 'nombre_que_quieras.pdf');
}

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.