ajax请求的五个步骤_监控整个页面，非AJAX，需要通知

ajax请求的五个步骤

最近，在JSF中开发新图表和图表“导出服务”时，我遇到了一个非常普遍的问题。 当您执行长时间运行的任务(操作)时，您希望在开始时显示状态“请稍候……”对话框，并在响应到达时最后关闭此对话框。 对于AJAX请求，这不是问题，但对于将一些二进制内容流式传输到浏览器的非AJAX请求而言，则是有问题的。 为了解决此问题，我们可以使用与PrimeFaces中的FileDownload组件相同的技术。 我们可以设置一个特殊的cookie作为响应，并在客户端定期检查此cookie(如果已设置)。 设置此Cookie后，我们可以关闭打开的对话框。 可以在JSF中将cookie设置为：

// set cookie to be able to ask it and close status dialog for example
FacesContext.getCurrentInstance().getExternalContext().addResponseCookie(
             "cookie.chart.exporting", "true", Collections.<String, Object>emptyMap());

Non AJAX按钮执行一个JavaScript函数，即monitorExporting，它具有两个参数，这些参数代表在请求/响应生命周期的开始和结束时要调用的另一个JavaScript函数。

<p:commandButton value="Export to PNG" ajax="false" action="#{combiChartController.exportToPng}"
             onclick="monitorExporting(start, stop)"/>

PrimeFaces已经提供了一些方法来检查是否启用了cookie，以获取和删除它们。 所以，我们可以写

function monitorExporting(start, complete) {
    if(PrimeFaces.cookiesEnabled()) {
        if(start) {
           start();
        }

        window.chartExportingMonitor = setInterval(function() {
            var exportingComplete = PrimeFaces.getCookie('cookie.chart.exporting');

            if(exportingComplete === 'true') {
                if(complete) {
                    complete();
                }

                clearInterval(window.chartExportingMonitor);
                PrimeFaces.setCookie('cookie.chart.exporting', null);
            }
        }, 150);
    }
}

使用setInterval(…)定期询问cookie。 功能开始显示“请稍候……”对话框，功能停止将其关闭。

<script type="text/javascript">
/* <![CDATA[ */
    function start() {
        statusDialog.show();
    }

    function stop() {
        statusDialog.hide();
    }
/* ]]> */
</script>

如果禁用了cookie，则当然不会显示任何内容，但是通常很少见。

参考：监视整个页面，非AJAX，要求从我们的JCG合作伙伴Oleg Varaksin收到有关软件开发博客上的想法的通知。

翻译自: https://www.javacodegeeks.com/2013/07/monitor-full-page-non-ajax-requests-to-be-notified.html

ajax请求的五个步骤