设置AJAX进度条

Question

Ok im新增AJAX。有一种知道请求的生命周期的方式，IE使用ActiveXObject类似的东西。

但是现在我正面临现实世界的问题。我有一个运行在后台的servlet执行许多任务，我想显示一个进度条来显示进程所处的位置，并显示实际发生的事情。

到目前为止，在服务器端，我可以计算在开始之前会发生的进程数，并且很容易在每个进程完成后添加一个计数器以增加 - 因此可以找到我希望显示的百分比。

在哪里我应该输出从增量等收集的数据我不知道迄今为止它是处于休眠状态，因为在处理java类中的2个整数。

任何帮助将不胜感激。

到目前为止，我已看过this，我想这就是我想要的。

干杯。

Answer 1

基本上，您希望存储对任务的引用，并且本身也会在HTTP会话中（或者在涉及应用程序范围任务的Servlet上下文中）存储它的进度。这样，您必须能够在每个HTTP请求中检索有关它的信息。

在JavaScript中，您可以使用setTimeout()或setInterval()在特定超时或特定间隔后执行函数。您可以使用它来重复触发Ajax请求以请求进度的当前状态。一旦检索到状态，例如在最大值为100（百分比）的整数的味道中，只需更新表示进度条的一些div和/或相应HTML DOM树中的百分比文本。

jQuery在解决Ajax请求和遍历/操纵HTML DOM树时非常有用。它最大限度地减少了代码冗长和交叉浏览器兼容性问题。

试想一下，该servlet看起来像这样的doGet()：

protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException { 
    String processId = "longProcess_" + request.getParameter("processId"); 
    LongProcess longProcess = (LongProcess) request.getSession().getAttribute(processId); 
    int progress = longProcess.getProgress(); 

    response.setContentType("application/json"); 
    response.setCharacterEncoding("UTF-8"); 
    response.getWriter().write(String.valueOf(progress)); 
} 

然后你可以使用它像如下：

function checkProgress() { 
    $.getJSON('progressServlet?processId=someid', function(progress) { 
     $('#progress').text(progress + "%"); 
     $('#progress .bar').width(progress); 

     if (parseInt(progress) < 100) { 
      setTimeout(checkProgress, 1000); // Checks again after one second. 
     } 
    }); 
}