I have a download method that is working fine with firefox. When I tried same with IE-11. It does nothing. In further investigation found that while creating blob from arrayBuffer it's throw error for "Uint8Array is undefined". I read some forum where its clear mentioned that IE-11 supports UInt8Array link but according to my code it's seems that it does support.
What should I do to fix the issue - Can it fixed by adding specific js? or else
I am using following js code
var a = document.createElement("a");
document.body.appendChild(a);
a.style = "display: none";
var fileName = decodeURI($scope.downloadedFileName);
var blob = new Blob([response], {
type: file.mime_type
});
url = window.URL.createObjectURL(blob);
a.href = url;
a.download = $scope.downloadedFileName;
a.click();
window.URL.revokeObjectURL(url);
Related
I have the following Angular code to download a PDF document. It works fine in other browsers but in Firefox when browser settings are set to "Open in Firefox" for PDF download then it doesn't open a new tab.
const blob = new Blob([data], { type: docType });
const blobDoc = window.URL.createObjectURL(blob);
const link = document.createElement('a');
link.href = blobDoc;
link.download = 'Filename.pdf';
link.click();
What I want is that in case of Firefox the link must always be open in a new tab. Even if when I set the target attribute, it doesn't open the new tab.
link.target = '_blank'
I tried the following and it works but then I do not get the file name.
const agent = window.navigator.userAgent.toLowerCase();
if (agent.indexOf('firefox') > -1) {
window.open(blobDoc, '_target');
} else {
// Normal download
}
I used the code suggested from Download CSV from an iPython Notebook to dynamically build the javascript code and pass it to the browser using Javascript() in python when called from a jupyter notebook. Code works great. If I embed the same code in a python function and call the python function from the same jupyter notebook, the call Javascript() in python no longer works. How can I make the reusable function work?
I am trying this on Chrome Version 73.0.3683.103 (Official Build) (64-bit) running on Windows 10. Apologies if already answered. I have scoured SO and google.
This works..
from IPython.display import Javascript
js_download = """
var csv = '%s';
var filename = 'results.csv';
var blob = new Blob([csv], { type: 'text/csv;charset=utf-8;' });
if (navigator.msSaveBlob) { // IE 10+
navigator.msSaveBlob(blob, filename);
} else {
var link = document.createElement("a");
if (link.download !== undefined) { // feature detection
// Browsers that support HTML5 download attribute
var url = URL.createObjectURL(blob);
link.setAttribute("href", url);
link.setAttribute("download", filename);
link.style.visibility = 'hidden';
document.body.appendChild(link);
link.click();
document.body.removeChild(link);
}
}
""" % data_in_dataframes.to_csv(index=False).replace('\r','\\r').replace('\n','\\n').replace("'","\'")
Javascript(js_download)
This does not work, it fails to execute Javascript(js_download), but neither does it give any error that I can see in the jupyter notebook nor the java console in the browser. It is as if it never executed Javascript(js_download).
from IPython.display import Javascript
def js_download_csv(df_download, s_filename='results.csv'):
js_download = """
var csv = '%s';
var filename = '%s';
var blob = new Blob([csv], { type: 'text/csv;charset=utf-8;' });
if (navigator.msSaveBlob) { // IE 10+
navigator.msSaveBlob(blob, filename);
} else {
var link = document.createElement("a");
if (link.download !== undefined) { // feature detection
// Browsers that support HTML5 download attribute
var url = URL.createObjectURL(blob);
link.setAttribute("href", url);
link.setAttribute("download", filename);
link.style.visibility = 'hidden';
document.body.appendChild(link);
link.click();
document.body.removeChild(link);
}
}
""" % (df_download.to_csv(index=False).replace('\r','\\r').replace('\n','\\n').replace("'","\'"), s_filename)
Javascript(js_download)
return None
js_download_csv(df_download, s_filename)
Apologies if I have left anything obvious out. I can find no errors or logs with any information regarding what is happening.
Any suggestions welcome.
I have found a partial answer, in that while I do not why this problem occurs, I have found how to overcome it. In https://medium.com/#tomgrek/reactive-python-javascript-communication-in-jupyter-notebook-e2a879e25906 we see in the article the following gotcha:
A big gotcha: something somewhere needs to return Javascript as its output, otherwise it doesn’t get executed in the notebook.
So, if we change the code to the following (i.e. return the Javascript call), it works.
from IPython.display import Javascript
def js_download_csv(df_download, s_filename='results.csv'):
js_download = """
var csv = '%s';
var filename = '%s';
var blob = new Blob([csv], { type: 'text/csv;charset=utf-8;' });
if (navigator.msSaveBlob) { // IE 10+
navigator.msSaveBlob(blob, filename);
} else {
var link = document.createElement("a");
if (link.download !== undefined) { // feature detection
// Browsers that support HTML5 download attribute
var url = URL.createObjectURL(blob);
link.setAttribute("href", url);
link.setAttribute("download", filename);
link.style.visibility = 'hidden';
document.body.appendChild(link);
link.click();
document.body.removeChild(link);
}
}
""" % (df_download.to_csv(index=False).replace('\r','\\r').replace('\n','\\n').replace("'","\'"), s_filename)
return Javascript(js_download)
js_download_csv(df_download, s_filename)
I have a code in angular js which downloads an excel file on clicking a button. In chrome the file download starts automatically on clicking the button. But on Microsoft Edge clicking the button displays a prompt asking the user, whether they want to open or save file. Clicking on save button in prompt shows yet another prompt with 3 buttons OPEN, OPEN FOLDER and VIEW DOWNLOADS.
I know that edge provides settings options to disable the prompt on each download.
But is there any way on edge to start download but after downloading it does not show the second prompt asking what to do, using angular js or jquery?
The code for downloading file is as follows:
var fileName;
var a = document.createElement("a");
document.body.appendChild(a);
var type = headers('Content-Type');
var disposition = headers('Content-Disposition');
if (disposition) {
var match = disposition.match(/.*filename=\"?([^;\"]+)\"?.*/);
if (match[1])
fileName = match[1];
}
var blob = new Blob([data], {
type: type
}),
url = window.URL.createObjectURL(blob);
if (blob.size == 0) {
return;
}
a.href = url;
a.download = fileName;
var isIE = false || document.documentMode || /Edge/.test(navigator.userAgent); //if browser is IE and Edge
if (isIE) {
window.blur();
window.navigator.msSaveOrOpenBlob(blob, fileName);
} else {
a.style = "display: none";
a.click();
window.URL.revokeObjectURL(url);
}
I am trying to download a png file using the uri (code below). It works in Chrome, Firefox and Safari - but not (of course) in Internet Explorer. I am on Windows 7, so I am using IE11 in Edge Document Mode. The error is "The data area passed to a system call is too small." I've read in this MDN post
IE9 and later, as well as Edge, supports data URIs in CSS and JS
files, but not in HTML files, with a max size of 4GB.
My URI is only 1410 bytes (using uri.length). Any ideas why I am getting the error with data of this size and how to fix it?
The download function:
function downloadURI(uri, name) {
var link = document.createElement("a");
link.download = name;
link.href = uri;
document.body.appendChild(link);
link.click();
document.body.removeChild(link);
delete link;
}
The uri format:
"data:image/png;base64,iVBORw0KGgo ETC..."
The solution is below. I can't seem to find the link to give credit, but this solved it. Instead of converting the canvas to a uri first, I pass the canvas and either convert to a uri and download using a link or (for IE) I convert to a blob and use canavas.msToBlob() and msSaveBlob()
function downloadURI(canvas, name) {
if (navigator.msSaveBlob) { // IE10+
var blob = canvas.msToBlob();
return navigator.msSaveBlob(blob, name);
} else {
var uri = canvas.toDataURL("image/png")
var link = document.createElement("a");
link.download = name;
link.href = uri;
document.body.appendChild(link);
if (link.click) {
link.click();
} else {
var event = document.createEvent('MouseEvents');
event.initMouseEvent('click', true, true, window);
link.dispatchEvent(event);
}
document.body.removeChild(link);
}
}
I have below snippet that download the "Test.csv" in IE11, CHROME very well.
But nothing happens in case of FIREFOX 39.0
Any Help will be appreciated.
var blob = new Blob([], { type: 'text/csv' });
/* It will work for IE versions
window.navigator.msSaveBlob(blob, 'Test.csv');
*/
var link = document.createElement("a");
//link.setAttribute("onclick","alert('Click Fired')");
link.href = URL.createObjectURL(blob);
link.download = 'Test.csv';
link.click();
Fiddle: http://jsfiddle.net/rq8460cL/2/
I seems like you have to add the link to the dom before you click it
var blob = new Blob([], { type: 'text/csv' });
/* It will work for IE versions
window.navigator.msSaveBlob(blob, 'Test.csv');
*/
var link = document.createElement("a");
//link.setAttribute("onclick","alert('Click Fired')");
link.href = URL.createObjectURL(blob);
link.download = 'Test.csv';
document.body.appendChild(link);
link.click();
http://jsfiddle.net/rq8460cL/3/