Javascript 如何在jsp页面中显示表示Javaservlet执行的进度条

Javascript 如何在jsp页面中显示表示Javaservlet执行的进度条,javascript,java,ajax,jsp,jquery-ui-progressbar,Javascript,Java,Ajax,Jsp,Jquery Ui Progressbar,我看到我的帖子回答了这个问题。但我不知道如何在我的程序中实现。我的要求如下 从jsp页面,我使用ajax调用调用servlet: $(document).on('click' , '#gettopevents' , function(event) { var field = $("input[name = 'field']").val(); if(field === "") { $('

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

从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中更新状态栏以获得永久打印值。这种方法可行吗?我该怎么做。
提前感谢

以下是基本步骤:

  • 第一个ajax调用启动了长时间运行的进程,立即返回
  • 长时间运行的流程能够自我意识到需要多长时间,并能够报告进程的进展情况
  • 另一个端点提供长时间运行的进程的状态。因此,每隔1秒(或任何合理的时间)调用另一个ajax调用,以获取要显示在进度条中的数据
  • *这可以是存储在会话中的
    AtomicInteger
    之类的简单内容,并随着长时间运行的进程的工作而更新。但是,长时间运行的进程可能在其他JVM上,或者提供状态的端点可能在其他JVM上。如果是这种情况,启动长时间运行的流程的初始调用应该提供一个与流程相关联的唯一令牌。长时间运行的进程使用令牌作为密钥更新一些共享存储,例如数据库。令牌被传递给提供状态以查找状态的端点

    编辑以添加其他上下文

    ajax调用

    当这个ajax调用返回时,它调用另一个方法,该方法开始轮询后端。(基于此)

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


    这是总的想法。(上面的代码无法编译,需要设置为空安全。)当值达到100时,从会话中删除对象以保持会话干净。

    以下是基本步骤:

  • 第一个ajax调用启动了长时间运行的进程,立即返回
  • 长时间运行的流程能够自我意识到需要多长时间,并能够报告进程的进展情况
  • 另一个端点提供长时间运行的进程的状态。因此,每隔1秒(或任何合理的时间)调用另一个ajax调用,以获取要显示在进度条中的数据
  • *这可以是存储在会话中的
    AtomicInteger
    之类的简单内容,并随着长时间运行的进程的工作而更新。但是,长时间运行的进程可能在其他JVM上,或者提供状态的端点可能在其他JVM上。如果是这种情况,启动长时间运行的流程的初始调用应该提供一个与流程相关联的唯一令牌。长时间运行的进程使用令牌作为密钥更新一些共享存储,例如数据库。令牌被传递给提供状态以查找状态的端点

    编辑以添加其他上下文

    ajax调用

    当这个ajax调用返回时,它调用另一个方法,该方法开始轮询后端。(基于此)

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


    这是总的想法。(上面的代码无法编译,需要设置为空安全。)当值达到100时,从会话中删除对象以保持会话干净。

    感谢您的响应,我是一个初学者,很抱歉我能理解整个概念。你能给我一些关于开始的参考资料或一些示例代码吗?如果你能,请给我一些关于你的第三点的更多内容。我添加了更多细节。希望这有帮助!现在我理解并将实现它。非常感谢您的帮助非常感谢它对我的帮助。我目前遇到一个问题。当尝试使用post方法调用第二个servlet时,我遇到了404错误。我应该如何给出url路径。我基本上将我所有的类文件包装到一个jar中,并将其放入WEB-INF/lib中谢谢你的回复,我是一个初学者,很抱歉我能理解整个概念。你能给我一些关于开始的参考资料或一些示例代码吗?如果你能,请你给我一些关于你第三点的更多内容。我添加了更多细节。希望这有帮助!现在我理解并将实现它。非常感谢您的帮助非常感谢它对我的帮助。我目前遇到了一个问题。当尝试使用post方法调用第二个servlet时,我遇到了一个404错误。我应该如何给出url路径。我基本上将所有类文件包装到一个jar中,并将其放入WEB-INF/lib目录中
            $.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);
              });
            }
    
    @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();
       }
    }
    
    @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();
    }