设置AJAX进度栏

小编典典

设置AJAX进度栏

ajax

好的，我是AJAX的新手。IE知道请求的生命周期，因此使用了ActiveXObject这样的东西。

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

到目前为止，在服务器端，我可以计算将要开始的进程数，并且可以轻松地添加一个计数器，以便在每个进程完成后递增-因此使我能够找到自己想要显示的百分比。

关于我应该输出从增量等收集的数据的位置，我不确定到目前为止在处理java类中它是否休眠为2个整数。

任何帮助将非常感激。

到目前为止，我已经看到了，在此，我想这就是什么样的即时通讯瞄准。

干杯。

阅读 218

2020-07-26

共1个答案

小编典典

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

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

jQuery在引发ajaxical请求以及像这样遍历/操纵HTML
DOM树时非常有帮助。它最大程度地减少了代码冗长和跨浏览器兼容性的麻烦。

想象一下doGet()servlet的如下：

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.
        }
    });
}

2020-07-26