Cookbook：OpenAI 集成（JS/TS）

本 cookbook 提供了 Litefuse 与 OpenAI（JS/TS）集成的示例。请按照集成指南将该集成添加到你的 OpenAI 项目中。

环境准备

注意：本 cookbook 使用 Deno.js 运行，导入包与设置环境变量的语法有所不同。对于 Node.js 应用，搭建流程类似，但使用标准的 npm 包和 process.env。

// Litefuse authentication keys
Deno.env.set("LANGFUSE_PUBLIC_KEY", "pk-lf-***");
Deno.env.set("LANGFUSE_SECRET_KEY", "sk-lf-***");
 
// Litefuse host configuration
Deno.env.set("LANGFUSE_BASE_URL", "https://litefuse.cloud")
 
// Set environment variables using Deno-specific syntax
Deno.env.set("OPENAI_API_KEY", "sk-proj-***");

设置好环境变量后，我们就可以初始化 langfuseSpanProcessor，并将其传入用于编排 tracing 的主 OpenTelemetry SDK。

// Import required dependencies
import 'npm:dotenv/config';
import { NodeSDK } from "npm:@opentelemetry/sdk-node";
import { LangfuseSpanProcessor } from "npm:@langfuse/otel";
 
// Export the processor to be able to flush it later
// This is important for ensuring all spans are sent to Litefuse
export const langfuseSpanProcessor = new LangfuseSpanProcessor({
    publicKey: process.env.LANGFUSE_PUBLIC_KEY!,
    secretKey: process.env.LANGFUSE_SECRET_KEY!,
    baseUrl: process.env.LANGFUSE_BASE_URL ?? 'https://litefuse.cloud', // Default to cloud if not specified
    environment: process.env.NODE_ENV ?? 'development', // Default to development if not specified
  });
 
// Initialize the OpenTelemetry SDK with Langfuse processor
const sdk = new NodeSDK({
  spanProcessors: [langfuseSpanProcessor],
});
 
// Start the SDK to begin collecting telemetry
// The warning about crypto module is expected in Deno and doesn't affect basic tracing functionality. Media upload features will be disabled, but all core tracing works normally
sdk.start();

示例 1：Chat Completion

import OpenAI from "npm:openai";
import { observeOpenAI } from "npm:@langfuse/openai";

// Initialize OpenAI client with observerOpenAI wrapper
const openai = observeOpenAI(new OpenAI());

import OpenAI from "npm:openai";
import { observeOpenAI } from "npm:@langfuse/openai";
 
// Configured via environment variables, see above
const openai = observeOpenAI(new OpenAI());
 
const completion = await openai.chat.completions.create({
  model: 'gpt-4o',
  messages: [{ role: "system", content: "Tell me a joke." }],
  max_tokens: 100,
});
 
console.log(completion.choices[0]?.message.content);

Litefuse Trace

在 Litefuse UI 中查看公开 trace

示例 2：Chat completion（流式）

这是一个使用 OpenAI 流式响应的简单示例，并传入自定义参数为 generation 重命名以及为 trace 添加 tag。

import OpenAI from "npm:openai";
import { observeOpenAI } from "npm:@langfuse/openai";
 
// Initialize OpenAI SDK with Langfuse
const openaiWithLangfuse = observeOpenAI(new OpenAI(), { generationName: "OpenAI Stream Trace", tags: ["stream"]} )
 
// Call OpenAI
const stream = await openaiWithLangfuse.chat.completions.create({
  model: 'gpt-4o',
  messages: [{ role: "system", content: "Tell me a joke." }],
  stream: true,
});
 
for await (const chunk of stream) {
    const content = chunk.choices[0]?.delta?.content || '';
    console.log(content);
  }

在 Litefuse UI 中查看公开 trace

示例 3：添加额外的元数据与参数

trace 是 Litefuse 中的核心对象，你可以为它添加丰富的元数据。详见 JS/TS SDK 文档和 API 参考。

示例用法：

为特定类型的 trace 指定自定义名称
启用用户级别的跟踪
通过版本与发布信息跟踪实验
添加自定义元数据

import OpenAI from "npm:openai";
import { observeOpenAI } from "npm:langfuse";
 
// Initialize OpenAI SDK with Langfuse and custom parameters
const openaiWithLangfuse = observeOpenAI(new OpenAI(), {
    generationName: "OpenAI Custom Trace",
    metadata: {env: "dev"},
    sessionId: "session-id",
    userId: "user-id",
    tags: ["custom"],
    version: "0.0.1",
    release: "beta",
})
 
// Call OpenAI
const completion = await openaiWithLangfuse.chat.completions.create({
  model: 'gpt-4o',
  messages: [{ role: "system", content: "Tell me a joke." }],
  max_tokens: 100,
});

在 Litefuse UI 中查看公开 trace

示例 4：函数调用

import OpenAI from "npm:openai";
import { observeOpenAI } from "npm:@langfuse/openai";
 
// Initialize OpenAI SDK with Langfuse
const openaiWithLangfuse = observeOpenAI(new OpenAI(), { generationName: "OpenAI FunctionCall Trace", tags: ["function"]} )
 
// Define custom function
async function getWeather(location: string) {
  if (location === "Berlin")
    {return "20degC"}
  else 
    {return "unknown"}
}
 
// Create function specification required for OpenAI API
const functions = [{
    type: "function",
    function: {
        name: "getWeather",
        description: "Get the current weather in a given location",
        parameters: {
            type: "object",
            properties: {
                location: {
                    type: "string",
                    description: "The city, e.g. San Francisco",
                },
            },
            required: ["location"],
        },
    },
}]
 
// Call OpenAI
const res = await openaiWithLangfuse.chat.completions.create({
    model: 'gpt-4o',
    messages: [{ role: 'user', content: "What's the weather like in Berlin today"}],
    tool_choice: "auto",
    tools: functions,
})
 
const tool_call = res.choices[0].message.tool_calls;
if (tool_call[0].function.name === "getWeather") {
    const argsStr = tool_call[0].function.arguments;
    const args = JSON.parse(argsStr); 
    const answer = await getWeather(args["location"]);
    console.log(answer);
}

20degC

在 Litefuse UI 中查看公开 trace

示例 5：将多个 generation 归入同一个 trace

使用 Langfuse TypeScript SDK 的上下文管理器将两次 OpenAI 生成归到一起，并更新顶层 span。

import { startObservation, startActiveObservation, propagateAttributes } from "npm:@langfuse/tracing";
import OpenAI from "npm:openai";
import { observeOpenAI } from "npm:@langfuse/openai";
 
const country = "Germany";
 
await startActiveObservation("user-request", async (span) => {
 
  const capital = (
    await observeOpenAI(new OpenAI(), {
      parent: span,
      generationName: "get-capital",
    }).chat.completions.create({
      model: "gpt-4o",
      messages: [
        { role: "system", content: "What is the capital of the country?" },
        { role: "user", content: country },
      ],
    })
  ).choices[0].message.content;
 
  const poem = (
    await observeOpenAI(new OpenAI(), {
      parent: span,
      generationName: "generate-poem",
    }).chat.completions.create({
      model: "gpt-4o",
      messages: [
        {
          role: "system",
          content: "You are a poet. Create a poem about this city.",
        },
        { role: "user", content: capital },
      ],
    })
  ).choices[0].message.content;
 
  // Propagate trace attributes
  await propagateAttributes({
    traceName: "City poem generator",
    tags: ["updated"],
    metadata: {"env": "development"},
    release: "v0.0.2",
  }, async () => {});
 
  // Set input and output on the root observation
  span.update({
    input: country,
    output: poem,
  });
 
});

Litefuse Trace

在 Litefuse UI 中查看公开 trace

LiteLLM (Proxy) + Litefuse OpenAI 集成（JS/TS）JS/TS SDK 示例

这个页面对你有帮助吗？

支持