Cfrgtkky

I have a problem downloading a file from a rest api using angular 6

Back-end method

  @RequestMapping(value = "/print/{id}")

    public ResponseEntity<byte> generateReport(@PathVariable("id") long id_project){

        Map<String, Object> mapper = new HashMap<String, Object>();

        byte content =  exportService.export(mapper, ReportUtils.testReport, ReportUtils.FileFormat.PDF.toString());

        return new ResponseEntity<>(content, Utils.getPDFHeaders("Situation_test.pdf"), HttpStatus.OK);

    }

Mathod getHeader

public static HttpHeaders getPDFHeaders(String fileName) {

    HttpHeaders head = new HttpHeaders();

    head.setContentType(MediaType.parseMediaType("application/pdf"));

    head.add("content-disposition", "attachment; filename=" + fileName);

    head.setContentDispositionFormData(fileName, fileName);

    head.setCacheControl("must-revalidate, post-check=0, pre-check=0");

    return head;

}

My Angular Service

download(url: string): any {

    let headers = new HttpHeaders();

    headers = headers.append('Authorization', 'Bearer ' + this.getToken());

    this.http.get(this.API_URL + url, {headers: headers}).subscribe((res) => {

      const file = new Blob([res], {

        type: 'application/pdf',

      });

      const a = document.createElement('a');

      a.href = this.API_URL + (<any>res)._body;

      a.target = '_blank';

      document.body.appendChild(a);

      a.click();

      return res;

    }, error => {

      let alert: any = {

        title: 'Notify Title',

        body: 'Notify Body',

      };

      alert.body = error.error.message || JSON.stringify(error.error);

      alert.title = error.error.error;

      alert = this.alertService.handleError(error);

      alert.position = 'rightTop';

      console.log(error);

      this.alertService.notifyError(alert);

      return error;

    });

  }

I have already tried my API using PostMan and it word perfectly but in Angular it give me this error

HttpErrorResponse {headers: HttpHeaders, status: 200, statusText: "OK", url: "http://localhost:8080/api/projects/print/1", ok: false, …}

error: {error: SyntaxError: Unexpected token % in JSON at position 0 at JSON.parse (<anonymous>) at XMLHttp…, text: "%PDF-1.4↵%����↵3 0 obj↵<</Filter/FlateDecode/Lengt…25f1>]/Root 8 0 R/Size 10>>↵startxref↵1049↵%%EOF↵"}

headers: HttpHeaders {normalizedNames: Map(0), lazyUpdate: null, lazyInit: ƒ}

message: "Http failure during parsing for http://localhost:8080/api/projects/print/1"

name: "HttpErrorResponse"

ok: false

status: 200

statusText: "OK"

url: "http://localhost:8080/api/projects/print/1"

Try adding content-type to your request headers.
You can try this as an exemple:

let headers = new Headers({'Content-Type': 'application/pdf', 'Accept': 'application/pdf'});