> ## Documentation Index
> Fetch the complete documentation index at: https://docs.coreweave.com/llms.txt
> Use this file to discover all available pages before exploring further.
# Vercel AI SDK
> Tracer les appels du Vercel AI SDK dans Weave avec OpenTelemetry
Vous pouvez tracer les appels du [Vercel AI SDK](https://ai-sdk.dev/) dans Weave à l’aide d’[OpenTelemetry (OTel)](https://opentelemetry.io/). Le Vercel AI SDK est une boîte à outils TypeScript conçue pour créer des applications basées sur l’IA. Il est compatible avec des frameworks tels que Next.js, Nuxt ou SvelteKit, entre autres, et prend en charge OpenTelemetry de manière native grâce à son option `experimental_telemetry`.
Ce guide explique comment configurer OTel pour envoyer les traces du Vercel AI SDK vers Weave, afin d’observer et de déboguer vos appels AI SDK dans l’interface utilisateur de Weights & Biases. Vous pouvez utiliser l’AI SDK avec Next.js ou dans une application Node.js autonome. Ce guide s’adresse aux développeurs qui créent des applications basées sur l’IA avec le Vercel AI SDK et qui souhaitent ajouter le traçage à une application existante.
Pour plus d’informations sur le traçage OTel dans Weave, consultez [Envoyer des traces OTel à Weave](/fr/products/wandb/weave/guides/tracking/otel).
Prérequis
Avant de commencer, effectuez la configuration suivante. Les exemples Next.js et Node.js de ce guide requièrent les mêmes dépendances :
1. Installez les bibliothèques Vercel et OTel suivantes :
```bash theme={"system"}
npm install ai @ai-sdk/openai @opentelemetry/api @opentelemetry/sdk-trace-node @opentelemetry/sdk-trace-base @opentelemetry/exporter-trace-otlp-proto @opentelemetry/resources zod
```
2. Définissez les variables d’environnement suivantes :
```bash theme={"system"}
export WANDB_API_KEY="your-wandb-api-key"
export OPENAI_API_KEY="your-openai-api-key"
```
Vous pouvez obtenir votre clé API W\&B dans les [Paramètres utilisateur](https://forge.coreweave.com/settings).
Cette section explique comment configurer Weave dans une application Next.js. L’exemple ne présente pas d’application complète : il se limite à la configuration de l’instrumentation et à la manière de l’appliquer à une fonction du Vercel AI SDK (ici, un appel à OpenAI).
Les applications Next.js utilisent un fichier `instrumentation.ts` pour configurer OTel. Ce fichier s’exécute une seule fois, au démarrage du serveur, et configure le fournisseur de traceurs utilisé par l’AI SDK.
Pour intégrer Weave à la fonctionnalité OTel de Vercel, créez un fichier `instrumentation.ts` à la racine de votre projet et ajoutez-y le code suivant, en renseignant les noms de votre équipe et de votre projet dans la fonction `resourceFromAttributes()` :
```typescript lines {17-19} title="instrumentation.ts" theme={"system"}
// @noErrors
import { NodeTracerProvider } from "@opentelemetry/sdk-trace-node";
import { BatchSpanProcessor } from "@opentelemetry/sdk-trace-base";
import { OTLPTraceExporter } from "@opentelemetry/exporter-trace-otlp-proto";
import { resourceFromAttributes } from "@opentelemetry/resources";
export function register() {
const WANDB_API_KEY = process.env.WANDB_API_KEY!;
// Configurer l’exportateur OTel pour qu’il utilise le point de terminaison W&B Weave.
const exporter = new OTLPTraceExporter({
url: "https://trace.wandb.ai/otel/v1/traces",
headers: { "wandb-api-key": WANDB_API_KEY },
});
// Configurer vos identifiants d’authentification W&B.
const provider = new NodeTracerProvider({
resource: resourceFromAttributes({
"wandb.entity": "[YOUR-TEAM-NAME]",
"wandb.project": "[YOUR-PROJECT-NAME]",
}),
spanProcessors: [new BatchSpanProcessor(exporter)],
});
provider.register();
}
```
Vous créez ainsi un exportateur OTLP configuré pour envoyer les données de trace au point de terminaison OTel de Weave, avec authentification par votre clé API W\&B.
Une fois l'instrumentation ajoutée, utilisez l'option `experimental_telemetry` de Vercel dans n'importe quel appel de fonction de l'AI SDK pour émettre des spans OTel :
```typescript lines {10} title="route.ts" theme={"system"}
// @noErrors
import { openai } from "@ai-sdk/openai";
import { generateText } from "ai";
export async function POST(req: Request) {
const { prompt } = await req.json();
// Ajouter le champ experimental_telemetry à l'appel de fonction.
const result = await generateText({
model: openai("gpt-4o-mini"),
prompt,
experimental_telemetry: { isEnabled: true },
});
return Response.json({ text: result.text });
}
```
Tous les appels `generateText` dont la télémétrie est activée produisent des spans OTel exportés vers Weave. Votre application Next.js est désormais configurée pour envoyer les traces du Vercel AI SDK vers Weave.
Si vous n'utilisez pas Next.js, vous pouvez configurer OTel directement dans une application Node.js autonome. Dans ce cas, configurez le fournisseur de traceurs au début de votre fichier d'entrée, avant tout appel à l'AI SDK, afin que les appels ultérieurs à l'AI SDK soient bien capturés.
Une fois les prérequis remplis, vous pouvez exécuter l'exemple suivant et générer des spans sans configuration supplémentaire.
```typescript lines {11-14,18-19,31} title="test-app.ts" theme={"system"}
// @noErrors
import { NodeTracerProvider } from "@opentelemetry/sdk-trace-node";
import { BatchSpanProcessor } from "@opentelemetry/sdk-trace-base";
import { OTLPTraceExporter } from "@opentelemetry/exporter-trace-otlp-proto";
import { resourceFromAttributes } from "@opentelemetry/resources";
import { openai } from "@ai-sdk/openai";
import { generateText } from "ai";
const WANDB_API_KEY = process.env.WANDB_API_KEY!;
// Configurer l’exportateur OTel pour qu’il utilise le point de terminaison W&B Weave.
const exporter = new OTLPTraceExporter({
url: "https://trace.wandb.ai/otel/v1/traces",
headers: { "wandb-api-key": WANDB_API_KEY },
});
// Configurer vos identifiants d’authentification W&B.
const provider = new NodeTracerProvider({
resource: resourceFromAttributes({
"wandb.entity": "[YOUR-TEAM-NAME]",
"wandb.project": "[YOUR-PROJECT-NAME]",
}),
spanProcessors: [new BatchSpanProcessor(exporter)],
});
provider.register();
// Ajouter le champ experimental_telemetry à la fonction.
async function main() {
const result = await generateText({
model: openai("gpt-4o-mini"),
prompt: "Explain OpenTelemetry in one sentence.",
experimental_telemetry: { isEnabled: true },
});
console.log(result.text);
await provider.shutdown();
}
main();
```
`BatchSpanProcessor` vide les spans de manière asynchrone. Dans les processus de courte durée, comme les scripts autonomes, les fonctions serverless ou les outils CLI, appelez `provider.shutdown()` avant la fin du processus afin de garantir que tous les spans soient bien envoyés vers Weave. Pour les serveurs qui s'exécutent en continu (comme un serveur de développement Next.js démarré via `instrumentation.ts`), cette étape n'est pas nécessaire.