Tolsan Tolsan - 27 days ago 15
React JSX Question

Azure Applications Insights node js module not working - Fetch API cannot load error

I am trying to integrate npm's application insights module (https://www.npmjs.com/package/applicationinsights) into my React js application.

My source for doing this is:

import appInsights from 'applicationinsights';
appInsights.setup(applicationInsightsKey).start();


The problem I got is that in my Chrome Developer tools I can see a preflight request made to https://dc.services.visualstudio.com/v2/track.
But in the console I can see the following error:


"Fetch API cannot load https://dc.services.visualstudio.com/v2/track.
Request header field content-encoding is not allowed by
Access-Control-Allow-Headers in preflight response."


Do you have an idea how can I fix this issue?

Answer

The node.js module you are using is the AI SDK for Node.js server. And As the React js applications are client applications in javascript, technically they are different.

Please try to use ApplicationInsights-JS.

Additionally, you can refer to https://azure.microsoft.com/en-us/documentation/articles/app-insights-web-track-usage/ for more info.