跳至主要內容

Dify-5-发布与标注

程序员李某某大约 18 分钟

Dify-5-发布与标注

发布

发布为Web

使用 Dify 创建 AI 应用的一个好处在于,你可以在几分钟内就发布一个可供用户在互联网上公开访问的 Web 应用,该应用将根据你的 Prompt 和编排设置进行工作。

发布 AI 站点

在应用监测页中,你可以找到 WebApp 的管理卡片。打开访问开关后,你可以得到一个能够在互联网上公开分享的网址。

我们对以下两种应用类型均预置了漂亮的 WebApp 界面:

  • 文本生成型
  • 对话型

设置你的 AI 站点

点击 WebApp 卡片上的设置按钮,为 AI 站点配置一些选项,它们都会被最终用户所见:

界面语言目前已支持:英文,中文,繁体中文,葡萄牙语,德语,日本语,韩语,乌克兰语,越南语。如果您需要增加更多语言,可以在 GitHub 内提交 Issue 寻求支持open in new window或者提交 PR 贡献代码。

嵌入你的 AI 站点

除了将应用发布为一个公开的 AI 网站,你还可以将它嵌入并集成至你的网站、博客或其它任意网页中

Web应用设置

Web 应用是给应用使用者用的。应用开发者在 Dify 创建一个应用,就会获得一个对应的 Web 应用。Web 应用的使用者无需登陆,即可使用。Web 应用已适配不同尺寸的设备:PC,平板和手机。

Web 应用的内容和应用发布的配置一致。当修改了应用的配置,并在应用的提示词编排页点 “发布” 按钮发布后,Web 应用的内容也会根据当前应用的配置做更新。

我们可以在应用概览页开启和关闭对 Web 应用的访问,以及修改 Web 应用的站点信息:

  • 图标
  • 名称
  • 应用描述
  • 界面语言
  • 版权信息
  • 隐私政策链接

Web 应用的功能表现取决于开发者在编排应用时是否开启该功能,例如:

  • 对话开场白
  • 对话前填写的变量
  • 下一步问题建议
  • 语音转文字
  • 引用和归属
  • 更多类似的答案(文本型应用)
  • ......

文本生成型应用

文本生成类应用是一种根据用户提供的提示,自动生成高质量文本的应用。它可以生成各种类型的文本,例如文章摘要、翻译等。

文本生成型应用支持如下功能:

  1. 运行一次。
  2. 批量运行。
  3. 保存运行结果。
  4. 生成更多类似结果。

下面我们分别来介绍。

运行一次

输入查询内容,点击运行按钮,右侧会生成结果,如下图所示:

在生成的结果部分,点 “复制” 按钮可以将内容复制到剪贴板。点 “保存” 按钮可以保存内容。可以在 “已保存” 选项卡中看到保存过的内容。也可以对生成的内容点 “赞” 和 “踩”。

批量运行

有时,我们需要运行一个应用很多次。比如:有个 Web 应用可以根据主题来生成文章。现在要生成 100 篇不同主题的文章。那么这个任务要做 100 次,很麻烦。而且,必须等一个任务完成才能开始下一个任务。

上面的场景,用批量运行功能,操作便利(把主题录入一个 csv 文件,只需执行一次),也节约了生成的时间(多个任务同时运行)。使用方式如下:

第 1 步 进入批量运行页面

点击 “批量运行” 选项卡,则会进入批量运行页面。

第 2 步 下载模版并填写内容

点击下载模版按钮,下载模版。编辑模版,填写内容,并另存为 .csv 格式的文件。

第 3 步 上传文件并运行

如果需要导出生成的内容,可以点右上角的下载 “按钮” 来导出为 csv 文件。

注意: 上传的的 csv 文件的编码必须是 Unicode 的编码。否则会运行结果失败。解决方案:用 Excel,WPS 等导出为 csv 文件时,编码选择 Unicode

保存运行结果

点击生成结果下面的 “保存” 按钮,可以保存运行结果。在 “已保存” 选项卡中,可以看到所有已保存的内容。

生成更多类似结果

如果在应用编排时开启了 “更多类似” 的功能。在 Web 应用中可以点击 “更多类似” 的按钮来生成和当前结果相似的内容。如下图所示:

对话型应用

对话型应用采用一问一答模式与用户持续对话。对话型应用支持以下能力(请确认应用编排时有开启以下功能):

  • 对话前填写的变量。
  • 对话的创建、置顶、删除。
  • 对话开场白。
  • 下一步问题建议。
  • 语音转文字。
  • 引用和归属
对话前填写的变量

如你在应用编排时有设置变量的填写要求,则在对话前需要按提示填写信息才可进入对话窗口:

填写必要内容,点击 “开始对话” 按钮,开始聊天。

移动到 AI 的回答上,可以复制会话内容,给回答 “赞” 和 “踩”。

对话的创建、置顶和删除

点击 “新对话” 按钮开始一个新的对话。移动到一个会话上,可以对会话进行 “置顶” 和 “删除” 操作。

对话开场白

若在应用编排时开启了「对话开场白」功能,则在创建一个新对话时 AI 应用会自动发起第一句对话:

下一步问题建议

若在应用编排时开启了「下一步问题建议」功能,则在对话后系统自动生成 3 个相关问题建议:

语音转文字

若在应用编排时开启了「语音转文字」功能,则在 Web 应用端的输入框看到语音输入的图标,点击图标即可语音输入转成文字:

请注意确保你使用的设备环境已经授权使用麦克风。

引用与归属

开启该功能后,当 LLM 回复问题来自知识库的内容时,可以在回复内容下面查看到具体的引用段落信息,包括原始分段文本、分段序号、匹配度等。

嵌入网站

Dify 支持将你的 AI 应用嵌入到业务网站中,你可以使用该能力在几分钟内制作具有业务数据的官网 AI 客服、业务知识问答等应用。点击 WebApp 卡片上的嵌入按钮,复制嵌入代码,粘贴到你网站的目标位置。

当你在网站中使用 Dify 聊天机器人气泡按钮时,你可以自定义按钮的样式、位置和其他设置。

  • iframe 标签方式

    将 iframe 代码复制到你网站用于显示 AI 应用的标签中,如 <div><section> 等标签。

  • script 标签方式

    将 script 代码复制到你网站 <head><body> 标签中。

如果将 script 代码粘贴到官网的 <body> 处,你将得到一个官网 AI 机器人:

自定义 Dify 聊天机器人气泡按钮

Dify 聊天机器人气泡按钮可以通过以下配置选项进行自定义:

window.difyChatbotConfig = {
    // 必填项,由 Dify 自动生成
    token: 'YOUR_TOKEN',
    // 可选项,默认为 false
    isDev: false,
    // 可选项,当 isDev 为 true 时,默认为 '[https://dev.udify.app](https://dev.udify.app)',否则默认为 '[https://udify.app](https://udify.app)'
    baseUrl: 'YOUR_BASE_URL',
    // 可选项,可以接受除 `id` 以外的任何有效的 HTMLElement 属性,例如 `style`、`className` 等
    containerProps: {},
    // 可选项,是否允许拖动按钮,默认为 `false`
    draggable: false,
    // 可选项,允许拖动按钮的轴,默认为 `both`,可以是 `x`、`y`、`both`
    dragAxis: 'both',
    // 可选项,在 dify 聊天机器人中设置的输入对象
    inputs: {
        // 键是变量名
        // 例如:
        // name: "NAME"
    }

};

覆盖默认按钮样式

你可以使用 CSS 变量或 containerProps 选项来覆盖默认按钮样式。根据 CSS 优先级使用这些方法实现自定义样式。

1.修改 CSS 变量

支持以下 CSS 变量进行自定义:

/* 按钮距离底部的距离,默认为 `1rem` */
--dify-chatbot-bubble-button-bottom

/* 按钮距离右侧的距离,默认为 `1rem` */
--dify-chatbot-bubble-button-right

/* 按钮距离左侧的距离,默认为 `unset` */
--dify-chatbot-bubble-button-left

/* 按钮距离顶部的距离,默认为 `unset` */
--dify-chatbot-bubble-button-top

/* 按钮背景颜色,默认为 `#155EEF` */
--dify-chatbot-bubble-button-bg-color

/* 按钮宽度,默认为 `50px` */
--dify-chatbot-bubble-button-width

/* 按钮高度,默认为 `50px` */
--dify-chatbot-bubble-button-height

/* 按钮边框半径,默认为 `25px` */
--dify-chatbot-bubble-button-border-radius

/* 按钮盒阴影,默认为 `rgba(0, 0, 0, 0.2) 0px 4px 8px 0px)` */
--dify-chatbot-bubble-button-box-shadow

/* 按钮悬停变换,默认为 `scale(1.1)` */
--dify-chatbot-bubble-button-hover-transform

例如,要将按钮背景颜色更改为 #ABCDEF,请添加以下 CSS:

#dify-chatbot-bubble-button {
    --dify-chatbot-bubble-button-bg-color: #ABCDEF;
}

2.使用 containerProps 选项

使用 style 属性设置内联样式:

window.difyChatbotConfig = {
    // ... 其他配置
    containerProps: {
        style: {
            backgroundColor: '#ABCDEF',
            width: '60px',
            height: '60px',
            borderRadius: '30px',
        },
        // 对于较小的样式覆盖,也可以使用字符串作为 `style` 属性的值:
        // style: 'background-color: #ABCDEF; width: 60px;',
    },
}

使用 className 属性应用 CSS 类:

window.difyChatbotConfig = {
    // ... 其他配置
    containerProps: {
        className: 'dify-chatbot-bubble-button-custom my-custom-class',
    },
};
  1. 传递 inputs

支持四种类型的输入:

  1. **text-input**:接受任何值。如果输入字符串的长度超过允许的最大长度,将被截断。
  2. **paragraph**:类似于 text-input,接受任何值并在字符串长度超过最大长度时截断。
  3. **number**:接受数字或数字字符串。如果提供的是字符串,将使用 Number 函数将其转换为数字。
  4. **options**:接受任何值,前提是它匹配预先配置的选项之一。

示例配置:

window.difyChatbotConfig = {
    // ... 其他配置
    inputs: {
        name: 'apple',
    },
}

注意:使用 embed.js 脚本创建 iframe 时,每个输入值将被处理——使用 GZIP 压缩并以 base64 编码——然后附加到 URL 上。

例如,处理后的输入值 URL 将如下所示: http://localhost/chatbot/{token}?name=H4sIAKUlmWYA%2FwWAIQ0AAACDsl7gLuiv2PQEUNAuqQUAAAA%3D

基于 APIs 开发

Dify 基于“后端即服务”理念为所有应用提供了 API,为 AI 应用开发者带来了诸多便利。通过这一理念,开发者可以直接在前端应用中获取大型语言模型的强大能力,而无需关注复杂的后端架构和部署过程。

使用 Dify API 的好处

  • 让前端应用直接安全地调用 LLM 能力,省去后端服务的开发过程
  • 在可视化的界面中设计应用,并在所有客户端中实时生效
  • 对 LLM 供应商的基础能力进行了良好封装
  • 随时切换 LLM 供应商,并对 LLM 的密钥进行集中管理
  • 在可视化的界面中运营你的应用,例如分析日志、标注及观察用户活跃
  • 持续为应用提供更多工具能力、插件能力和数据集

如何使用

选择一个应用,在应用(Apps)左侧导航中可以找到访问 API(API Access)。在该页面中你可以查看 Dify 提供的 API 文档,并管理可访问 API 的凭据。

例如你是一个咨询公司的开发部分,你可以基于公司的私有数据库提供 AI 能力给终端用户或开发者,但开发者无法掌握你的数据和 AI 逻辑设计,从而使得服务可以安全、可持续的交付并满足商业目的。

在最佳实践中,API 密钥应通过后端调用,而不是直接以明文暴露在前端代码或请求中,这样可以防止你的应用被滥用或攻击。

你可以为一个应用创建多个访问凭据,以实现交付给不同的用户或开发者。这意味着 API 的使用者虽然使用了应用开发者提供的 AI 能力,但背后的 Promp 工程、数据集和工具能力是经封装的。

文本生成型应用

可用于生成高质量文本的应用,例如生成文章、摘要、翻译等,通过调用 completion-messages 接口,发送用户输入得到生成文本结果。用于生成文本的模型参数和提示词模版取决于开发者在 Dify 提示词编排页的设置。

你可以在应用 -> 访问 API 中找到该应用的 API 文档与范例请求。

例如,创建文本补全信息的 API 的调用示例:

cURL

curl --location --request POST 'https://api.dify.ai/v1/completion-messages' \
--header 'Authorization: Bearer ENTER-YOUR-SECRET-KEY' \
--header 'Content-Type: application/json' \
--data-raw '{
    "inputs": {},
    "response_mode": "streaming",
    "user": "abc-123"
}'

Python

import requests
import json

url = "https://api.dify.ai/v1/completion-messages"

headers = {
    'Authorization': 'Bearer ENTER-YOUR-SECRET-KEY',
    'Content-Type': 'application/json',
}

data = {
    "inputs": {"text": 'Hello, how are you?'},
    "response_mode": "streaming",
    "user": "abc-123"
}

response = requests.post(url, headers=headers, data=json.dumps(data))

print(response.text)
对话型应用

可用于大部分场景的对话型应用,采用一问一答模式与用户持续对话。要开始一个对话请调用 chat-messages 接口,通过继续传入返回的 conversation_id 可持续保持该会话。

你可以在应用 -> 访问 API 中找到该应用的 API 文档与范例请求。

例如,发送对话信息的 API的调用示例:

cURL

curl --location --request POST 'https://api.dify.ai/v1/chat-messages' \
--header 'Authorization: Bearer ENTER-YOUR-SECRET-KEY' \
--header 'Content-Type: application/json' \
--data-raw '{
    "inputs": {},
    "query": "eh",
    "response_mode": "streaming",
    "conversation_id": "1c7e55fb-1ba2-4e10-81b5-30addcea2276"
    "user": "abc-123"
}'

Python

import requests
import json

url = 'https://api.dify.ai/v1/chat-messages'
headers = {
    'Authorization': 'Bearer ENTER-YOUR-SECRET-KEY',
    'Content-Type': 'application/json',
}
data = {
    "inputs": {},
    "query": "eh",
    "response_mode": "streaming",
    "conversation_id": "1c7e55fb-1ba2-4e10-81b5-30addcea2276",
    "user": "abc-123"
}

response = requests.post(url, headers=headers, data=json.dumps(data))

print(response.json())

基于前端组件再开发

如果开发者是从头开发新产品或者在产品原型设计阶段,你可以使用 Dify 快速发布 AI 站点。与此同时,Dify 希望开发者能够充分自由的创造不同形式的前端应用,为此我们提供了:

  • SDK,用于在各种语言中快速接入 Dify API
  • WebApp Template,每种类型应用的 WebApp 开发脚手架

WebApp Template 是基于 MIT 协议开源的,你可以充分自由的修改并部署他们,以实现 Dify 的所有能力。或者作为你实现自己 App 的一份参考代码。

你可以在 GitHub 中找到这些 Template:

使用 WebApp 模版最快的方法就是在 GitHub 中点击「使用这个模版」,它相当于 Fork 了一个新的仓库。随后你需要配置 Dify 的 App ID 和 API Key,类似这样:

export const APP_ID = ''
export const API_KEY = ''
```

More config in `config/index.ts`:
```js
export const APP_INFO: AppInfo = {
  "title": 'Chat APP',
  "description": '',
  "copyright": '',
  "privacy_policy": '',
  "default_language": 'zh-Hans'
}

export const isShowPrompt = true
export const promptTemplate = ''

App ID 可以在 App 的 URL 内获取,其中的长串英文字符为唯一的 App ID。

每一种 WebApp 模版都提供了 README 文件,内含部署方式的说明。通常,WebApp 模版都包含了一个轻后端服务,这是为了确保开发者的 API KEY 不会直接暴露给用户。

这些 WebApp 模版能够帮助你快速搭建起 AI 应用原型,并使用 Dify 的所有能力。如果你基于它们开发了自己的应用或新的模版,欢迎你与我们分享。

标注

日志与标注

请确保您的应用在收集用户数据时遵守当地法规。通常的做法是发布隐私政策并征得用户的同意。

日志(Logs)功能用以观察与标记 Dify 应用的工作表现,Dify 为应用的全部交互过程记录了日志,无论你是通过 WebApp 或 API 调用的,如果你是 Prompt 工程师或 LLM 运营人员,它将为你提供可视化的 LLM 应用运营体验。

使用日志控制台

你可以在应用的左侧导航找到日志(Logs),该页面通常展示了:

  • 所选时间内用户与用户的交互记录
  • 用户输入与 AI 输出的结果,对于对话型应用通常是一系列的消息流
  • 用户、运营人员的评价,以及运营人员的改进标注

注意,如果团队中的多位协作者对同一条日志进行标注,最后标注的记录将覆盖此前的标注。

改进标注

这些标记将在 Dify 的后续版本中供模型微调使用,以提升模型的准确性与回复风格,当前预览版仅支持标记。

点击一条日志会在界面右侧打开日志详情面板,在该面板中运营人员可以对一次互动进行标注:

  • 对表现较佳的消息点赞
  • 对表现不佳的消息点踩
  • 对改进的结果标记改进回复,这代表了你期望 AI 回复的文本

注意,如果团队中的多位管理员对同一条日志进行标注,最后标注的记录将覆盖此前的标注。

标注回复

标注回复功能通过人工编辑标注为应用提供了可定制的高质量问答回复能力。

适用情景:

  • 特定领域的定制化回答: 在企业、政府等客服或知识库问答情景时,对于某些特定问题,服务提供方希望确保系统以明确的结果来回答问题,因此需要对在特定问题上定制化输出结果。比如定制某些问题的“标准答案”或某些问题“不可回答”。
  • POC 或 DEMO 产品快速调优: 在快速搭建原型产品,通过标注回复实现的定制化回答可以高效提升问答结果的生成预期,提升客户满意度。

标注回复功能相当于提供了另一套检索增强系统,可以跳过 LLM 的生成环节,规避 RAG 的生成幻觉问题。

使用流程

  1. 在开启标注回复功能之后,你可以对 LLM 对话回复内容进行标注,你可以将 LLM 回复的高质量答案直接添加为一条标注,也可以根据自己的需求编辑一条高质量答案,这些编辑的标注内容会被持久化保存;
  2. 当用户再次提问相似的问题时,会将问题向量化并查询中与之相似的标注问题;
  3. 如果找到匹配项,则直接返回标注中与问题相对应的答案,不再传递至 LLM 或 RAG 过程进行回复;
  4. 如果没有找到匹配项,则问题继续常规流程(传递至 LLM 或 RAG);
  5. 关闭标注回复功能后,系统将一直不再继续从标注内匹配回复。

提示词编排中开启标注回复

进入“应用构建->添加功能”开启标注回复开关:

开启时需要先设置标注回复的参数,可设置参数包括:Score 阈值 和 Embedding 模型

Score 阈值:用于设置标注回复的匹配相似度阈值,只有高于阈值分数的标注会被召回。

Embedding 模型:用于对标注文本进行向量化,切换模型时会重新生成嵌入。

点击保存并启用时,该设置会立即生效,系统将对所有已保存的标注利用 Embedding 模型生成嵌入保存。

在会话调试页添加标注

你可以在调试与预览页面直接在模型回复信息上添加或编辑标注。

编辑成你需要的高质量回复并保存。

再次输入同样的用户问题,系统将使用已保存的标注直接回复用户问题。

日志与标注中开启标注回复

进入“应用构建->日志与标注->标注”开启标注回复开关

在标注后台设置标注回复参数

标注回复可设置的参数包括:Score 阈值 和 Embedding 模型

Score 阈值:用于设置标注回复的匹配相似度阈值,只有高于阈值分数的标注会被召回。

Embedding 模型:用于对标注文本进行向量化,切换模型时会重新生成嵌入

批量导入标注问答对

在批量导入功能内,你可以下载标注导入模板,按模版格式编辑标注问答对,编辑好后在此批量导入。

批量导出标注问答对

通过标注批量导出功能,你可以一次性导出系统内已保存的所有标注问答对。

查看标注回复命中历史

在标注命中历史功能内,你可以查看所有命中该条标注的编辑历史、命中的用户问题、回复答案、命中来源、匹配相似分数、命中时间等信息,你可以根据这些系统信息持续改进你的标注内容。

上次编辑于:
贡献者: 李元昊