Question

我已经完成了很多谷歌搜索并在stackoverflow上搜索了这个并且无法解决这个问题。

我有一个PHP脚本，通过表单按钮运行，以保留对实验室环境中的计算机的访问权限。 PHP脚本运行一些特定于供应商的命令，以生成具有特定权限的用户名和密码。此过程大约需要20秒，并在完成后重定向到另一页。但是在这个过程中，页面只是坐在那里而没有通知用户发生了什么。

我想实施进度条。这个部分很容易记录在太多的地方，但我想要它的工作方式可能是不可能的。我希望在与表单按钮相同的页面上创建进度条，并且能够在进度条和脚本本身之间交换信息（例如，在4个命令中的第二个命令之后将进度条从25更改为50％在脚本中运行。）这可能吗？如果没有，我愿意接受建议。

我已尝试通过运行脚本的onclick动态生成iframe（并将进度条构建到PHP脚本中），但是如何通过iFrame与脚本交换表单数据并更改父级的URL页面似乎超越了我。任何帮助或建议都表示赞赏。

编辑：我已经有一个加载动画在这个过程中运行，一直持续到重定向，但我的目标是用相关的进度条替换它，因为我可以指定一个％甚至是一个消息，说明它在过程中的位置如果这是一个问题。

Answer 1

更新：对许多实用程序函数使用jQuery javascript library。

最基本的方法是在用户提交表单后进行加载动画。类似的东西：

$('#your-form').submit( function() {
    $('body').append('<div class="loading"></div>');

    // perform validation here
    return true; // return false in validation to *not* submit form
});

.loading {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 50px;
    height: 50px;
    margin-left: -25px;
    margin-top: -25px;
    z-index: 99999;
}

下一步是使用AJAX轮询您的服务器，看看它正在执行的任务是否完整。

$('#your-form').submit( function(event) {
    $('body').append('<div class="loading"></div>');

    // perform validation here

    $.post('/url-to-post-to', $(this).serialize(), function(data) {
        var form_status = setInterval( function() {
            $.get('/url-to-poll-status', { id: data.some_id_to_track_form_submission }, function(data) {
                if (data.complete) {
                    clearInterval(form_status);
                    // Do whatever you want, e.g. redirect to another page
                }
            }
        }, 500); // poll every 500ms
    });


    return false; // Always return false because we want to submit via ajax
});

然后还有一个：网络套接字......这并不是所有浏览器都完全支持的，但它已经到了那里。自己研究这个作业：P

AJAX优于正常表单提交的优势是服务器处理长请求所需的时间（您提到的时间长达20多秒）。如果传入的连接数超过服务器的连接限制，此过程会使服务器连接陷入困境，并且可能导致拥塞。

AJAX解决方案不仅仅是对标准表单提交的替换，您还必须进行后端更改：

收到有效的表单提交后，会产生一个处理20s内容的进程
您需要跟踪所有这些流程，即是否已完成
您还需要一个额外的脚本/处理程序，以允许用户查询进程是否已完成。

这个答案并不是一个完整的解决方案，而仅仅是对你需要做什么的洞察。

从脚本运行PHP脚本的进度条

1 个答案: