客户端脚本在客户端系统内使用文件下载选项

Question

我们正在开发让用户可以下载MP3文件的功能。我们正在开发一个可以完全在本地系统执行而无需服务器的应用程序。

但是，在大多数浏览器中，下载mp3文件的选项都无法正常工作。它会在大多数浏览器中打开内置媒体播放器。

我们已经检查了解决方案，得到的答案是在服务器端使用标题设置'content-disposition'或使用PHP或ASP脚本使其可下载。

我还查看了jquery filedownload.js插件，它也有一个类似于设置content-disposition和set-cookie的部分。

所以我想知道是否可能只使用客户端脚本（如Javascript或jQuery）创建适用于所有浏览器的文件下载链接（用于MP3）。

重要提示：

实际上，该过程不是从服务器下载文件，而是从客户端系统本身下载文件。

也就是说，MP3文件应该从一个位置（目录）复制到客户端系统中的另一个位置。

- Ranjithsun

---

只是为了确认一下，您无法更改提供mp3的服务器的标头吗？ - Dcullen

Answer 1

这个解决方案需要浏览器支持XHR2（http://dvcs.w3.org/hg/xhr/raw-file/tip/Overview.html）。

它将会把MP3下载到一个blob中，然后创建一个URL以便访问该blob。在此过程中，您可以覆盖Mimetype并设置为您所需的任何类型。

window.URL = window.URL || window.webkitURL;

    var xhr = new XMLHttpRequest();
    xhr.open('GET', 'http://robtowns.com/music/blind_willie.mp3', true);
    xhr.responseType = 'blob';
    xhr.overrideMimeType('application/octet-stream');
    xhr.onload = function(e) {
        if (this.status == 200) {
            var blob = this.response;
            $('#link').html('<a href="'+window.URL.createObjectURL(blob)+'">Download</a>');
        }
    };

    xhr.send();

JSfiddle的示例要求您在浏览器中关闭Web安全性，以允许跨域请求。 http://jsfiddle.net/D2DzR/3/

- Dcullen

---

感谢您的回复，Dcullen。我们正在检查XHR2方法。但是它不支持IE浏览器。我们有其他方法可以在Chrome和Firefox中使用。我们需要一种适用于IE浏览器的方法。 - Ranjithsun