如何在jQuery中显示服务器脚本的进度?

时间:2020-03-05 18:55:45  来源:igfitidea点击:

通过以下代码,我可以在服务器脚本运行时显示动画的gif:

function calculateTotals() {
    $('#results').load('getResults.php', null, showStatusFinished);
    showLoadStatus();
}

function showLoadStatus() {
    $('#status').html('');
}

function showStatusFinished() {
    $('#status').html('Finished.');
}

但是,我想显示脚本的运行状态,例如"正在处理20000的第342行...",直到完成为止。

我怎样才能做到这一点?我可以制作一个不断包含更新信息的服务器脚本,但是我应该在哪里放置命令以每秒读取一次?

解决方案

回答

服务器端脚本应以某种方式将其进度保持在服务器上的某个位置(文件,数据库中的字段,memcached等)。

我们应该具有返回当前进度的AJAX函数。每秒轮询一次此功能,并相应地渲染结果。

回答

不知道服务器端代码的工作方式就很难说。但是,该过程分为三个阶段。首先,我们需要调用工作创建脚本。这将返回一个ID号并设置服务器的工作状态。接下来,大约每隔一秒钟,我们需要调用一个状态脚本,该脚本返回要显示的状态消息。该状态脚本还需要返回一个值,该值指示作业是否已完成。当状态脚本显示作业已完成时,我们将停止轮询。

如何获取此状态脚本是要知道作业的状态在很大程度上取决于服务器的设置方式,但可能涉及在作业过程中的各个时间点将消息写入数据库表。然后,状态脚本从数据库中读取此消息。

回答

我对jQuery的细节不满意,但是不涉及轮询的一般答案是:使用forever frame技术的变体。基本上,创建一个隐藏的iframe,并将其src设置为" getresults.php"。在getresults中,我们可以"流送"回脚本块,这些脚本块是对父文档中实际更新进度的javascrpt函数的调用。这是一个显示永久框架背后基本概念的示例。 (尽管如此,我不建议使用他的实际JS或者HTML,这是合理的平均水平)

回答

阅读我们对安德鲁答案的评论。

我们将读取以下状态:

function getStatus() {
    $.getJSON("/status.php",{"session":0, "requestID":12345}, 
    function(data) { //data is the returned JSON object from the server {name:"value"}
          setStatus(data.status);
          window.setTimeout("getStatus()",intervalInMS)
    });
}

使用这种方法,我们可以在服务器上同时打开几个XHR请求。

关于输出的所有status.php是:

{"status":"We are done row 1040/45983459"}

但是,我们可以在响应中输出所需的尽可能多的信息,并进行相应的处理(例如,输入进度条或者执行动画。)

有关$ .getJSON的更多信息,请参见http://docs.jquery.com/Ajax/jQuery.getJSON