"Custom" traces not creating when Next.js Vercel instrumentation is on.

[rovnyart]

We have a Next.js 14 app deployed to Vercel, which uses vercel AI SDK. We successfully added langfuse telemetry via instrumentation hook:

registerOTel({
    serviceName: 'kespa-v2',
    traceExporter: new LangfuseExporter(),
  });

We are collecting telemetry to our Langfuse project with ai sdk experimental_telemetry, like this:

 experimental_telemetry: {
      isEnabled: true,
      functionId: 'exercises',
      metadata: {
        userId,
        tags: ['sentence-generation'],
      },
    },

Everything works fine, but now we need to make some "custom" traces, distributed among several services, and after doing some research we decided to try to do it via Langfuse, since it provides a way to use custom trace ids and not to share generated trace ids between services.
So we added "langfuse" package to our app, created a client (src/lib/langfuse.ts):

import { Langfuse } from 'langfuse';

import { logger } from './logging/logger';

export const langfuse = new Langfuse();

langfuse.on('error', error => {
 logger.error({
   context: 'langfuse',
   meta: {
     message: error.message,
     stack: error.stack,
   },
 });
});

And then tried to created custom trace in one of our API endpoints (src/pages/api/webhook.ts) like this:

const trace = langfuse.trace({
            id: room.id,
            name: 'lesson-analysis',
            metadata: {
              roomId: payload.body.roomId,
            },
          });

          const span = trace.span({
            name: 'webhook',
          });

          await prisma.liveDigitalCalls.update({
            where: {
              id: room.id,
            },
            data: {
              recordId: payload.body.recordId,
            },
          });

          span.end();

After deploying code to production we noticed that webhook endpoint fires, no traces are creating in Langfuse for some reason:( Triple-checked Vercel environment variables - everything is fine, all LANGFUSE_XXX env vars are valid. No error logs are creating, so I suppose langfuse.on('error') event don't fire too. We have no Idea why it this happening and how to enable sending custom traces in Next.js app - everything works in other services (deployed to Google Cloud App Engine and Google Cloud functions).

Does anyone have any ideas?

lib versions in Next.js project:
"ai": "3.4.32",
"langfuse": "3.28.0",
"langfuse-vercel": "3.28.0",

[dosubot[bot]]

Hey there, @rovnyart! I'm here to help you with any bugs, questions, or contributions you have. Let's tackle this issue together!

To enable sending custom traces in your Next.js app using Langfuse, you can follow these steps to troubleshoot and resolve the issue:

1. Verify Integration: Ensure that your integration with Langfuse is correct. Double-check the setup in your langfuse.ts file and ensure that the LangfuseExporter is properly configured.

2. Check API Credentials: Confirm that the API credentials used in your application are correct and match those in your Langfuse project settings.

3. Inspect Tracing Configuration: Make sure your tracing configuration is set up correctly. Verify that the LANGFUSE_BASEURL and other relevant environment variables are correctly configured.

4. Manual Flushing: Since your application is deployed on Vercel, ensure that you are manually flushing the events before the application exits. Use the flushAsync method to flush events without blocking the response.

5. Network Issues: Check for any network issues that might prevent your application from sending data to Langfuse. Ensure that your network settings allow outbound connections to Langfuse endpoints.

6. Batching Configuration: In high throughput applications, verify the batching configuration to ensure that events are being sent in a timely manner. Adjust the flushAt and flushInterval settings as needed.

7. Enable Telemetry: Ensure that telemetry is enabled by setting experimental_telemetry on each request you want to trace. You are already using "ai": "3.4.32", which should support this feature.

8. Debugging: Enable the debug option in LangfuseExporter to see the logs of the exporter for troubleshooting. This can help identify any issues with the trace creation process.

9. Vercel Plan: Ensure you are on a Pro or Enterprise Plan on Vercel, as Vercel’s OpenTelemetry Collector is only available on these plans.

By following these steps, you should be able to resolve the issue and enable sending custom traces to Langfuse ^[1][2][3][4].

To continue talking to Dosu, mention @dosu.

[hassiebp]

@rovnyart Could you please try adding await langfuse.flushAsync() at the end of your endpoint execution? You may also use NextJS's waitUntil to not block the HTTP response: https://vercel.com/changelog/waituntil-is-now-available-for-vercel-functions

[rovnyart]

Yes, it helped, thanks!