Search code examples
extjsservicestackmvc-mini-profiler

ServiceStack MiniProfiler Ajax Requests Logging

So, in my Index.cshtml page, when I initially load up the page I have:

@inherits ViewPage
<!DOCTYPE html>
<html>
    <head>
        <script type="text/javascript" src="ext-all-debug.js"></script>
        <script type="text/javascript" src="app.js"></script>
        <script type="text/javascript" src="app.ext.js"></script>
        <script type="text/javascript" src="dump.js"></script>
        @ServiceStack.MiniProfiler.Profiler.RenderIncludes().AsRaw() 
    </head>
    <body> 
    </body>
</html>

enter image description here

All good, I can see it profiling index, a bunch of ExtJS, and the 1st ajax call to my ServiceStack on server side (in /api/session).

Now, in my ExtJS form I have a Customers tab when I click it sends ajax request to /api/customers and I have a tab when I click it calls /api/orders.

But, then when I start to click on, say Customers tab, Miniprofiler does not add any subsequent ajax requests into the list any more? I thought Miniprofiler can log ajax requests nothing special needs to be done? Why is it not logging subsequent ajax requests for me? I am missing something?

Solution

  • The current version available through Nuget doesn't support intercepting ExtJS ajax calls. It seems that there is a pull request for that feature, but it isn't available yet.

    Here's what I had to do to get around that:

    Ext.require('Ext.Ajax');
Ext.onReady(function () {
    Ext.Ajax.on('requestcomplete', function (e, xhr, settings) {
        if (typeof (MiniProfiler) != 'undefined') {
            var stringIds = xhr.getResponseHeader('X-MiniProfiler-Ids');
            if (stringIds) {
                var ids = typeof JSON != 'undefined' ? JSON.parse(stringIds) : eval(stringIds);
                MiniProfiler.fetchResultsExposed(ids);
            }
        }
    });
});