javascript - 如何在 jsp 页面中显示代表 java servlet 执行的进度条

Question

我发现我的帖子回答了这个问题。但是我不知道如何在我的程序中实现。我的要求如下。

从 jsp 页面，我使用 ajax 调用调用 servlet:

$(document).on('click' , '#gettopevents' , function(event) {


            var field = $("input[name = 'field']").val(); 

            if(field === "")
            {
                $('#responsemsg').html("enter a field");
            }
            else
            {
                var dataform = { 'field' : field };

                $.ajax({
                        url : 'GetAllLogs',
                        type : 'POST' , 
                        data : dataform , 
                        success : function(response) {
                            $('#displaylist').load('listgeneration.jsp');
                        },
                        error : function(){
                            alert("error");
                        }
                });
            }

            event.preventDefault();
    });

servlet的执行是一个激烈的过程，需要一些时间。所以我需要向用户显示一个关于servlet执行状态的进度条。更具体地说，我需要它是这样的。

@WebServlet("/GetAllLogs")
public class GetAllLogs extends HttpServlet
{
    public void doGet(HttpServletRequest request , HttpServletResponse response) throws ServletException , IOException  
    {
          PrintWriter obj = response.getWriter();
          obj.print(10);
          // at this point i need to set the progress bar value to 10%

          ....
          ....

          obj.print(40);
          // at this point i need to change the progress bar value to 40%
         .....
         .....

          obj.print(100);
           //at this point i neet to change the progress bar value to 100%
    }
}

基本上，我需要更新 servlet 中的打印值的状态栏。这种方法是否可行以及我该怎么做。提前致谢

Answer 1

以下是基本步骤:

1. 第一个 ajax 调用启动长时间运行的进程并立即返回。
2. 长时间运行的流程会自行了解需要多长时间，并可以报告*已经走了多远。
3. 另一个端点提供长时间运行的进程的状态。因此，每 1 秒(或任何合理的时间)调用另一个 ajax 调用来获取要在进度栏中显示的数据。

*这可能是一些简单的东西，比如存储在 session 中的AtomicInteger，并随着长时间运行的进程完成其工作而更新。但是，长时间运行的进程可能位于某个其他 JVM 上，或者提供状态的端点可能位于某个其他 JVM 上。如果是这种情况，启动长时间运行的进程的初始调用应提供与该进程关联的唯一 token 。长时间运行的进程使用 token 作为 key 来更新某些共享存储，例如数据库。 token 被传递到提供状态的端点以查找状态。

编辑以添加其他上下文

ajax 调用 https://.../api/long/running/process/start

当这个 ajax 调用返回时，它会调用另一个方法来开始轮询后端。 (基于此other post。)

        $.ajax({
                    url : https://.../api/long/running/process/start,
                    type : 'POST' , 
                    data : dataform , 
                    success : function(response) {
                        pollForLongRunningStatus(response);
                    },
                    error : function(){
                        alert("error");
                    }
            });
        }

        pollForLongRunningStatus(response) {
           $.post('https://.../api/long/running/process/status', function(data) {
           alert(data);  // update the progress bar
           setTimeout(pollForLongRunningStatus, 1000);
          });
        }

假设起始 URL 由下面的类处理 - 此类启动长时间运行的进程并立即返回非常重要，因此它需要作为 asnych 任务运行。 (如何做到这一点取决于后端框架(如果有)。)

@WebServlet("/.../api/long/running/process/start")
public class LongRunningProcessStartHandler extends HttpServlet  {
    public void doGet(HttpServletRequest request , HttpServletResponse response) throws ServletException , IOException  {

    AtomicInteger percentComplete = new AtomicInteger(0);
    request.getSession().setAttribute("LONG_RUNNING_PROCESS_STATUS", percentComplete);

    LongRunningProcess lrp = new LongRunningProcess(percentComplete);
    lrp.start();

}

public class LongRunningProcess extends Thread {
   private final AtomicInteger percentComplete;

   public LongRunningProcess(AtomicInteger percentComplete) {
       this.percentComplete = percentComplete;
   }

   public void run() {
       for (int i = 0; i < 100; i++) {
       Thread.sleep(1000);
       percentComplete.incrementAndGet();
   }
}

同时，状态 URL 仅报告完成百分比。假设此类处理状态端点:

@WebServlet("/.../api/long/running/process/status")
public class LongRunningProcessStatusHandler extends HttpServlet  {
    public void doGet(HttpServletRequest request , HttpServletResponse response) throws ServletException , IOException  {

    return request.getSession().getAttribute("LONG_RUNNING_PROCESS_STATUS").get();
}

这就是总体思路。 (上面的代码无法编译，需要设置为 null 安全。)当值达到 100 时，从 session 中删除该对象以保持 session 干净。