Gautam Gautam - 5 months ago 109
Javascript Question

How to download the file from webapi in Internet Explorer using angular post?

I am using angularjs http post to download the file from the Web Api on the button click.My code works fine in Google Chrome and Firefox but it is not working in the Internet Explorer. Here's my code

$scope.CallApi = function () {
$http({
url: some url,
dataType: 'json',
method: 'POST',
data: null,
responseType: 'arraybuffer',

}).success(function (responsedata, status, xhr) {
var file = xhr('Content-Disposition');
console.log(file);
var filename = file.substr(21, 7);
$scope.value = responsedata;
var fileName = filename;
var blob = new Blob([responsedata], { type: "application/octet-stream" });
var url = URL.createObjectURL(blob);
var a = document.createElement("a");
document.body.appendChild(a);
a.style = "display: none";
a.href = url;
a.download = fileName;

}).error(function (error) {
alert("Error Found" + " : " + error);
});
};





The above code is not working in IE, I don't want to use FileSaver.js extension is there any other way to download the file from api in Internet Explorer. Below I have attached the Screen Shot of the error that I am getting in the Internet Explorer....
enter image description here
Thank You in Advance.....

Answer

Here's one way to download in IE

  if (window.navigator.msSaveOrOpenBlob){
      // base64 string
      var base64str = response;
      // decode base64 string, remove space for IE compatibility
      var newstr =base64str.replace(/\s/g, '');
      var binary = atob(newstr);
      // get binary length
      var len = binary.length;
      // create ArrayBuffer with binary length
      var buffer = new ArrayBuffer(len);
      // create 8-bit Array
      var view = new Uint8Array(buffer);

      // save unicode of binary data into 8-bit Array
      for (var i = 0; i < len; i++) {
        view[i] = binary.charCodeAt(i);
      }

      // create the blob object with content-type "application/csv"               
      var blob = new Blob( [view], { type: mimeType });
      window.navigator.msSaveOrOpenBlob(blob, "Name your file here");
}

here mimeType would be application/octet-stream for you and response is your base64 string.

Comments