rajeevprasanna/filedownloader.html

## filedownloader.html
<!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>
	<!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>