自从最新版本以来,我经历过Chrome的一些意想不到的行为:在Firefox中,此代码工作正常:
<a id="playlist" class="button" download="Name.xspf" href="data:application/octet-stream;base64,PD94ANDSOON" style="display: inline;">Download Me</a>
Run Code Online (Sandbox Code Playgroud)
它无法在Chrome中运行(只需下载名为"下载"的文件),但之前的工作非常好.我有什么要改变它再次起作用?
不知道为什么我面临这个问题无法在Chrome浏览器中下载pdf文件,它在Nginx服务器中显示如下错误.
资源被解释为文档但使用mime类型application/octet-stream pdf进行传输
虽然我已将mime类型包含为application/pdf
在有人说"复制"之前,我只是想确保,人们知道,我已经审查了这些问题:
1)使用angular和php,不知道这里发生了什么(我不知道PHP):下载zip文件并从angular方法触发"保存文件"对话框
2)无法得到任何答案:如何使用angular下载zip文件
3)这个人已经可以下载,这是我想要弄清楚的一点: 从按钮动作触发的角度下载外部zip文件
4)没有答案: 在nodejs中从服务器下载.zip文件
5)我不知道这甚至是什么语言:https: //stackoverflow.com/questions/35596764/zip-file-download-using-angularjs-directive
鉴于这些问题,如果这仍然是重复,我道歉.这是这个问题的另一个版本.
我的1.5.X客户端给我一个标题列表,每个标题都有一个相关的文件.我的节点4.X/Express 4.X服务器获取该列表,获取文件位置,创建一个zip文件,使用来自npm的express-zip,然后将该文件流回到响应中.然后,我希望我的客户端启动浏览器的"下载文件"选项.
这是我的客户端代码(Angular 1.5.X):
function bulkdownload(titles){
titles = titles || [];
if ( titles.length > 0 ) {
$http.get('/query/bulkdownload',{
params:{titles:titles},
responseType:'arraybuffer'
})
.then(successCb,errorCb)
.catch(exceptionCb);
}
function successCb(response){
// This is the part I believe I cannot get to work, my code snippet is below
};
function errorCb(error){
alert('Error: ' + JSON.stringify(error));
};
function exceptionCb(ex){
alert('Exception: ' + JSON.stringify(ex));
};
};
Run Code Online (Sandbox Code Playgroud)
带有express-zip的节点(4.X)代码,https: …
我正在创建一个脚本,可让您下载页面上当前表的 CSV 文件,如下所示:
var downloadLink = document.createElement("a");
var blob = new Blob(["", CSVString], {type: 'text/csv;charset=utf-8'});
if (navigator.appVersion.toString().indexOf('.NET') > 0) {
window.navigator.msSaveOrOpenBlob(blob, "Daten.csv");
}
else {
downloadLink.href = window.URL.createObjectURL(blob);
downloadLink.download = "Daten.csv";
downloadLink.style.display = 'none';
document.body.appendChild(downloadLink);
downloadLink.click();
}
Run Code Online (Sandbox Code Playgroud)
现在,如果我使用 IE,它会询问我是否要从本地主机下载文件,但在 Mozilla Firefox 中,下载窗口显示“来自:blob:”。是否可以更改以显示主机名或我指定的名称(例如测试)?
我想制作一个<a href链接,点击后会强制浏览器打开“另存为”对话框。HTML5download属性的使用应该在所有现代浏览器上都有这种行为。
当目标是外部托管的图像文件时,这不起作用。该<a href链接将导航到图像而不是下载它。(使用 Imgur 和 Tumblr 上托管的图像进行测试)

<a href="https://i.stack.imgur.com/440u9.png" download>
<img src="https://i.stack.imgur.com/440u9.png" width="200"/>
</a>
Run Code Online (Sandbox Code Playgroud)
例如,如果图像本地托管在您的服务器上,类似的 HTML 代码确实有效
<a href="440u9.png" download>
<img src="440u9.png" width="200"/>
</a>
Run Code Online (Sandbox Code Playgroud)
另一个例子 - 这将在W3Schools Tryit Editor 中工作,但如果您将 HTML 复制到另一个沙箱(如 JSFiddle)中将不起作用
<a href="https://www.w3schools.com/images/myw3schoolsimage.jpg" download>
<img src="https://www.w3schools.com/images/myw3schoolsimage.jpg" width="104" height="142">
</a>
Run Code Online (Sandbox Code Playgroud)
探讨的可能原因:
https:如果 URL 指向同一个域,则带有的 URL 很好,在 W3Schools Tryit Editor 中进行了测试http://...链接可以重定向到,https://...所以这可能是失败的原因,但https://...链接也不起作用我正在做一个画布绘图项目.我将画布转换为图像,然后将该图像保存为".png".我必须右键单击图像并选择"将图像另存为"选项.但我想通过按钮提供该选项.当我点击按钮时,它应该被保存.
任何例子或想法将不胜感激.
这是一个将canvas转换为png的js函数.
function save2()
{
window.open(canvas.toDataURL('image/png'));
var gh=(canvas.toDataURL('png'));
alert("converted");
}
Run Code Online (Sandbox Code Playgroud) 因此,当我请求我的网络服务下载 zip 文件时,它会秘密下载文件内容,突然间,该文件出现在下载任务栏中,但已下载完整(100%)
使用以下角度方法:
const endpoint = "http://localhost:8080/download/zip"
this.http.get<Blop>(endpoint, {headers: httpHeaders, responseType: 'blob', reportProgress: true })
Run Code Online (Sandbox Code Playgroud)
这就是我的订阅方式:
this.http.get<Blop>(endpoint, {headers: httpHeaders, responseType: 'blob', reportProgress: true }).subscribe({
next: data => {
console.log('blocking or not');
const blob = new Blob([data as any], { type: 'application/zip' });
window.location.href = URL.createObjectURL(blob);
}
})
Run Code Online (Sandbox Code Playgroud)
所以我注意到 myconsole.log(...)直到下载结束才被调用,所以我认为浏览器用户界面无法检测到下载,直到它到达window.location.href.
如何强制传输结束前将下载显示在下载任务栏中,并在浏览器中查看下载进度?我找不到任何与异步 blop 或类似内容相关的内容。
PS:我的后端正在提供数据流,所以后端不是问题。当通过浏览器直接调用我的api时,我们可以在下载任务栏中看到下载进度。不过,如果你们感兴趣,这是片段(spring-boot)
@GetMapping("/download/zip")
fun download(response: HttpServletResponse): StreamingResponseBody {
val file = downloads.download("launcher")
response.contentType = "application/zip"
response.setHeader(
"Content-Disposition",
"attachment;filename=sample.zip"
)
response.setContentLengthLong(file.length())
return StreamingResponseBody { outputStream: …Run Code Online (Sandbox Code Playgroud) 我有文本文件包含CSV文件格式的样本,我希望我的用户可以在链接点击下载该文件.
此文件位于此文件夹结构中:
资产 - > csv->采样CSV-Format.txt
这是我尝试过的代码:
<?php
$file_name = "Sample-CSV-Format.txt";
// extracting the extension:
$ext = substr($file_name, strpos($file_name,'.') + 1);
header('Content-disposition: attachment; filename=' . $file_name);
if (strtolower($ext) == "txt") {
// works for txt only
header('Content-type: text/plain');
} else {
// works for all
header('Content-type: application/' . $ext);extensions except txt
}
readfile($decrypted_file_path);
?>
<p class="text-center">Download the Sample file <a href="<?php echo base_url();?>assets/csv/Sample-CSV-Format.txt">HERE</a> It has a sample of one entry</p>
Run Code Online (Sandbox Code Playgroud)
此代码在页面加载时下载文件而不是链接单击.此外,它正在下载页面的整个html结构我只想要文本文件中我写的文本.
请指导问题在哪里?