Save Excel file from API request using FileSaver in ReactJS

Question

Im my React app, I'm querying an API to retrieve an export of the database under excel format. The call is performed inside my sagas. I then try to save the response of the API with FileSaver

const {headers, data} = response;
FileSaver.saveAs(new Blob([data], {type: headers['content-type']}), filename);

The headers of the response are as follow

{
    content-disposition: "attachment; filename="export.xlsx"; filename*=utf-8''export.xlsx;",
    content-type: "application/vnd.openxmlformats-officedocument.spreadsheetml.sheet"
}

When I call the API with Postman and save the file, I can then open it like any standard excel file. But when I save it with FileSaver I cannot open it. It's just hexadecimal encoding. What am I missing to save the file the right way ?

Answer 1

If the data is a dataframe, you could use Danfo.js:

https://danfo.jsdata.org/api-reference/input-output/danfo.to_excel

const dfd = require("danfojs-node")

let data = {
    Abs: [20.2, 30, 47.3],
    Count: [34, 4, 5],
    "country code": ["NG", "FR", "GH"],
};

let df = new dfd.DataFrame(data);

dfd.toExcel(df, { filePath: "testOut.xlsx"});