-1

I am using exceljs in my route to create an excel file and trying to download the same file on my browser. But the corrupted file is getting downloaded.

Also, the file is getting downloaded as expected when I tried hitting the endpoint using POSTMAN.

I did try to look at the https://github.com/exceljs/exceljs/issues/37 , but it didn't helped much.

        //Backend Code:
        //My route file code, wherein workbook = new Excel.Workbook();
        var fileName = 'FileName.xlsx';
        res.setHeader('Content-Type', 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet');
        res.setHeader('Content-Disposition', 'attachment; filename=' + fileName);

        return workbook.xlsx.write(res).then(function(){
           res.end();
        });


        //Client Side Code:

        $.ajax({
                    url: "/*****/download",
                    type: "GET",
                    data: body,
                    headers: {
                        'Content-type': 'application/json'
                    },
                    responseType: 'blob',
                    success: function (data) {
                        //Data contains the fields that I want to download
                        var saving = document.createElement('a');
                        var csvData;
//Using a FileSaver or Download library to download the file.
                            saveAs(new Blob([data], { type: "vnd.openxmlformats-officedocument.spreadsheetml.sheet;charset=utf-8" }), 'test.xlsx');
                        document.body.appendChild(saving);
                        saving.click();
                        document.body.removeChild(saving);
                    },
                    error: function (error) {
                        console.log(error);
                    }
                });

While opening the excel file, it says, We found a problem with some content....Do you want to recover ...........

Siong Thye Goh
  • 3,518
  • 10
  • 23
  • 31
Sujeet
  • 1
  • 3
  • Why are you using `$.ajax` in the first place? Just link to the URL! – Quentin Jul 22 '19 at 09:03
  • @Quentin : There is no file present at the server, I am dynamically making a file on server and passing to the browser as a stream and I am passing an ID as a body in GET request. Anyways removing the content-type does not help. – Sujeet Jul 22 '19 at 09:40
  • "I am passing an ID as a body in GET request" — You can't do that, browsers will remove the body from a GET request, the `data` attribute in jQuery gets added to the *query string* not the body. – Quentin Jul 22 '19 at 09:46
  • "There is no file present at the server" — That's irrelevant. All the browser sees is a URL. It doesn't know or care how the server generates the response to a request for it. – Quentin Jul 22 '19 at 09:46
  • "Anyways removing the content-type does not help — I said it was nonsense, not that it was the cause of your problem. – Quentin Jul 22 '19 at 09:47
  • I think you should first pass a normal excel file to check your flow is correct. Then after that add the excel generate/parsing library. – Timothy Lee Jul 22 '19 at 09:53
  • @TimothyLee -- I already checked that and it worked fine and even the dynamically generated is getting downloaded but with corrupt data. Although the same code works fine if I hit the endpoint using the Postman. I'm somewhere wrong on my front end code. But not able to solve it. – Sujeet Jul 22 '19 at 10:08
  • @Quentin -- By body, I mean the variable that I have used as body. Yes the id is passed as Query string. – Sujeet Jul 22 '19 at 10:10

1 Answers1

0

You can use URL.createObjectURL

// after getting blob
const tempLink = URL.createObjectURL(blob)
const a = document.createElement('A')
a.download = 'output.xlsx'
a.href = tempLink
a.click()
URL.revokeObjectURL(tempLink) // release memory
Timothy Lee
  • 768
  • 4
  • 15
  • I tried this as well, but the file getting downloaded was corrupt in this case as well. `csvData = new Blob([data], { type: 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet' }); var csvUrl = URL.createObjectURL(data); saving.href = csvUrl; saving.download = '123.xlsx';` – Sujeet Jul 22 '19 at 09:44