javascript - 正在下载的文件没有正确的名称和扩展名

标签 javascript html file download

在我的项目中,我有一个下载文件的功能,文件如下所示。当我单击超链接时,它将触发下载,但没有正确的名称和文件扩展名。但在超链接中,文件的确切名称被提及为 angular-treasure-overlay-spinner-master.zip

谁能告诉我如何下载超链接中指定的确切名称的文件(angular-treasure-overlay-spinner-master.zip)

<强> Working Demo

<div class="well text-left">
     <img src="https://api.kandy.io/v1.2/devices/content/thumbnail?key=UAT5b6f2e196b0a4e0793ff17ac44b6404c&amp;content_uuid=7DF8CD44-B614-4C4A-82F3-1C5E36B4CC02&amp;device_id=FF4A88BA0C2840749D5AB91584C29E4D&amp;thumbnail_size=500x500" style="width: 20px;"/>
     <a href="https://api.kandy.io/v1.2/devices/content?key=UAT5b6f2e196b0a4e0793ff17ac44b6404c&amp;content_uuid=7DF8CD44-B614-4C4A-82F3-1C5E36B4CC02&amp;device_id=FF4A88BA0C2840749D5AB91584C29E4D" target="_blank">angular-treasure-overlay-spinner-master.zip</a>
</div>

最佳答案

对正在观看的人来说,主要编辑是好的

https://github.com/eligrey/FileSaver.js/ 获取 FileSaver 后并将其添加到您的页面:

function getAndSaveUrl(url, name, mime) {
    var xhr = new XMLHttpRequest();
    xhr.open('GET', url, true);
    xhr.responseType = 'blob';

    xhr.onload = function(e) {
      if (this.status == 200) {
        var blob = new Blob([this.response], {type: mime});
        saveAs(blob, name); // Note: this is the FileSaver.js function
      }
    };
    xhr.send();
}

添加此功能

function doDownload(el) {
    getAndSaveUrl(el.href, el.textContent, "application/zip");
    return false;
}

将上面的 html 更改为

<div class="well text-left">
     <img src="https://api.kandy.io/v1.2/devices/content/thumbnail?key=UAT5b6f2e196b0a4e0793ff17ac44b6404c&amp;content_uuid=7DF8CD44-B614-4C4A-82F3-1C5E36B4CC02&amp;device_id=FF4A88BA0C2840749D5AB91584C29E4D&amp;thumbnail_size=500x500" style="width: 20px;"/>
     <a href="https://api.kandy.io/v1.2/devices/content?key=UAT5b6f2e196b0a4e0793ff17ac44b6404c&amp;content_uuid=7DF8CD44-B614-4C4A-82F3-1C5E36B4CC02&amp;device_id=FF4A88BA0C2840749D5AB91584C29E4D" onClick="return doDownload(this);">angular-treasure-overlay-spinner-master.zip</a>
</div>

在 Firefox 中进行了测试,直到 saveAs 为止的所有内容都有效 - 尚未测试该部分,因为 jsfiddle 没有可用的 FileSaver.js - 但我在工作中使用 fileSaver,并且没有遇到任何问题

关于javascript - 正在下载的文件没有正确的名称和扩展名,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/31221295/

相关文章:

javascript - React 背景中的内联样式 : linear-gradient

html - 在 Ajax 将数据插入 html 代码块后,格式化预 block 以删除第一个缩进?

c# - 如何创建文本文件,并用文本框或变量命名

c - 在 C 中的 I/O 期间打印的交替行

c# - FileSystemWatcher 有一个奇怪的行为

javascript - 蒙戈数据库;即使用户对象成功更新, postman 也会给出错误

Controller 重定向后,Javascript 不会在 View 中执行

javascript - 在 Angular2 中使用可观察的与其他组件的对话,不接收即将到来的值

html - 如何在 iOS 上将数据转换为 CSV 或 HTML 格式?

html - svg 中矩形的阴影