Search code examples
javascripttypescriptangular7angular-directiveangular-components

error HTTP failure during parsing URL when Handle Response create excel file

I work on angular 7 App Upload file. I make Angular App upload files

so first I choose a file then press the upload button

then I expect I get file Downloaded as Output but This not happen

the angular app did not return downloaded file so I have the issue on the response of angular and I need to fix it

I check repose of angular I get error HTTP failure during parsing link on line 115 as Image below.

line 115 Error angular on line post subscribe

this.http.post('https://localhost:44396/api/ApprovalQuality/', formData).subscribe(
  (data) => {},
  (error) => {
    console.log(error);
  },
);

on response above it must return Excel file but it displays error

error HTTP failure during parsing URL line 115 and not create excel file

Full Code

component.html

<input type="file" id="file" (change)="handleFileInput($event.target.files)" />

<button type="button" class="btn btn-success" (click)="uploadFile(files)">
  Upload File
</button>

component.ts

fileToUpload: File = null;

handleFileInput(files: FileList) {
  this.fileToUpload = files.item(0);
}
public uploadFile = (files) => {
  const formData = new FormData();

  formData.append('file', this.fileToUpload, this.fileToUpload.name);

  this.http
    .post('https://localhost:44396/api/ApprovalQuality/', formData)

    .subscribe(
      (data) => {},
      (error) => {
        console.log(error);
      },
    );
};

reponse file not create excel file

Solution

  • You reposeType is text/plain, it's must be set application/octet-stream. And then, you can use blob and URL.createObjectURL to download the excel file.