Created
October 8, 2017 11:02
-
-
Save rajeevprasanna/327be60b176fa4c1129aca456d9e1d57 to your computer and use it in GitHub Desktop.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <!DOCTYPE html> | |
| <html lang="en"> | |
| <head> | |
| <title>File downloader</title> | |
| </head> | |
| <body> | |
| <div id="progress-msg">File is downloading. Please wait...</div> | |
| <script> | |
| function saveAs(blob, fileName) { | |
| var url = window.URL.createObjectURL(blob); | |
| var anchorElem = document.createElement("a"); | |
| anchorElem.style = "display: none"; | |
| anchorElem.href = url; | |
| anchorElem.download = fileName; | |
| document.body.appendChild(anchorElem); | |
| anchorElem.click(); | |
| document.body.removeChild(anchorElem); | |
| // On Edge, revokeObjectURL should be called only after | |
| // a.click() has completed, atleast on EdgeHTML 15.15048 | |
| setTimeout(function() { | |
| window.URL.revokeObjectURL(url); | |
| }, 1000); | |
| } | |
| function downloadFile(fileName, fileUrl){ | |
| var xhr = new XMLHttpRequest(); | |
| xhr.open("GET", fileUrl, true); | |
| xhr.responseType = 'blob'; | |
| xhr.onload = function(e) { | |
| if (this.status == 200) { | |
| var blob = this.response; | |
| var arrayBuffer; | |
| var fileReader = new FileReader(); | |
| fileReader.onload = function() { | |
| arrayBuffer = this.result; | |
| var byteCharacters = atob(new Uint8Array(arrayBuffer).reduce((data, byte) => data + String.fromCharCode(byte), '')); | |
| var byteNumbers = new Array(byteCharacters.length); | |
| for (var i = 0; i < byteCharacters.length; i++) { | |
| byteNumbers[i] = byteCharacters.charCodeAt(i); | |
| } | |
| var byteArray = new Uint8Array(byteNumbers); | |
| var blob1 = new Blob([byteArray], {type: "application/octet-stream"}); | |
| saveAs(blob1, fileName); | |
| document.getElementById('progress-msg').innerHTML = 'File download completed!!!'; | |
| }; | |
| fileReader.readAsArrayBuffer(blob); | |
| }else{ | |
| document.getElementById('progress-msg').innerHTML = 'Error in downloading file. Please try again!!!'; | |
| } | |
| }; | |
| xhr.onerror = function(e) { | |
| document.getElementById('progress-msg').innerHTML = 'Error in downloading file. Please try again!!!'; | |
| }; | |
| xhr.send(); | |
| } | |
| function getParameterByName(name, url) { | |
| if (!url) { | |
| url = window.location.href; | |
| } | |
| name = name.replace(/[\[\]]/g, "\\$&"); | |
| var regex = new RegExp("[?&]" + name + "(=([^&#]*)|&|#|$)"), | |
| results = regex.exec(url); | |
| if (!results) return null; | |
| if (!results[2]) return ''; | |
| return decodeURIComponent(results[2].replace(/\+/g, " ")); | |
| } | |
| //params = new URLSearchParams(window.location.search) | |
| //url = params.get('url'); | |
| url = getParameterByName('url', window.location.search); | |
| fileName = getParameterByName('fileName', window.location.search); | |
| if(url){ | |
| fileName = fileName ? fileName :'newFile'; | |
| downloadFile(fileName, url); | |
| } | |
| </script> | |
| </body> | |
| </html> |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
@rajeevprasanna, we are also facing the same issue like @OriAmir.
We are developing outlook web add-in where we want to download file from outlook2016 client for Mac (OS : MacOS High Sierra). So tried to implement the above solution, but getting error as Failed to load resource: The operation couldn't be completed.(WebKitBlobResource error 1.).