我在这里指定了一个非常类似的需求。
我需要有用户的浏览器手动启动下载时$('a#someID').click();
但是我不能用窗户。Href方法,因为它将当前页面内容替换为您试图下载的文件。
相反,我想在新窗口/标签中打开下载。这怎么可能呢?
我在这里指定了一个非常类似的需求。
我需要有用户的浏览器手动启动下载时$('a#someID').click();
但是我不能用窗户。Href方法,因为它将当前页面内容替换为您试图下载的文件。
相反,我想在新窗口/标签中打开下载。这怎么可能呢?
当前回答
使用iframe的简单示例
function downloadURL(url) {
var hiddenIFrameID = 'hiddenDownloader',
iframe = document.getElementById(hiddenIFrameID);
if (iframe === null) {
iframe = document.createElement('iframe');
iframe.id = hiddenIFrameID;
iframe.style.display = 'none';
document.body.appendChild(iframe);
}
iframe.src = url;
};
然后在任何你想要的地方调用这个函数:
downloadURL(“path / to /我的文件”);
其他回答
我使用FORM标签有很好的结果,因为它可以在任何地方工作,你不必在服务器上创建临时文件。方法是这样的。
在客户端(页面HTML),您可以创建这样一个不可见的表单
<form method="POST" action="/download.php" target="_blank" id="downloadForm">
<input type="hidden" name="data" id="csv">
</form>
然后你添加Javascript代码到你的按钮:
$('#button').click(function() {
$('#csv').val('---your data---');
$('#downloadForm').submit();
}
在服务器端,你在download.php中有如下PHP代码:
<?php
header('Content-Type: text/csv');
header('Content-Description: File Transfer');
header('Content-Type: application/octet-stream');
header('Content-Disposition: attachment; filename=out.csv');
header('Content-Transfer-Encoding: binary');
header('Connection: Keep-Alive');
header('Expires: 0');
header('Cache-Control: must-revalidate, post-check=0, pre-check=0');
header('Pragma: public');
header('Content-Length: ' . strlen($data));
echo $_REQUEST['data'];
exit();
你甚至可以像这样创建数据的zip文件:
<?php
$file = tempnam("tmp", "zip");
$zip = new ZipArchive();
$zip->open($file, ZipArchive::OVERWRITE);
$zip->addFromString('test.csv', $_REQUEST['data']);
$zip->close();
header('Content-Type: application/zip');
header('Content-Length: ' . filesize($file));
header('Content-Disposition: attachment; filename="file.zip"');
readfile($file);
unlink($file);
最好的部分是它不会在您的服务器上留下任何残留文件,因为一切都是在运行中创建和销毁的!
我最终使用了下面的代码片段,它可以在大多数浏览器中运行,但没有在IE中进行测试。
let data = JSON.stringify([{email: "test@domain.com", name: "test"}, {email: "anothertest@example.com", name: "anothertest"}]); let type = "application/json", name = "testfile.json"; downloader(data, type, name) function downloader(data, type, name) { let blob = new Blob([data], {type}); let url = window.URL.createObjectURL(blob); downloadURI(url, name); window.URL.revokeObjectURL(url); } function downloadURI(uri, name) { let link = document.createElement("a"); link.download = name; link.href = uri; link.click(); }
更新
function downloadURI(uri, name) {
let link = document.createElement("a");
link.download = name;
link.href = uri;
link.click();
}
function downloader(data, type, name) {
let blob = new Blob([data], {type});
let url = window.URL.createObjectURL(blob);
downloadURI(url, name);
window.URL.revokeObjectURL(url);
}
我建议使用下载属性而不是jQuery:
<a href="your_link" download> file_name </a>
这将下载您的文件,而不需要打开它。
我知道我迟到了,但我想分享我的解决方案,这是上面Imagine Breaker解决方案的变化。我试着用他的方法,因为他的方法对我来说是最简单易行的。但就像其他人说的那样,它不适合某些浏览器,所以我使用jquery对它进行了一些修改。
希望这能帮助到那里的人。
function download(url) {
var link = document.createElement("a");
$(link).click(function(e) {
e.preventDefault();
window.location.href = url;
});
$(link).click();
}
也可以使用fs-浏览器包。 它有很好的和简单的下载方法为客户端。 它是这样的:
import {downloadFile} from 'fs-browsers'; downloadFile (url-to-the-file);