如何更新Web Profiler工具栏以显示有关ajax请求的数据

时间:2013-07-15 02:59:31

标签: javascript jquery symfony

我目前正在构建一个完全支持ajax页面加载的应用程序。在初始页面加载后,浏览网站只会加载内容而不是标题或菜单。

整个应用程序运行良好,但我想刷新Web Profiler工具栏以显示最后的ajax请求信息。

我从响应头获取了xdebug令牌,我正在尝试扩展javascript部分以替换工具栏的当前内容,但我还没有成功。

我怎样才能做到这一点?我应该注意哪些具体内容?

2 个答案:

答案 0 :(得分:7)

我最终“反向设计”了对象load的{​​{1}}方法,结果证明它工作得非常好。

这是解决方案

Sfjs

答案 1 :(得分:0)

我带着我自己的工具栏版本 请参阅代码的注释。



$(function () {
    /**
     * When we make an ajax request, a new debug toolbar is created on top of the previous one, so that we can
     * keep track of every request made to the page.
     *
     * @see http://funktion-it.co.za/2012/12/update-symfony-2-debug-bar-on-each-ajax-call/
     * @see https://gist.github.com/pinano/5677062
     * @see http://stackoverflow.com/questions/17646127/how-to-update-the-web-profiler-toolbar-to-show-data-about-an-ajax-request
     * @param  event
     * @param  XMLHttpRequest
     * @param  ajaxOption
     */
    $(document).ajaxComplete(function (event, XMLHttpRequest, ajaxOption) {
        if (XMLHttpRequest.getResponseHeader('x-debug-token')) {
            // window.location.protocol + '//' + window.location.hostname +
            // the url with the debug token
            var url = '/app_dev.php/_wdt/' + XMLHttpRequest.getResponseHeader('x-debug-token');
            // If the Sfjs object exists
            if (typeof Sfjs !== "undefined") {
                // create a new id
                var id = 'sfwdt' + XMLHttpRequest.getResponseHeader('x-debug-token');
                // when the first ajax call is made
                if ($('.sf-toolbar').length === 1) {
                    // clone the default debug toolbar
                    var clone = $('.sf-toolbar:eq(0)').clone(true);
                    // change the id of the clone (you cannot have the same id twice)
                    // fmake sure the toolbar containing info about the ajax call
                    // is the one on the bottom
                    clone.attr('id', id).find('.sf-toolbarreset, .sf-minitoolbar').css('bottom', '+=0px');
                    // hide the main toolbar (for improved visual experience)
                    $('.sf-toolbar:eq(0)').find('a.hide-button').click();
                    // and mage sure it will be located on top of the new toolbar
                    $('.sf-toolbar:eq(0)').find('.sf-toolbarreset, .sf-minitoolbar').css('bottom', '+=38px');
                    // append the clone after the main toolbar
                    // append after because you want the main toolbar to
                    // continuously be updated with each ajax call
                    $('.sf-toolbar:eq(0)').after(clone);
                } else {
                    // if a repeated ajax call
                    // just update the second toolbar (not the default)
                    $('.sf-toolbar:eq(1)').attr('id', id);
                }
                // Load the data of the given xdebug token into the current toolbar wrapper
                Sfjs.load(id, url);
            }
        }
    });
});