这次，我们将构建一个由多个工具驱动的 Langflow 代理，非常适合客户支持聊天机器人。在本指南结束时，您将知道如何：
- • 创建自定义组件，如语音代理调用，使您能够通过自定义组件解锁独特的用例。
- • 使用 Tool Mode 直接与代理的任何组件互动。
- • 启动一个 Streamlit 网络应用，以提供干净、互动的聊天机器人体验。
想象一下一个客户支持助手，可以：
- • 立即获取答案，使用 RAG (检索增强生成)。
- • 使用 Text2SQL 检查票据详情，将普通语言转换为 SQL 查询。
- • 在紧急支持问题出现时，通过自定义语音代理组件直接拨打客户电话。
- • 在由 Streamlit 驱动的网络应用中无缝运行。
让我们一步一步来！
计划是什么？
我们正在构建一个由多个工具协同工作的超级增强型 Langflow Agent：
- 1. RAG — 你的知识超级充电器 RAG 通过在响应之前提取数据来帮助你的机器人更聪明地思考。这就像给你的 AI 一个研究助手，非常适合支持、报告和数据密集型任务。
- 2. Text2SQL — 简单表达，强大查询 Text2SQL 将自然语言转换为 SQL 查询，使数据更加易于访问。想象一下询问：“我的支持票的状态是什么？”然后你的机器人自动将其转换为查询，执行它并提供答案。我们将使用一个简单的数据模型进行演示。要深入了解 Text2SQL，请查看博客文章 “如何构建生产级 Text2sql 引擎。”
- 3. 自定义组件 — 强大的构建模块 Langflow 中的自定义组件就像 LEGO 积木，你可以构建完全符合你需求的东西。这一次？一个为关键问题拨打客户电话的语音代理，让你的聊天机器人感觉主动，而不是被动。
这个语音代理工具使用 Olivya API，Olivya 是我们重视的客户之一。Olivya 专注于通过处理如接听来电、解答询问、预订餐厅和检查订单状态等任务来改造客户服务。通过与 CRM 等系统无缝集成，他们旨在通过自然、类人沟通来自动化和改善客户互动。
4. Streamlit 网络应用 — 界面很重要 我们将所有内容包装在一个干净、互动的 Streamlit 网络应用中。
第一步：使用RAG增强知识检索
RAG将您的聊天机器人转变为知识向导。以下是如何连接它：
- 1. 文档加载器 — 导入支持文档和常见问题解答。
- 2. 文本分割器 — 将大型文档拆分为更小的可搜索片段。
- 3. 嵌入模型 — 使用OpenAI嵌入模型将文本转换为向量嵌入以便于搜索。
- 4. 向量存储 — 将嵌入存储在像DataStax Astra DB这样的向量数据库中，以实现快速检索。
我们正在将内部支持的常见问题解答文档加载到Astra集合中。这些文档被拆分后，使用OpenAI的text-embedding-3-small模型加载到rag_demo集合中。
在这个例子中，我们正在使用配备RAG作为工具的单个Agent。一旦文件加载到我们Astra集合中的rag_demo表中，我们可以根据文档内容提问。
“您的软件与Mac OS Ventura兼容吗？”
现在您的机器人已准备好实时搜索知识库！
第2步：使用Text2SQL进行工单查询
没有SQL？没问题！Text2SQL让您的机器人使用自然语言查询数据库。
工作原理：
为每个人提供数据洞察——无需SQL专业知识。
让我们开始创建一个包含工单详情的模拟数据库来进行操作：
现在我们可以查询工单状态和详情。虽然我在聊天中直接提供了我的customer_id，但它也可以在用户的个人资料中设置，并在应用程序端初始化聊天时进行调整。
“我的客户ID是1008。我的工单状态和工单详情是什么？”
到目前为止，我们已经用我们的Agent测试了两个工具。它正确地遵循了指示，并选择了适合任务的正确工具。
Step 3: 创建自定义语音代理组件
让我们超越标准工具。这个自定义组件将直接拨打客户电话以处理关键问题。
- • Inputs — 添加 Olivya API、客户电话号码字段以及发送给语音代理的第一条消息。
- • Voice agent integration — 连接到外部服务 API，例如 Olivya，用于入站和出站电话。您可以在 这里 获取您的 Olivya API，并在这个 视频 中了解如何使用 Olivya。
- • Outputs — 当呼叫发起时返回成功消息。
构建自定义组件的步骤
我们将使用 Langflow，这是一个开源可视化框架，使构建生产就绪的 AI 应用程序变得简单。无论您是在处理多代理系统还是 RAG 解决方案，Langflow 都提供了创建可扩展工作流所需的灵活性和控制。它是用 Python 构建的，完全可定制，并且可以与任何 LLM 或向量存储配合使用，使其成为 AI 开发的理想选择。
在 Langflow 中创建自定义组件就像为您的工作流赋予超能力。Python 在后台运行，因此您可以利用整个库的宇宙，例如 Pandas 进行数据处理，Scikit-learn 进行机器学习，或 NumPy 进行数字运算。
秘诀是什么？确保您的输出具有正确的类型注释（例如，list[int]）。Langflow 依赖这些来保持一切顺利运行。
让我们将其分解为更小的步骤。
1. 开始新项目：基础知识
首先，前往“自定义组件 > 新组件”在 Langflow 中。一个新的组件将出现在画布上，您可以点击组件中的代码。在那里，您将看到一个代码编辑器，您可以在其中导入您的 Python 依赖项并定义您的组件所需的一切。
以下是一个入门示例：
import requests
import json
from langflow.custom import Component
from langflow.io import MessageTextInput, Output
from langflow.schema import Data
import logging
classOlivyaComponent(Component):
display_name = "创建外呼"
description = "一个用于创建外呼请求的组件。"
icon = "code"
inputs = [
MessageTextInput(
name="api_key",
display_name="API 密钥",
info="用于身份验证的 API 密钥",
required=True,
),
MessageTextInput(
name="from_number",
display_name="发件号码",
info="代理的电话号码",
required=True,
),
MessageTextInput(
name="to_number",
display_name="收件号码",
info="客户的电话号码",
required=True,
),
MessageTextInput(
name="first_message",
display_name="第一条消息",
info="代理应该先说什么？",
tool_mode=True,
),
MessageTextInput(
name="system_prompt",
display_name="系统提示",
info="指导语音通话的可选指令",
required=False,
),
]
outputs = [
Output(name="output", display_name="输出", method="build_output"),
]
defbuild_output(self) -> Data:
logging.basicConfig(level=logging.INFO)
self.log("开始语音代理通话...")
self.log("通话成功发起！")
return Data(message="通话已完成。")
打开组件的代码编辑器，粘贴此代码并点击 检查并保存。
让我们分解关键点：
- • display_name 和 description - 在 Langflow UI 中显示。
- • inputs - 定义您的组件所需的所有参数（如电话号码和消息）。
- • outputs - 指定您的组件返回的内容。您可以拥有多个方法，这意味着多个输出（在单个组件中，这意味着代理可以在每个组件中使用多个工具）。
- • tool_mode=True - 启用“工具模式”按钮，使代理能够将您的组件用作工具。没错，这就是将自定义组件转变为完全功能工具的小秘密！
- • self.log(“某条消息”) - 记录您可以在检查组件输出时查看的消息，并通过点击日志选项卡进行简单调试。
2. 魔法：输出方法
这是魔法发生的地方。您的输出方法定义了组件如何处理数据并交付结果。
def build_output(self) -> Data:
logging.basicConfig(level=logging.INFO)
self.log("Starting Voice Agent call...")
self.log("Call initiated successfully!")
return Data(message="Call completed.")
想要访问输入？只需使用 self.<input_name>。
3. 如何使用工具模式
首先，我们需要确保我们的自定义组件与代理无缝协作。为此，我们将启用工具模式。
工具模式是让你的自定义组件成为代理最佳伙伴的关键。通过在任何输入上切换“tool_mode”，你在向代理发出信号，表示可以调用该组件来处理特定任务。例如，我们的语音代理中的“first_message”字段设置为tool_mode=True。
这意味着你的代理可以在需要拨打电话时决定将文本传递到该字段。
工具模式允许你直接与Langflow代理内部的各个工具进行交互。这在你希望将任何组件用作Langflow中的工具时特别有用。
启用工具模式后，所有字段的tool_mode=True将不可点击。并且将出现一个新按钮编辑工具。在这里，你可以查看所有组件输出，并调整工具名称和工具描述，这就是你的代理实际“看到”的内容：
现在，你的机器人可以接电话并拨打客户的电话！我们现在有三个工具准备好供我们的代理使用。让我们问一下支持代理是否可以打电话给我们以帮助取消订单：
“我想取消一个订单。你能给我打电话吗？”
这是与语音代理Paula的对话。
4. 不要忘记：使用适当的注释
Langflow 对类型要求严格（以积极的方式！）。始终正确注释您的方法。例如：
def build_output(self) -> Data:
return Data()
5. 如何调试你的组件
迟早，你需要进行调试。以下是一些快速提示，以帮助你避免挫败感：
- • 使用 console.log：这是检查代码中不同点变量值的最简单方法。
- • 检查错误：查看控制台是否有任何错误消息，这可能提供有关问题所在的线索。
- • 使用断点：大多数现代浏览器都有开发者工具，允许你在 JavaScript 代码中设置断点。这让你可以暂停执行并检查应用程序的当前状态。
- • 检查元素：使用元素检查器查看你当前的 DOM 状态以及组件的渲染情况。
- • 检查你的 props 和 state：确保你的组件接收正确的 props，并且 state 按预期更新。
- • 使用不同的输入进行测试：有时，问题可能只在特定输入下出现。使用多种数据测试你的组件，以发现边缘案例。
- • 使用错误边界：如果你在使用 React，考虑实现错误边界以捕获组件树中的错误。
- • 阅读文档：有时答案就在文档中。确保你正确使用库或框架。
通过遵循这些提示，你应该能够有效地调试你的组件并更快地解决问题。
使用 self.log() 获取洞察
- • 在您的组件的任何地方（例如，build_output），调用
self.log("Hit this point!") - • 这些消息会出现在 Langflow 的日志部分，为您提供组件进度的实时反馈。
打印或记录变量
- • 如果您怀疑您的
from_number 或 api_key 丢失，请执行：self.log(f"From Number is: {self.from_number}")
查找异常
- • 将风险调用（如 requests.post()）包装在 try/except 块中。
- • 示例：
try:
response = requests.post("https://some-api-url", data={…})
except Exception as e:
self.log(f"Error in request: {e}")
检查 Langflow 控制台
- • Langflow 日志面板详细记录了您的日志、警告和错误。
- • 如果您的自定义组件失败或返回意外数据，控制台将是您最好的朋友。
使用测试流程
- • 这可以在您与更大的 Agents 或其他工具集成之前隔离潜在的错误。
通过这些步骤，您将能够快速诊断大多数问题，并使您的组件顺利运行。
6. 测试和保存
您快到了！在 Langflow 界面中点击 检查和保存 以验证您的新组件。如果一切看起来都不错，它就可以使用了！
就这样，您在 Langflow 中创建了一个自定义组件！无论您是在构建 API 集成、处理数据，还是创建新的工作流程，前途无量。
Step 4: Bringing it all together with a Streamlit web app
让我们通过一个简单的 web 应用让这个聊天机器人焕发光彩！
安装 Streamlit 和 Langflow
Streamlit 代码 (supportagent.py)
在这里，我们通过 API 获取 Langflow 代码，并将其与我们的 Streamlit 代码集成。
我们通过使用 requests 调用 Langflow API，将 Langflow 连接到我们的 Streamlit 应用。
为了简化设置，argparse 被移除，转而采用使用 Streamlit 接口的网络友好方法。虽然 argparse 适用于命令行输入，但 requests 处理 API 通信，使得在应用中直接发送数据和接收响应变得更加容易。
以下是一个示例代码实现，演示如何使用 Streamlit：
import streamlit as st
import requests
BASE_API_URL = "http://127.0.0.1:7862"
FLOW_ID = "ef498ebb-2b6b-4d6e-aaa3-6ebb2c7331e2"
TWEAKS = {
"SQLiteDatabaseTool-4E7TY": {},
"ChatOutput-hEGbz": {},
"OpenAIEmbeddings-Vc3fd": {},
"File-15yvK": {},
"SplitText-8Bxte": {},
"OpenAIEmbeddings-MA3vd": {},
"SQLiteDatabaseTool-XB5YP": {},
"ChatInput-yuJEL": {},
"Agent-C0gNO": {},
"VectoreStoreQuery-XqTqT": {},
"AstraDB-Qe9l6": {},
"AstraDB-1iPbu": {},
"OlivyaComponent-U6d3Z": {}
}
defrun_flow_api(message: str):
"""将消息发送到 Langflow API，并返回聊天机器人的响应。"""
api_url = f"{BASE_API_URL}/api/v1/run/{FLOW_ID}"
payload = {
"input_value": message,
"output_type": "chat",
"input_type": "chat",
"tweaks": TWEAKS
}
response = requests.post(api_url, json=payload)
response_json = response.json()
text_output = response_json.get("outputs", [{}])[0].get("outputs", [{}])[0].get("results", {}).get("message", {}).get("text", "未收到响应。")
return text_output
defdesign_ui():
"""设置 Streamlit 用户界面。"""
st.set_page_config(page_title="支持代理界面", layout="centered")
st.title("支持代理")
st.image("/Users/betuloreilly/langflow/support_bot/supportbot.png", width=80)
user_input = st.text_area("在此输入您的消息：", placeholder="在此输入您的消息...", height=120)
run_button = st.button("运行聊天机器人")
return user_input, run_button
defprocess_chatbot_flow(user_input):
"""处理用户输入，通过聊天机器人流程并显示结果。"""
if user_input:
try:
result = run_flow_api(user_input)
st.markdown(f"<div class='support-response'>支持代理：{result}</div>", unsafe_allow_html=True)
st.markdown("<div class='feedback-container'>", unsafe_allow_html=True)
col1, col2 = st.columns(2)
with col1:
if st.button("?"):
st.success("感谢您的积极反馈！")
st.experimental_rerun()
with col2:
if st.button("?"):
st.warning("感谢您的反馈！我们会努力改进我们的服务。")
st.experimental_rerun()
st.markdown("</div>", unsafe_allow_html=True)
except Exception as e:
st.error(f"运行流程时出错：{e}")
else:
st.warning("请输入一条消息。")
defmain():
"""主函数以协调应用流程。"""
user_input, run_button = design_ui()
if run_button:
process_chatbot_flow(user_input)
if __name__ == "__main__":
main()
让我们仔细看看这段代码的关键组件，使得这个聊天机器人能够顺利高效地工作：
- • Tweaks —
TWEAKS 提供了对组件行为的精细控制。它们让您可以微调每个组件的行为，无论是发送会话 ID、数据库的搜索条件，还是共享用户特定的上下文信息，如联系信息或偏好。这些调整使您能够创建一个更智能、更高效、量身定制的设置。 - •
run_flow_api() — 处理与 Langflow API 的交互。它发送用户的消息并检索响应。 - •
design_ui() — 设置一个用户友好的 Streamlit 界面，以便与聊天机器人进行交互。 - • 反馈集成 — 包括点赞和点踩按钮，以收集用户反馈并改善未来的互动。
您的聊天机器人现在在一个干净的网络用户界面上运行！您可以通过改进用户体验设计，使其在视觉上更具吸引力。
我们现在可以使用这个用户界面无缝运行 Agent 流程：
看看你构建了什么！
你刚刚创建了一个强大的支持聊天机器人，功能强大，支持以下功能：
最棒的是什么？你在 Langflow 中构建了一个自定义组件，为独特的 AI 工作流打开了无尽的可能性。
粤ICP备14082021号
免费POC，
零成本试错
