我在这里指定了一个非常类似的需求。
我需要有用户的浏览器手动启动下载时$('a#someID').click();
但是我不能用窗户。Href方法,因为它将当前页面内容替换为您试图下载的文件。
相反,我想在新窗口/标签中打开下载。这怎么可能呢?
我在这里指定了一个非常类似的需求。
我需要有用户的浏览器手动启动下载时$('a#someID').click();
但是我不能用窗户。Href方法,因为它将当前页面内容替换为您试图下载的文件。
相反,我想在新窗口/标签中打开下载。这怎么可能呢?
当前回答
对我来说,这在chrome v72测试中工作正常
function down_file(url,name){
var a = $("<a>")
.attr("href", url)
.attr("download", name)
.appendTo("body");
a[0].click();
a.remove();
}
down_file('https://www.useotools.com/uploads/nulogo[1].png','logo.png')
其他回答
这些函数在stacktrace.js中使用:
/**
* Try XHR methods in order and store XHR factory.
*
* @return <Function> XHR function or equivalent
*/
var createXMLHTTPObject = function() {
var xmlhttp, XMLHttpFactories = [
function() {
return new XMLHttpRequest();
}, function() {
return new ActiveXObject('Msxml2.XMLHTTP');
}, function() {
return new ActiveXObject('Msxml3.XMLHTTP');
}, function() {
return new ActiveXObject('Microsoft.XMLHTTP');
}
];
for (var i = 0; i < XMLHttpFactories.length; i++) {
try {
xmlhttp = XMLHttpFactories[i]();
// Use memoization to cache the factory
createXMLHTTPObject = XMLHttpFactories[i];
return xmlhttp;
} catch (e) {
}
}
}
/**
* @return the text from a given URL
*/
function ajax(url) {
var req = createXMLHTTPObject();
if (req) {
try {
req.open('GET', url, false);
req.send(null);
return req.responseText;
} catch (e) {
}
}
return '';
}
我很惊讶没有很多人知道元素的下载属性。请帮助传播这个消息!你可以有一个隐藏的html链接,假装点击它。如果html链接具有下载属性,它将下载文件,而不是查看文件,无论如何。这是代码。如果能找到猫的图片,它就会下载。
. getelementbyid(“下载”).click (); <a href="https://docs.google.com/uc?id=0B0jH18Lft7ypSmRjdWg1c082Y2M" download id="download" hidden></a>
注意: 并非所有浏览器都支持:http://www.w3schools.com/tags/att_a_download.asp
为了改进Imagine Breaker的答案,FF和IE支持:
var evt = document.createEvent("MouseEvents");
evt.initMouseEvent("click", true, true, window, 0, 0, 0, 0, 0, false, false, false, false, 0, null);
function downloadURI(uri, name) {
var link = document.createElement("a");
link.download = name;
link.href = uri;
link.dispatchEvent(evt);
}
换句话说,只需使用dispatchEvent函数而不是click();
你必须从服务器和客户端(web应用程序)两方面进行操作。
在服务器上,设置名为Content-Disposition https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/Content-Disposition的报头
// nodejs express
res.set('Content-Disposition', `attachment; filename="${self.creationName}"`)
使用上面的头文件,服务器会告诉浏览器响应是一个文件,它应该下载并以给定的名称保存,否则浏览器可能会将文件保存为“attachments (1).zip”之类的文件
接下来,我们查看客户端,创建一个锚链接并自动单击它。
function downloadThroughAnchorLink(downloadUrl: string, fileName: string) {
const a = document.createElement('a')
a.href = downloadUrl;
// We provided a header called Content-Disposition so we dont need to set "a.download" here
// a.download = fileName || 'download'
a.click()
}
这样就行了。
Firefox和Chrome测试:
var link = document.createElement('a');
link.download = 'fileName.ext'
link.href = 'http://down.serv/file.ext';
// Because firefox not executing the .click() well
// We need to create mouse event initialization.
var clickEvent = document.createEvent("MouseEvent");
clickEvent.initEvent("click", true, true);
link.dispatchEvent(clickEvent);
这实际上是firefox的“chrome”方式解决方案(我没有在其他浏览器上测试过,所以请留下关于可编译性的评论)