Duplicate telemetry events when integrating Application Insights with @azure/monitor-opentelemetry in Next.js

[samnagaraj]

What happened?

Steps to Reproduce

In a nextjs application while trying to track servers-side with appInsights, when we install @azure/monitor-opentelemetry and use the useAzureMonitor. Every telemetry is tracked twice

Expected Result

Single request and list of unique telemetry Events

Actual Result

1. Request get tracked twice, (even in azure webapp)
2. Each event inside the request telemetry is tracked twice (even in azure webapp)

OpenTelemetry Setup Code

export async function register() {
  if (process.env.NEXT_RUNTIME === 'nodejs') {
    console.log("Initializing Azure Application Insights for server-side telemetry...");
    
    
    const connectionString = "<con string"
    
    if (!connectionString) {
      if (process.env.NODE_ENV === 'development') {
        console.warn('⚠ Azure Monitor connection string not configured');
      }
      return;
    }
    
    const { useAzureMonitor } = await import('@azure/monitor-opentelemetry');
    
    
    // eslint-disable-next-line react-hooks/rules-of-hooks
    useAzureMonitor({
      azureMonitorExporterOptions: {
        connectionString,        
      }
    });

  }
}

package.json

"dependencies": {
    "@azure/monitor-opentelemetry": "^1.14.0",
    "next": "^15.5.6",
    "react": "^18.3.1",
    "react-dom": "^18.3.1"
  },
  "devDependencies": {
    "@tailwindcss/postcss": "^4",
    "@types/node": "^20",
    "@types/react": "^18.3.26",
    "@types/react-dom": "^18.3.7",
    "eslint": "^9",
    "eslint-config-next": "16.0.0",
    "tailwindcss": "^4",
    "typescript": "^5"
  }

[bradwestfall]

I was here in issues looking for something else, but is your issue in local env only? If it were, that would possibly be next being in strict mode -- running things like useEffect twice when the component mounts. It's just a blind guess based on useAzureMonitor possibly wrapping useEffect - https://react.dev/reference/react/StrictMode#fixing-bugs-found-by-re-running-effects-in-development

If it doesn't help, sorry for the distraction

[samnagaraj]

Not only in local, Even after deploying to Azure Web app, having the duplicate events.

And this is server-side tracking of Next.js

[JamieDanielson]

@samnagaraj Have you also opened an issue on the azure repo? It seems this may be specific to how that SDK is configured, as opposed to something we have in core opentelemetry-js.

[JamieDanielson]

Also could you confirm what library is producing those spans? I noticed there is some mention in the azure repo about duplicate http spans, which can be fixed by setting environment variable AZURE_HTTP_TRACING_CHILDREN_DISABLED to true. (previously called AZURE_HTTP_TRACING_DISABLED).