CODEWITHSUNDEEP
javascriptazure-application-insights
Christopher Klein
Christopher Klein

Reputation: 2793

How can I get proper JavaScript logging for Application Insights

I'm hoping that someone can answer a question of why logging occurs in one location but not in another. I am using the snippet-based-setup to enable the logging and I have two simple test logs that I entered into JavaScript that I have on the page.

$(document).ready(function () {
    RetrieveSessionData(function (d) {
        formData = d;
        var prop = { "SessionCode": getSessionCode() };
        var met = { "model risk type": formData.projectionData.modelRiskType };
        appInsights.trackEvent("ACTIONS-JS-READY", prop, met);
        appInsights.trackEvent("ACTIONS-JS-READY2", "prop", "met");
        appInsights.flush();
    });
    var properties = { "SessionCode": getSessionCode() };
    var metrics = { "metrics field": 10 };
    appInsights.trackEvent("ACTIONS-JS", properties, metrics);
    appInsights.flush();
});

The appInsights.trackEvent lines in the RetrieveSessionData function do not log anything, nor do they return any sort of error/message at all letting me know there is an issue. The one at the bottom of the script, outside of the function, does log a custom event into application insights.

What am I missing on this? I haven't found any specific examples on the proper way to do JavaScript logging inside of functions or can it not be done?

Upvotes: 0

Views: 1544

Answers (1)

Tiny Wang
Tiny Wang

Reputation: 15906

As OP said in the comment, code snippet on the Microsoft site will work.

I'm not sure, but I tested in my side, it really worked, here's my code. Did you check if your code in the parameter of RetrieveSessionData has executed?

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <title></title>
        <script type="text/javascript">
            snippet-code-copy-from-tutorial-here
                instrumentationKey: "ceec379c-xxxxx-4296327"
            }});
        </script>
        <script src="../js/jquery-3.5.1.min.js"></script>
    </head>
    <body>
        <div>this is page</div>
        <script>
            $(document).ready(function() {
                console.log("============execute===============");
                   RetrieveSessionData(function (d) {
                       formData = d;
                       var prop = { "SessionCode": "aa" };
                       var met = { "model risk type": "bbb" };
                       appInsights.trackEvent("ACTIONS-JS-READY", prop, met);
                       appInsights.trackEvent("ACTIONS-JS-READY2", "prop", "met");
                       appInsights.flush();
                   });
                
                console.log("============execute222===============");
                var properties = {
                    "SessionCode": "session_code_01"
                };
                var metrics = {
                    "metrics field": 10
                };
                appInsights.trackEvent("ACTIONS-JS", properties, metrics);
                appInsights.flush();
            });
            
            function RetrieveSessionData(func){
                func();
            }
        </script>
    </body>
</html>

screenshot custom properties

Upvotes: 1

Related Questions