自定义下载管理器JavaScript

Question

自定义下载管理器JavaScript

11

一个称为 mega.com 的文件共享网站有一个功能，可以创建自定义的下载管理器。当你下载一个文件时，它会在网站上显示一个自定义的进度条（可能正在将文件加载到缓存中），然后创建一个缓存文件的下载提示框。如何使用JavaScript实现这个功能？

- Potassium Ion

您可以使用普通的ajax2请求（responseType='blob'），在此过程中显示进度，然后使用URL.createObjectURL(xhr.response)来提供<a download>。 - dandavis

这个怎么样？http://stackoverflow.com/questions/11265917/javascript-source-file-download-progress - Pham Tung

2个回答

1

针对您的问题，这里有一个完整的答案：http://tonistiigi.github.io/mega/。

如果你想在JavaScript中创建一个下载管理器，这些文章将帮助你完成工作：

如果您想创建文件下载进度，请访问此链接: JavaScript源文件下载进度？。

请在您的工作中投入更多思考、时间和精力，以完成工作。如果您无法做到，请在我的回答下方发表评论；我会帮助您详细解决。

- r5d

链接返回404错误。 - Prakhar

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- Luke · Accepted Answer

据我所知，Mega.com使用内部下载管理器是因为他们在服务器上以加密形式存储数据；加密和解密过程发生在浏览器中。

存储

您可以使用IndexedDB来存储二进制数据。这里有一个Mozilla的教程，讲解如何使用AJAX下载图像并将其保存在IndexedDB中。

当您在IndexedDB中存储数据时，应该有机会从内部浏览器存储中下载它。这里可以阅读如何创建下载提示的方法。

进度条

使用XMLHttpRequest时，您可以通过为progress事件提供处理程序来获取下载进度。

var oReq = new XMLHttpRequest();

oReq.addEventListener("progress", updateProgress, false);

[...]

function updateProgress (oEvent) {
  if (oEvent.lengthComputable) {
    var percentComplete = oEvent.loaded / oEvent.total;
    // ...
  } else {
    // Unable to compute progress information since the total size is unknown
  }
}

如果服务器在头部信息中未发送 Content-Length，则文件的总大小将不可用。

在MDN上查看完整源码和介绍。