你已经用 Dify 构建了一个强大的聊天机器人、写作助手或数据 Agent。
但现在的问题是：

“如何让这个 AI 能力被我们的 CRM 使用？”
“怎么把它嵌入到内部 OA 系统里？”
“客户网站能不能直接调用？”

答案就在 Dify 提供的完整 API 体系 和多种前端嵌入方案中。

本文将带你全面掌握：
✅ 如何通过 REST API 调用 Dify 应用
✅ 用户身份认证机制（API Key、JWT）
✅ 前端集成三大方式：Web 组件、iframe、React SDK

让你的 AI 应用不再孤立，而是真正融入业务流程，成为系统的“智能引擎”。

---

一、调用 Dify 应用的 REST API

Dify 支持将任何应用发布为标准 RESTful 接口，供后端服务、小程序、App 或第三方平台调用。

🧩 核心 API 概览（以 Chatbot 为例）

接口	功能
POST /v1/chat-messages	发送消息并获取回复
GET /v1/conversations	获取对话列表
GET /v1/messages	获取某次会话的历史消息
DELETE /v1/conversations/{id}	删除会话

✅ 所有接口文档可通过 Dify 控制台 → “API 集成” 查看 OpenAPI（Swagger）规范。

---

🚀 实战：发送一条消息并获取 AI 回复

步骤 1：获取 API 密钥

路径：
用户头像 → API Keys → 创建新密钥

保存生成的 API-KEY（如：app-xxxxx）

---

步骤 2：获取应用 ID

进入目标应用 → “发布” → “API 集成” → 复制 Application ID

---

步骤 3：调用 /chat-messages 接口

curl -X POST https://api.dify.ai/v1/chat-messages \
  -H "Authorization: Bearer {API_KEY}" \
  -H "Content-Type: application/json" \
  -d '{
    "inputs": {},
    "query": "你好，你能做什么？",
    "response_mode": "blocking",
    "user": "user-12345",
    "conversation_id": ""  // 新会话留空
  }'

参数说明：

参数	说明
inputs	输入变量（对应 Prompt 中的 {{xxx}}）
query	用户输入内容
response_mode	blocking（同步）、streaming（流式）
user	用户唯一标识（用于会话隔离）
conversation_id	指定会话 ID，为空则新建会话

---

返回结果示例：

{
  "event": "message",
  "id": "msg-xxx",
  "answer": "我是您的 AI 助手，请问有什么可以帮助您？",
  "conversation_id": "conv-yyy",
  "created_at": 1712345678
}

💡 提示：使用 streaming 模式时，需处理 SSE（Server-Sent Events）流式响应。

---

二、用户身份认证机制

为了让外部系统安全地访问 Dify API，平台提供了两种主流认证方式。

✅ 方式 1：API Key（适用于服务间调用）

• 适用场景：后端服务调用、定时任务、自动化脚本
• 优点：简单、稳定、无需登录
• 缺点：权限较粗，建议按应用分配独立 Key

最佳实践：

• 为不同系统分配不同的 API Key（如 CRM-Key、OA-Key）
• 定期轮换 Key，避免泄露
• 启用 IP 白名单（企业版支持）

---

✅ 方式 2：JWT 认证（适用于用户级调用）

如果你希望根据实际用户身份进行权限控制和行为追踪，推荐使用 JWT。

工作原理：

现有系统
   ↓ 登录成功
生成 JWT Token（含 user_id, role 等）
   ↓
调用 Dify API 时携带 Token
   ↓
Dify 验证签名并提取 user_id
   ↓
实现个性化会话与权限隔离

配置步骤（需自建验证服务）：

1. 在你的认证系统中签发 JWT，payload 示例：

{
  "sub": "user_67890",
  "name": "张三",
  "role": "customer",
  "iat": 1712345600,
  "exp": 1712349200
}

2. 将 JWT 添加到请求头：

Authorization: Bearer eyJhbGciOiJIUzI1NiIsInR5cCI6...

3. Dify 会在日志中记录 user_id，用于埋点分析与审计。

🔐 安全建议：JWT 签名密钥必须严格保密，且启用 HTTPS。

---

三、前端嵌入：三种主流方式详解

除了 API，Dify 还支持将 AI 助手以组件形式嵌入网页，提升用户体验。

✅ 方式 1：Web 组件（推荐新手使用）

Dify 提供一键生成的 <script> 标签，轻松嵌入任意网页。

步骤：

1. 进入应用 → “发布” → “Web App”
2. 配置外观（主题色、欢迎语、Logo）
3. 复制嵌入代码：

<script src="https://cloud.dify.ai/embed.js?app=YOUR_APP_ID"></script>

4. 粘贴到你的 HTML 页面中

✅ 效果：右下角出现浮动聊天窗口，支持移动端适配。

优势：

• 零开发成本
• 自动响应式布局
• 支持暗黑模式、多语言

---

✅ 方式 2：iframe 嵌入（适合内嵌管理系统）

如果你想把整个 Dify 聊天界面嵌入 OA、CRM 或后台系统，可使用 iframe。

<iframe 
  src="https://your-dify-web.com/app/YOUR_APP_ID" 
  width="100%" 
  height="600px"
  frameborder="0">
</iframe>

适用场景：

• 内部知识库门户
• 客服工作台集成
• 学习平台中的 AI 辅导模块

⚠️ 注意：需配置 CSP 白名单以允许嵌套。

---

✅ 方式 3：React SDK（适合定制化开发）

对于需要深度定制 UI/UX 的项目，Dify 提供了开源的 React 组件库。

GitHub 地址：https://github.com/langgenius/dify-web

安装：

npm install @dify/react-chat-widget

使用：

import { DifyChatWidget } from '@dify/react-chat-widget'

function App() {
  return (
    <div style={{ height: '100vh' }}>
      <DifyChatWidget
        token="YOUR_APP_ID"
        userId="user-123"
        userInfo={{ name: "测试用户" }}
        theme={{
          primaryColor: '#1677ff',
          fontSize: 14
        }}
        onMessageSend={(message) => console.log('发送:', message)}
      />
    </div>
  )
}

优势：

• 完全控制样式与交互逻辑
• 可监听事件（发送、接收、点击按钮）
• 支持国际化、无障碍访问

---

四、典型集成场景实战

场景	集成方式	说明
客服系统	Web 组件 + JWT	每个客户独立会话，支持历史追溯
ERP 系统	iframe + API Key	在采购页面旁嵌入 AI 助手
移动 App	REST API + Native WebView	Android/iOS 调用 API 展示结果
微信公众号	API 接口对接	用户发消息 → 调 Dify → 返回图文
BI 报表平台	React SDK + 用户绑定	点击“解释图表”触发 AI 分析

---

✅ 总结：Dify 是一个“可集成”的 AI 平台

集成方式	适用人群	开发成本	推荐指数
REST API	后端开发者	中	⭐⭐⭐⭐☆
Web 组件	运营/产品经理	极低	⭐⭐⭐⭐⭐
iframe	系统管理员	低	⭐⭐⭐⭐
React SDK	前端工程师	高（但灵活）	⭐⭐⭐⭐⭐

Dify 不只是一个玩具式的聊天机器人工具，而是一个真正可交付、可集成的企业级 AI 中枢。
无论你是想做自动化、智能化还是个性化升级，它都能提供坚实的底层支持。