跳到主要内容

Langflow TypeScript客户端

Langflow TypeScript客户端允许您的TypeScript应用程序以编程方式与Langflow API进行交互。

有关客户端代码仓库，请参见langflow-client-ts。

有关npm包，请参见@datastax/langflow-client。

安装Langflow TypeScript包​

要安装Langflow TypeScript客户端包，请使用以下命令之一：


_10
npm install @datastax/langflow-client

初始化Langflow TypeScript客户端​

  1. 将客户端导入您的代码。


    _10
    import { LangflowClient } from "@datastax/langflow-client";

  2. 初始化一个LangflowClient对象以与您的服务器交互：


    _10
    const baseUrl = "BASE_URL";
    _10
    const apiKey = "API_KEY";
    _10
    const client = new LangflowClient({ baseUrl, apiKey });

    将BASE_URL和API_KEY替换为您部署中的值。 默认的Langflow基础URL是http://localhost:7860。 要创建API密钥，请参见API密钥和身份验证。

连接到您的服务器并获取响应​

  1. 使用已初始化的Langflow客户端，通过调用您的Langflow服务器来测试连接。

    以下示例通过发送流ID和聊天输入字符串来运行一个流（runFlow）：


    _15
    import { LangflowClient } from "@datastax/langflow-client";
    _15
    _15
    const baseUrl = "http://localhost:7860";
    _15
    const client = new LangflowClient({ baseUrl });
    _15
    _15
    async function runFlow() {
    _15
    const flowId = "aa5a238b-02c0-4f03-bc5c-cc3a83335cdf";
    _15
    const flow = client.flow(flowId);
    _15
    const input = "Is anyone there?";
    _15
    _15
    const response = await flow.run(input);
    _15
    console.log(response);
    _15
    }
    _15
    _15
    runFlow().catch(console.error);

    替换以下内容：

    • baseUrl: 您的Langflow服务器的URL。
    • flowId: 您要运行的流的ID。
    • input: 您要发送以触发流的聊天输入消息。 这仅适用于具有聊天输入组件的流。

  2. 查看结果以确认客户端已连接到您的Langflow服务器。

    以下示例显示了格式正确的runFlow请求的响应，该请求到达了Langflow服务器并成功启动了流：


    _10
    FlowResponse {
    _10
    sessionId: 'aa5a238b-02c0-4f03-bc5c-cc3a83335cdf',
    _10
    outputs: [ { inputs: [Object], outputs: [Array] } ]
    _10
    }

    在这种情况下，响应包括一个sessionID，它是客户端-服务器会话的唯一标识符，以及一个包含流运行信息的outputs数组。

  3. 可选：如果您希望从服务器获取完整的响应对象，请将console.log更改为字符串化返回的JSON对象：


    _10
    console.log(JSON.stringify(response, null, 2));

    返回的inputs和outputs对象的确切结构取决于您的流的组件和配置。

  4. 可选：如果您希望响应仅包含来自聊天输出组件的聊天消息，请将console.log更改为使用chatOutputText便捷函数：


    _10
    console.log(response.chatOutputText());

使用高级 TypeScript 客户端功能​

TypeScript 客户端不仅能连接到服务器并运行流程，还能做更多事情。

本示例在快速入门的基础上，增加了与 Langflow 交互的额外功能：

  1. 将 tweaks 作为对象与请求一起传递。 Tweaks 是对组件设置进行编程式运行时覆盖的参数。

    此示例更改了流程中语言模型组件使用的 LLM::


    _10
    const tweaks = { model_name: "gpt-4o-mini" };

  2. 在请求中传递 session ID，以将此对话与其他流程运行分开，并能够通过将来调用相同的 session ID 来继续此对话：


    _10
    const session_id = "aa5a238b-02c0-4f03-bc5c-cc3a83335cdf";

  3. 不要在 Flow 对象上调用 run，而是使用相同的参数调用 stream 以获取流式响应：


    _10
    const response = await client.flow(flowId).stream(input);
    _10
    _10
    for await (const event of response) {
    _10
    console.log(event);
    _10
    }

    响应是一个对象的 ReadableStream。 有关流式传输 Langflow 响应的更多信息，请参见 /run 端点。

  4. 运行修改后的 TypeScript 应用程序，使用 tweaks、session_id 和流式传输来运行流程：


    _22
    import { LangflowClient } from "@datastax/langflow-client";
    _22
    _22
    const baseUrl = "http://localhost:7860";
    _22
    const client = new LangflowClient({ baseUrl });
    _22
    _22
    async function runFlow() {
    _22
    const flowId = "aa5a238b-02c0-4f03-bc5c-cc3a83335cdf";
    _22
    const input = "Is anyone there?";
    _22
    const tweaks = { model_name: "gpt-4o-mini" };
    _22
    const session_id = "test-session";
    _22
    _22
    const response = await client.flow(flowId).stream(input, {
    _22
    session_id,
    _22
    tweaks,
    _22
    });
    _22
    _22
    for await (const event of response) {
    _22
    console.log(event);
    _22
    }
    _22
    _22
    }
    _22
    runFlow().catch(console.error);

    替换以下内容：

    • baseUrl: 您的 Langflow 服务器的 URL。
    • flowId: 您要运行的流程的 ID。
    • input: 您要发送以触发流程的聊天输入消息，假设流程中有一个 Chat Input 组件。
    • tweaks: 要应用于流程运行的任何 tweak 修饰符。 此示例更改了流程中组件使用的 LLM。
    • session_id: 传递自定义的 session ID。 如果省略或为空，则流程 ID 是默认的 session ID。
    结果

    启用流式传输后，响应包含流程元数据和流程活动的时间戳事件。 例如：


    _68
    {
    _68
    event: 'add_message',
    _68
    data: {
    _68
    timestamp: '2025-05-23 15:52:48 UTC',
    _68
    sender: 'User',
    _68
    sender_name: 'User',
    _68
    session_id: 'test-session',
    _68
    text: 'Is anyone there?',
    _68
    files: [],
    _68
    error: false,
    _68
    edit: false,
    _68
    properties: {
    _68
    text_color: '',
    _68
    background_color: '',
    _68
    edited: false,
    _68
    source: [Object],
    _68
    icon: '',
    _68
    allow_markdown: false,
    _68
    positive_feedback: null,
    _68
    state: 'complete',
    _68
    targets: []
    _68
    },
    _68
    category: 'message',
    _68
    content_blocks: [],
    _68
    id: '7f096715-3f2d-4d84-88d6-5e2f76bf3fbe',
    _68
    flow_id: 'aa5a238b-02c0-4f03-bc5c-cc3a83335cdf',
    _68
    duration: null
    _68
    }
    _68
    }
    _68
    {
    _68
    event: 'token',
    _68
    data: {
    _68
    chunk: 'Absolutely',
    _68
    id: 'c5a99314-6b23-488b-84e2-038aa3e87fb5',
    _68
    timestamp: '2025-05-23 15:52:48 UTC'
    _68
    }
    _68
    }
    _68
    {
    _68
    event: 'token',
    _68
    data: {
    _68
    chunk: ',',
    _68
    id: 'c5a99314-6b23-488b-84e2-038aa3e87fb5',
    _68
    timestamp: '2025-05-23 15:52:48 UTC'
    _68
    }
    _68
    }
    _68
    {
    _68
    event: 'token',
    _68
    data: {
    _68
    chunk: " I'm",
    _68
    id: 'c5a99314-6b23-488b-84e2-038aa3e87fb5',
    _68
    timestamp: '2025-05-23 15:52:48 UTC'
    _68
    }
    _68
    }
    _68
    {
    _68
    event: 'token',
    _68
    data: {
    _68
    chunk: ' here',
    _68
    id: 'c5a99314-6b23-488b-84e2-038aa3e87fb5',
    _68
    timestamp: '2025-05-23 15:52:48 UTC'
    _68
    }
    _68
    }
    _68
    _68
    // 此响应已简略
    _68
    _68
    {
    _68
    event: 'end',
    _68
    data: { result: { session_id: 'test-session', outputs: [Array] } }
    _68
    }

使用 TypeScript 客户端检索 Langflow 日志​

要检索 Langflow 日志，您必须在 Langflow 服务器的 .env 文件中包含以下值来启用日志检索：


_10
LANGFLOW_ENABLE_LOG_RETRIEVAL=True
_10
LANGFLOW_LOG_RETRIEVER_BUFFER_SIZE=10000
_10
LANGFLOW_LOG_LEVEL=DEBUG

以下示例脚本在后台开始流式传输日志，然后运行一个流程，以便您可以监控流程运行：


_26
import { LangflowClient } from "@datastax/langflow-client";
_26
_26
const baseUrl = "http://localhost:7863";
_26
const flowId = "86f0bf45-0544-4e88-b0b1-8e622da7a7f0";
_26
_26
async function runFlow(client: LangflowClient) {
_26
const input = "Is anyone there?";
_26
const response = await client.flow(flowId).run(input);
_26
console.log('Flow response:', response);
_26
}
_26
_26
async function main() {
_26
const client = new LangflowClient({ baseUrl: baseUrl });
_26
_26
// Start streaming logs
_26
console.log('Starting log stream...');
_26
for await (const log of await client.logs.stream()) {
_26
console.log('Log:', log);
_26
}
_26
_26
// Run the flow
_26
await runFlow(client);
_26
_26
}
_26
_26
main().catch(console.error);

替换以下内容：

  • baseUrl: 您的 Langflow 服务器的 URL。
  • flowId: 您要运行的流程的 ID。
  • input: 您要发送的聊天输入消息，用于触发流程，假设流程有一个 Chat Input 组件。

日志开始无限流式传输，流程运行一次。

结果

以下示例结果为了可读性被截断，但您可以跟随消息查看流程如何实例化其组件、配置其模型以及处理输出。

在流结束时，FlowResponse 对象会返回给客户端，其中包含 outputs 数组中的流程结果。


_57
Starting log stream...
_57
Log: Log {
_57
timestamp: 2025-05-30T11:49:16.006Z,
_57
message: '2025-05-30T07:49:16.006127-0400 DEBUG Instantiating ChatInput of type component\n'
_57
}
_57
Log: Log {
_57
timestamp: 2025-05-30T11:49:16.029Z,
_57
message: '2025-05-30T07:49:16.029957-0400 DEBUG Instantiating Prompt of type component\n'
_57
}
_57
Log: Log {
_57
timestamp: 2025-05-30T11:49:16.049Z,
_57
message: '2025-05-30T07:49:16.049520-0400 DEBUG Instantiating ChatOutput of type component\n'
_57
}
_57
Log: Log {
_57
timestamp: 2025-05-30T11:49:16.069Z,
_57
message: '2025-05-30T07:49:16.069359-0400 DEBUG Instantiating OpenAIModel of type component\n'
_57
}
_57
Log: Log {
_57
timestamp: 2025-05-30T11:49:16.086Z,
_57
message: "2025-05-30T07:49:16.086426-0400 DEBUG Running layer 0 with 2 tasks, ['ChatInput-xjucM', 'Prompt-I3pxU']\n"
_57
}
_57
Log: Log {
_57
timestamp: 2025-05-30T11:49:16.101Z,
_57
message: '2025-05-30T07:49:16.101766-0400 DEBUG Building Chat Input\n'
_57
}
_57
Log: Log {
_57
timestamp: 2025-05-30T11:49:16.113Z,
_57
message: '2025-05-30T07:49:16.113343-0400 DEBUG Building Prompt\n'
_57
}
_57
Log: Log {
_57
timestamp: 2025-05-30T11:49:16.131Z,
_57
message: '2025-05-30T07:49:16.131423-0400 DEBUG Logged vertex build: 6bd9fe9c-5eea-4f05-a96d-f6de9dc77e3c\n'
_57
}
_57
Log: Log {
_57
timestamp: 2025-05-30T11:49:16.143Z,
_57
message: '2025-05-30T07:49:16.143295-0400 DEBUG Logged vertex build: 39c68ec9-3859-4fff-9b14-80b3271f8fbf\n'
_57
}
_57
Log: Log {
_57
timestamp: 2025-05-30T11:49:16.188Z,
_57
message: "2025-05-30T07:49:16.188730-0400 DEBUG Running layer 1 with 1 tasks, ['OpenAIModel-RtlZm']\n"
_57
}
_57
Log: Log {
_57
timestamp: 2025-05-30T11:49:16.201Z,
_57
message: '2025-05-30T07:49:16.201946-0400 DEBUG Building OpenAI\n'
_57
}
_57
Log: Log {
_57
timestamp: 2025-05-30T11:49:16.216Z,
_57
message: '2025-05-30T07:49:16.216622-0400 INFO Model name: gpt-4.1-mini\n'
_57
}
_57
Flow response: FlowResponse {
_57
sessionId: '86f0bf45-0544-4e88-b0b1-8e622da7a7f0',
_57
outputs: [ { inputs: [Object], outputs: [Array] } ]
_57
}
_57
Log: Log {
_57
timestamp: 2025-05-30T11:49:18.094Z,
_57
message: `2025-05-30T07:49:18.094364-0400 DEBUG Vertex OpenAIModel-RtlZm, result: <langflow.graph.utils.UnbuiltResult object at 0x364d24dd0>, object: {'text_output': "Hey there! I'm here and ready to help you build something awesome with AI. What are you thinking about creating today?"}\n`
_57
}

有关更多信息，请参阅 日志端点。

Search