GET http://localhost:4200/[object%20Blob] 404 (Not Found) in Angular

Question

I don't know but I can't recover image from Rest API; Please helpe me!

private baseUrl:string= "http://localhost:8080/";

Service:

public downloadeImageEcho1( id:number): Observable<any>{
  
  return this.http.get(this.baseUrl+"/downloadFile/"+id, { responseType: 'blob'});

}

component.ts:

getImage(id:number){
  this.serviceDossier.downloadeImageEcho1(id)
  .subscribe((data :any)=>{
    this.imageEcho=data;
    console.log(this.imageEcho); 
  })
}

html:

<div *ngIf = imageEcho>
            <img [attr.src]="imageEcho">
            
          </div>

error: enter image description here

thank you in advance!!

Answer 1

It would be better to set the image src to the URL of the image instead of fetching the image through the HTTP Client.

[attr.src]="imageEcho"

is causing the additional http request to occur.