Could not download Excel sheet using Angularjs $http service - node.js

Question

While I am running the URL(i.e-http://localhost:3002/api/downloadFeedback) on browser directly it can be downloaded but when I am using angular $http service its returning the binary data.I am using node.js for backend.
I am providing my code below.
var userData={"month":parseInt($scope.month),"year":parseInt($scope.year)};
var url='/api/downloadFeedback';
var method='GET';
var token=$window.sessionStorage.getItem('token');
//console.log('token',token);
DataService.connectToServerSideScript(method,url,userData,token)
.then(function(response) {
}
},function(error) {
//alert(error['msg']);
})
function DataService($http, $q){
return{
connectToServerSideScript:connectToServerSideScript
}
function connectToServerSideScript(method,url,userData,authtoken=''){
//console.log('deffered',method,url,userData);
var deferred = $q.defer();
$http({
method:method,
url:url,
data:userData,
headers: { 'Content-Type': 'application/json','Authorization': authtoken }
}).then(function(response) {
//console.log('data defer',response.data);
deferred.resolve(response.data);
},function(error) {
deferred.reject(error.data);
})
//console.log('data defer',deferred.promise);
return deferred.promise;
}
}
My server side code is given below.
setTimeout(function(){
//res.send(allids);
var workbook = new excel.Workbook();
var sheet = workbook.addWorksheet('MySheet');
/*sheet.autoFilter = {
from: 'A',
to: 'L'
}*/
sheet.columns = [
{ header: 'ALLOCATED TO', key: 'allocated_to', width: 10 },
{ header: 'ZONE', key: 'zone', width: 10 },
{ header: 'STATE', key: 'state', width: 10 },
{ header: 'LOCATION', key: 'location', width: 15 },
{ header: 'ZONAL COLLECTION MANAGER', key: 'zonal_collection_manager', width: 20 },
{ header: 'AREA COLLECTION MANAGER', key: 'area_collection_manager', width: 20 },
{ header: 'COLLECTION MANAGER', key: 'collection_manager', width: 20 },
{ header: 'FIELD AGENCY NAME', key: 'field_agency_name', width: 20 },
{ header: 'FOS', key: 'fos', width: 15 },
{ header: 'LOGIN ID', key: 'login_id', width: 27 },
{ header: 'CL CONTRACT ID', key: 'cl_contract_id', width: 20 },
{ header: 'LK LOAN ACCOUNT ID', key: 'lk_loan_account_id', width: 20 },
{ header: 'DISPOSITION CODE', key: 'disposition_code', width: 18 },
{ header: 'PROMISE DATE', key: 'promise_date', width: 18 },
{ header: 'REMARK', key: 'other_remarks', width: 18 },
{ header: 'REMARK DATE TIME', key: 'addedOn', width: 18 }
];
allids.forEach(function(item){
sheet.addRow(item);
})
var dt = dateTime.create();
var formatted = dt.format('Y-m-d-H-M-S');
var filepath=formatted+'_download';
workbook.xlsx.writeFile('./uploads/Excel/'+filepath+'.xlsx').then(function(){
console.log("file is written");
})
var tempFilePath = tempfile('.xlsx');
console.log("tempFilePath : ", tempFilePath);
workbook.xlsx.writeFile(tempFilePath).then(function() {
var filename=filepath+'.xlsx';
var filePath='./uploads/Excel/';
var fileLocation = path.join('./uploads/Excel/',filename);
var filet = __dirname+'/' + fileLocation;
console.log('filelocation',__dirname);
var dip_code='Content-disposition';
var attch='attachment; filename='+filename;
res.setHeader(dip_code, attch);
//res.setHeader('Content-disposition', 'attachment; filename=data.xlsx');
res.setHeader('Content-type', 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet');
res.download(fileLocation,filename);
//res.send(allids);
});
}, 2000);
Here I can generate the Excel sheet and successfully write inside the folder. When directly running through browser same URL is downloading the file but when I am using the $http service its returning the some binary unreadable data in response. I need to also download the sheet using angularjs.

Answer 1

please add responseType: "arraybuffer"
in your $http option object as follows
$http({
method:method,
url:url,
data:userData,
responseType: "arraybuffer",
headers: { 'Content-Type': 'application/json','Authorization': authtoken }
})