How to get response body in appInsight

[madebymt]

Is your feature request related to a problem? Please describe. I can see 400, 500 error status for API call, but there's no error response for us to see, can we get response body like web browser will have?

I don't see I see the setting in the doc here: https://learn.microsoft.com/en-us/azure/azure-monitor/app/javascript-sdk-advanced Using version: "@microsoft/applicationinsights-web": "^2.8.9", Thanks for guidance.

[MSNev]

As mentioned in #2031, I'd recommend using a dependency listener to get the context that you want to include (stuff it into the context details.context) and then pull it out in the dependency initializer (also via the details.context) and the add to the event details.item so that it is include and sent to the Azure Monitor store. As this would be a non-standard field it will (most likely) be only visible on the details log (or dependency) details (assuming you put it on the properties).

We are in the process of reworking our documentation (started in Feb' 23) and this one has not yet made it's way to the learn.microsoft.com pages yet.

[madebymt]

After reading the dependency documentation here I'm still not quite clear how to implement this. And how is this details.traceId = ""; going to receive and log for the request body? Do you have other doc or sample I can check? Thanks!

[MSNev]

Yeah, getting access to the "response" is not quite so straight forward. There is an example (it may be more confusing) which shows using the dependency listener and initializer (which is what you will have to do). https://github.com/microsoft/ApplicationInsights-JS/blob/main/examples/dependency/src/dependencies-example-index.ts

For the sequence of events.

• The dependency listener is called "before" the request is sent
• The dependency initialized is called "after" the response has been received

So the "listener" has complete access to the XHR / fetch object before the request is sent (so you can change anything of the objects) so this can be accessed via the details object passed to the listener

    // You have complete access to the xhr instance
    // details.xhr: XMLHttpRequest;

    // Or if a fetch request you have complete access to the input and init objects
    // details.input: Request | string;
    // details.init: RequestInit;

It also contains a context object via details.context which is also available in the dependency initializer, this is how you would "pass" details from the listener to the initializer (including putting the xhr into the context) and then reading the response. Looking at the "fetch" usage, there I can't see a concrete/realiable way of always getting access the raw response object.

So simplistically, you would add a listener which would put the details.xhr into the details.context probably as details.context.xhr = details.xhr and then in the initializer you could access the xhr instance via the details.context.xhr that you put there eariler.

[jvtroyen]

I was able to use this approach for logging the REQUEST body, but where can I get access to the RESPONSE body?