Empresas
Empleos
  • Sobre nosotros
  • Soluciones
    • Publicación de vacantes
      Publica tu vacante y recibe candidatos calificados en 48h.
    • Evaluación de candidatos
      500+ pruebas técnicas y psicológicas, más anti-fraude.
    • Headhunting
      Búsqueda ejecutiva a la medida de principio a fin.
    • Nómina + EOR
      Dispersión de nómina y EOR en más de 15 países de LATAM.
  • Precios
  • Empleos

0

730
Vistas
Descarga de archivos a través de Angular 2

Tengo un backend que configuré para devolver un archivo configurando el encabezado

 Content-Disposition: attachment;filename=somefile.csv

Funciona directamente en el navegador y descarga el archivo inmediatamente después de invocar la URL que apunta a ese recurso.

Mi objetivo es tener un botón en una plantilla de Angular 2. Cuando el usuario hace clic en ese botón, necesito recopilar algunos datos del lado del cliente (algunos ID) y enviarlos al servidor para invocar esa URL de descarga de archivos.

Me gustaría que el usuario permanezca en la misma página y no se abran nuevas pestañas, sino que simplemente haga que el archivo comience a descargarse (al igual que cuando se invoca la URL directamente).

Tendrá que hacerse a través de una solicitud POST porque puedo tener bastantes datos para enviar para identificar qué recurso debe descargarse.

¿Cómo se ve la llamada en el lado Angular 2 para esto? Intenté un par de cosas pero obviamente estoy en el camino equivocado.

¡Cualquier ayuda sería apreciada!

about 4 years ago · Santiago Trujillo
2 Respuestas
Responde la pregunta

0

Tuve un problema similar cuando intentaba descargar un archivo PDF que estaba enviando mi servidor Node. Estaba haciendo una solicitud GET en mi servidor con algunos detalles de identificación. Esto es lo que funcionó para mí.

Función Llamar a mi servicio

 printBill(receiptID) { this.BillingService.printBill(receiptID) .subscribe(res => { saveAs(res,"InvoiceNo"+receiptID+".pdf"); let fileURL = URL.createObjectURL(res); window.open(fileURL); }) }

Servicio

 printBill(billID) { return this.http.get('/billing/receipt/'+billID, { responseType: ResponseContentType.Blob }) .map((res) => { return new Blob([res.blob()], { type: 'application/pdf' }) }) }

Y no te olvides de importar ResponseContentType

Espero que esto te ayude

about 4 years ago · Santiago Trujillo Denunciar

0

lo he implementado así.

Tengo un servicio que solicita la descarga de archivos. La respuesta devuelve una url, que está en amazon s3. Este es un archivo zip que contiene lo que quiero descargar.

lo siguiente funciona en todos los navegadores.

en tu controlador

 requestDownload() { this.downloadservice.downloadImages(obj) .subscribe( response => this.download(response ) ); } // res is an object download(res){ var link = document.createElement("a"); link.download = "a"; link.href = res.link; document.body.appendChild(link); link.click(); }

descargar archivo de servicio

 downloadImages(body): Observable<any>{ let headers = new Headers({ 'Content-Type': 'application/json' }); let options = new RequestOptions({ headers: headers }); return this.http.post("/Camera51Server/getZippedImages", body, options) .map((res:Response) => res.json()) .catch(this.handleError); }

si quieres puedo darte un enlace al repositorio.

about 4 years ago · Santiago Trujillo Denunciar
Responde la pregunta
Encuentra empleos remotos

¡Descubre la nueva forma de encontrar empleo!

Top de empleos
Top categorías de empleo
Empresas
Publicar vacante Precios Comercial
Legal
Términos y condiciones Política de privacidad
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Recomiéndame algunas ofertas
Necesito ayuda