I am implementing an function on my website and doing with Angular JS. I have implemented a service for exporting a file on server side. On client side, i have created an "EXPORT OPTION", then when user click on that button, user can download the file ( export from my service on server side) and auto save it on Download folder of their local machine. I got the idea from the answer of "tremendows" from this question: how to download file using AngularJS and calling MVC API?
Everything have done well, however, when i opened the file that was saved into Download folder, there was a error message displayed : " "Excel cannot open the file 'filename.xlsx' because the file format for the file extension is not valid. Verify that the file has not been corrupted and that the file extension matches the format of the file."
I believe that the problem came out from client side, because when i run the service (for exporting file) on service side, the file is created and opened correctly without any error. I kept investigating the issue, then i found that the problem should be came out from the file path ".xlsx".
Here is the java code for exporting file on server side:
@RequestMapping(value = "/exportFile", method = RequestMethod.GET)
public String exportHRSalaryByAcc(HttpServletRequest request, HttpServletResponse response,
@RequestParam(value = "month", defaultValue = "") String month) throws IOException, GeneralSecurityException, InvalidFormatException{
String rs = FALSE;
response.addHeader("Access-Control-Allow-Origin", "*");
response.setContentType("application/vnd.openxmlformats-officedocument.spreadsheetml.sheet");
//response.setContentType("application/x-felix; charset=us-ascii");
response.setHeader("Content-Transfer-Encoding", "7bit");
String fName = null;
Calendar cal = Calendar.getInstance();
int m = 0;
try {
if(StringUtils.isNotEmpty(String.valueOf( month)) || StringUtils.isNotEmpty(String.valueOf( year))){
if (DateUtils.isValidFormatver2(Integer.parseInt(month), Integer.parseInt(year))) {
m = Integer.parseInt(month);
fName = "C:\\LOCAL\\FILE_" + "[" + m + "]" + "[" + y + "]" + ".xlsx";
// CREAT FILE
rs = eService.runExportDataHRSalay(m, fName);
} else {
return ErrorMessage.FILE_MESS;
}
} else {
m = cal.get(Calendar.MONTH) + 1;
fName = "C:\\LOCAL\\FILE_" + "[" + m + "]" + ".xlsx";
rs = eService.runExportDataHRSalay(m, fName);
}
} catch (Exception e) {
e.printStackTrace();
}
response.setHeader("Content-Disposition", "attachment; filename=\"" + fName);
return rs;
}
Here is the code on client side and i used angularjs:
.....
month = currentTime.getMonth() + 1;
var check = confirm("Are you sure to run the data ?");
if(check == true){
$http({
url : www.serviceFromServerSide.abc/exportFile,
method : 'GET',
headers : {
'Content-type' : 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet',
},
responseType : 'arraybuffer'
}).success(function(data, status, headers, config) {
var file = new Blob([ data ], {
type : 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet'
});
//trick to download store a file having its URL
var fileURL = URL.createObjectURL(file);
var a = document.createElement('a');
a.href = fileURL;
console.dir(fileURL);
a.target = '_blank';
a.download = 'FILE__' + '[' + month + ']'+ '.xlsx';
document.body.appendChild(a);
a.click();
$("#loadingImage").css("display", "none");
$("#backgroundPopup").fadeOut(400);
}).error(function(data, status, headers, config) {
});
}else{}..........
Please help me figure this out, i am really exhausted because of this. Thank you all and sorry for bad explaination.