从服务器下载文件时显示进度条

javascript jquery java progress-bar

2022-09-04 21:32:51

我需要向请求下载文件的用户显示进度条。我正在使用 J2EE 应用程序来生成文件。用户将提交表单数据以获取文件。服务器操作所有提交的数据，生成PDF文件并将其发送回客户端。

因此，我想向用户显示一个进度条，直到文件到达客户端。有没有办法做到这一点？

答案 1

如果我理解你很好，你想显示一个进度条，直到你的服务器准备好发送文件，而不是显示下载文件的进度。

如果这是真的，你正在处理一个艰难的练习。可靠的进度条需要知道（非常准确）您正在做什么以及需要多长时间。在你的情况下，有很多不可靠的因素（其中之一，也许是最大的，是网络本身）。

因此，大多数开发人员使用某种“无尽”动画来显示“正在进行的工作”。

更新

根据您的评论，显示“正在进行的工作”动画的最简单方法如下所示

$.ajax({
    url:      "/myscripts/myserverscript",
    type:     "POST",
    data:     {
       foo: "bar"
    },
    dataType: "text",
    beforeSend: function(xhr){
        // display a progress animation
    },
    complete: function(xhr, status){
        // hide the animation
    }
    ...
});

在单个请求的情况下。您还可以为（和）设置一个全局 ajax 事件处理程序，以设置显示/隐藏功能。.ajaxStart().ajaxStop()

References： .ajax（）， .ajaxStart（）， .ajaxStop（）

答案 2

服务器端文件生成的进度条：

我们假设服务器需要几秒钟才能生成文件。此事件由原始请求（阻塞操作）触发。完成此操作后，将生成文件，并将其发送回客户端。

同时，您希望通过其他请求（ajax）调用服务器，并为当前为特定用户生成的文件获取百分比。

这里的胶水部分是：

当原始请求生成文件时，它需要以频繁的时间间隔（即每10%）存储进度。在 http 会话中存储此数据将正常工作。
其他请求（ajax）只需要能够从 http 会话中提取此信息
在http会话上同步（序列化访问）是一些Web应用程序通常做的事情，这是不可能的，因为其他请求（ajax）只会阻止，直到原始请求完成
在客户端，它都是html + javascript，以提供您需要的交互（动画进度条）。即使间隔非常粗糙（从 10% 跳到 20% 再到 30%），您也可以使用 jQuery 对条形图进行动画处理。我过去做过一次，看起来很棒。

文件下载进度条：

最好将此留给浏览器的本机对话框。