当前位置: 首页 > news >正文

Chainlit接入DifyAI知识库接口快速实现自定义用户聊天界面

前言

由于dify只提供了一个分享用的网页应用,网页访问地址没法自定义,虽然可以接入NextWeb/ChatGPT web/open webui等开源应用。但是如果我们想直接给客户应用,还需要客户去设置配置,里面还有很多我们不想展示给客户的东西怎么办?于是,我使用Chainlit实现了一个无缝快速接入dify实现自定义用户使用界面的应用,代码清晰简单。还可以自定义logo、欢迎语、网站图标、语言输入、语音设别、文件上传等。

快速开始

获取dify的base_url和api_key

Dify官网地址 https://dify.ai/zh

登录Dify后台,在工作室里,选择一个你创建的应用,点击进入。
在这里插入图片描述
点击访问 API,点击API 密匙,创建一个,访问APIKEY. 复制服务器地址,后面需要配置到Chainlit的环境变量中
在这里插入图片描述
复制API密匙,后面需要配置到Chainlit的环境变量中
在这里插入图片描述

chainlit网页搭建

创建一个文件,例如“chainlit_chat”

mkdir chainlit_chat

进入 chainlit_chat文件夹下,执行命令创建python 虚拟环境空间(需要提前安装好python sdkChainlit 需要python>=3.8。,具体操作,由于文章长度问题就不在叙述,自行百度),命令如下:

python -m venv .venv
  • 这一步是避免python第三方库冲突,省事版可以跳过
  • .venv是创建的虚拟空间文件夹可以自定义

接下来激活你创建虚拟空间,命令如下:

#linux or mac
source .venv/bin/activate
#windows
.venv\Scripts\activate

在项目根目录下创建requirements.txt,内容如下:

chainlit~=1.1.306

在项目根目录下创建app.py文件,代码如下:

import osimport aiohttp
import chainlit as cl
import jsonimport requestsdify_base_url = os.environ["DIFY_BASE_URL"]
dify_api_key = os.environ["DIFY_API_KEY"]@cl.on_chat_start
def start_chat():cl.user_session.set("message_history", [])@cl.on_message
async def main(message: cl.Message):message_history = cl.user_session.get("message_history")message_history = message_history[-8:]message_history.append({"role": "user", "content": message.content, "content_type": "text"})msg = cl.Message(content="")url = f"{dify_base_url}/chat-messages"headers = {"Authorization": f"Bearer {dify_api_key}","Content-Type": "application/json"}print(headers)data = {"inputs": {},"query": message.content,"user": "tarzan","conversation_id": "","response_mode": "streaming","files": []}async for delta in fetch_sse(url, headers=headers, data=json.dumps(data)):task_id = delta.get("task_id", '')cl.user_session.set("task_id",task_id)await msg.stream_token(delta.get("answer", ''))await msg.send()# message_history.append({"role": "assistant", "type": "answer", "content": msg.content, "content_type": "text"})@cl.on_stop
def on_stop():print("The user wants to stop the task!")task_id = cl.user_session.get("task_id")print('task_id-------', task_id)if task_id:url = f"{dify_base_url}/chat-messages/{task_id}/stop"print('url', url)headers = {"Authorization": f"Bearer {dify_api_key}","Content-Type": "application/json"}print(headers)data = {"user": "tarzan"}with requests.post(url,headers=headers,data=data,) as resp:print('resp',resp.content)async def fetch_sse(url, headers, data):async with aiohttp.ClientSession() as session:async with session.post(url, headers=headers, data=data) as response:async for line in response.content:if line:  # 过滤掉空行data = line.decode('utf-8').rstrip('\n\r')print(f"Received: {line}")# 检查是否为事件类型行if data.startswith('data:'):data = data.split(':', 1)[1].strip()  # 提取数据内容# 如果数据包含换行符,可能需要进一步处理(这取决于你的具体需求)# 这里我们简单地打印出来# print(f"Received data for event 'conversation.message.delta': {data}")yield json.loads(data)

在项目根目录下创建.env环境变量,配置如下:

DIFY_BASE_URL="https://api.dify.ai/v1"
DIFY_API_KEY="app-key"
  • 如何是私有化部署,DIFY_BASE_URL替换成你私有化服务器的地址
  • DIFY_API_KEY 替换成你自己的API 密匙

执行以下命令安装依赖:

pip install -r .\requirements.txt
  • 安装后,项目根目录下会多出.chainlit.files文件夹和chainlit.md文件

运行应用程序

要启动 Chainlit 应用程序,请打开终端并导航到包含的目录app.py。然后运行以下命令:

 chainlit run app.py -w   
  • -w标志告知 Chainlit 启用自动重新加载,因此您无需在每次更改应用程序时重新启动服务器。您的聊天机器人 UI 现在应该可以通过http://localhost:8000访问。
  • 自定义端口可以追加--port 80

启动后界面如下:
在这里插入图片描述

  • chainlit 可以实现聊天的界面的完全自定义
  • chainlit 可以整理整合开源语音识别、语音播放、文件上传管理等功能
  • 本代码只整合了dify api的对话接口,后续可以接入文件图片上传的接口、历史会话记录等。

相关文章推荐

《Chainlit快速实现AI对话应用的界面定制化教程》
《Chainlit接入FastGpt接口快速实现自定义用户聊天界面》
《使用 Xinference 部署本地模型》
《Fastgpt接入Whisper本地模型实现语音输入》
《Fastgpt部署和接入使用重排模型bge-reranker》
《Fastgpt部署接入 M3E和chatglm2-m3e文本向量模型》
《Fastgpt 无法启动或启动后无法正常使用的讨论(启动失败、用户未注册等问题这里)》
《vllm推理服务兼容openai服务API》
《vLLM模型推理引擎参数大全》
《解决vllm推理框架内在开启多显卡时报错问题》
《Ollama 在本地快速部署大型语言模型,可进行定制并创建属于您自己的模型》

相关文章:

Chainlit接入DifyAI知识库接口快速实现自定义用户聊天界面

前言 由于dify只提供了一个分享用的网页应用,网页访问地址没法自定义,虽然可以接入NextWeb/ChatGPT web/open webui等开源应用。但是如果我们想直接给客户应用,还需要客户去设置配置,里面还有很多我们不想展示给客户的东西怎么办…...

《Python编程:从入门到实践》笔记(一)

一、字符串 1.修改字符串大小写 title()以首字母大写的方式显示每个单词,即将每个单词的首字母都改为大写,其他的改为小写。 upper()将字母都改为大写,lower()将字母都改为小写。 2.合并(拼接)字符串 Python使用加号()来合并字符串。这种合…...

Linux入门——06 基础IO

1.什么是当前路径 exe -> /home/lin/Desktop/Linux_learn/fork_learn/test 当前进程执行是磁盘路径下的哪一个程序 cwd -> /home/lin/Desktop/Linux_learn/fork_learn 当前进程的工作目录------》当前进程 1.1当前路径这个地址能改吗? 可以,使…...

未来城市的科技展望

未来城市,‌将是科技与人文深度融合的产物,‌展现出一个全方位智能化、‌绿色生态且可持续发展的全新面貌。‌随着物联网、‌人工智能等技术的飞速发展,‌未来城市的轮廓逐渐清晰,‌它将为我们带来前所未有的生活体验。‌ 在未来…...

DevOps安全性的重要性体现在哪?

DevOps的安全性,也称为DevSecOps,是DevOps领域中的一个重要方面,它强调将安全实践集成到DevOps流程中,以提高代码发布的质量和速度,并降低安全漏洞的风险。 DevOps安全性的重要性: 提高代码质量和速度&…...

【tip】数量级大小

大于1 量级英文名称中文名称yotta尧zetta泽exa艾peta拍tera太giga吉mega兆kilo千hecto百deca十 小于1 量级英文名称中文名称deci分centi厘milli毫micro微nano纳pico皮femto飞atto阿zepto仄yocto幺...

Java基础——自学习使用(static关键字)

一、static关键字是什么? static修饰的代码属于类,定义的变量存储在方法区的静态常量池当中 二、static可以修饰什么 1.static修饰变量 static修饰的变量叫做类变量,被所有该类产生的对象所共享,存储在方法区的静态常量池中 2…...

安装docker+docker远程连接

docker Docker 是⼀个开源的应⽤容器引擎,可以实现虚拟化,完全采⽤“沙盒”机制,容器之间不会存在任何接⼝。 docker架构 docker核心概念 1. 镜像(images):⼀个⾯向 docker 容器引擎的只读模板,…...

2080. 邻接点

代码 #include<bits/stdc.h> using namespace std; int main() {int n,e,i,j,x,y;cin>>n >> e;vector<vector<int>> adj(n1);for(i0;i<e;i){cin>>x>>y;adj[x].push_back(y);}for(i1;i<n;i)sort(adj[i].begin(),adj[i].end())…...

《计算机操作系统》(第4版)第7章 文件管理 复习笔记

第7章 文件管理 一、文件和文件系统 1. 数据项、记录和文件 数据组成可分为数据项、记录和文件三级&#xff0c;它们之间的层次关系如图7-1所示。 图7-1 文件、记录和数据项之间的层次关系 (1)数据项 在文件系统中&#xff0c;数据项是最低级的数据组织形式&#xff0c;可以分为…...

uniapp 修复使用 uni.saveImageToPhotosAlbum 方法在部分安卓手机上保存失败

场景&#xff1a;使用 uni.saveImageToPhotosAlbum 保存图片&#xff0c;其他手机都是可以的&#xff0c;但在鸿蒙系统的手机上出现了bug&#xff0c;报错Object {errMsg:"savelmageToPhotosAlbum:fai..errMsg:savelmageToPhotosAlbum:fail invalid filetype"} 原因&…...

电脑无法新建 Word Excle PPT 这些文件是咋回事

咦 我的电脑怎么没有 Excel文件 Word文件 和 PPT选项嘞 &#xff01;&#xff01; 今天突然要写个材料&#xff0c;发现自己新建文件竟然没有excel文档 word和ppt幻灯片这些选项。哦 原来是我自己上次把电脑从win7升级win10系统之后还没有安装wps这些所以不能使用。如果你的电…...

CANoe.DiVa的应用——生成TP层测试用例过程流程详解(二)

🙋‍♂️【Vector CANdelastudio配置CDD】文章合集💁‍♂️点击跳转 ——————————————————————————————————–—— 从0开始学习CANoe使用 从0开始学习车载测试 相信时间的力量 星光不负赶路者,时光不负有心人。 目录 一.概述2.经典CAN T…...

java设计模式--组合模式、适配器模式

组合模式 组合模式&#xff08;Composite Pattern&#xff09;允许你将对象组合成树形结构来表示“部分-整体”的层次结构。组合模式让客户端可以统一地处理单个对象和组合对象。在这个模式中&#xff0c;组合对象&#xff08;Composite&#xff09;和叶子对象&#xff08;Lea…...

保姆级-C#与Halcon的窗体界面展示阈值分割图像教程(机器视觉保姆级教程)

经历上一篇《零基础小白实现C#调用halcon dll的过程&#xff0c;并测试程序证明C#halcon联合开发成功》的发布已经过去三天啦&#xff0c; 零基础小白实现C#调用halcon dll的过程&#xff0c;并测试程序证明C#halcon联合开发成功_添加halcondotnet.dll-CSDN博客 在友友的催更下…...

Kotlin学习-01创建kotlin学习环境

安装idea https://www.jetbrains.com/zh-cn/ 创建项目 选择kotlin 修改Main.kt fun main() {print("Hello World!") }运行...

NGINX 之 location 匹配优先级

章节 1 NGINX 的源码安装 2 NGINX 核心配置详解 3 NGINX 之 location 匹配优先级 4 NGINX 基础参数与功能 目录 1 location 基础语法 1.1 location 语法说明表 1.2 URI部分简单介绍 2 location 匹配优先级 2.1 URI匹配的规则与顺序 2.2 精确匹配(location /1.txt) 2.3 区…...

算法_字符串专题---持续更新

文章目录 前言最长公共前缀题目要求题目解析代码如下 最长回文子串题目要求题目解析代码如下 二进制求和题目要求题目解析 字符串相乘题目要求题目解析代码如下 前言 本文将会向你介绍有关字符串的相关题目&#xff1a;最长公共前缀、最长回文子串、二进制求和、字符串相乘。本…...

Anaconda与conda、pip与conda的区别

Anaconda与conda、pip与conda的区别 1. 引言1.1 背景介绍1.2 文章目的 2. 什么是Anaconda&#xff1f;2.1 Anaconda简介2.2 Anaconda的优势2.3 Anaconda的安装与配置 3. 什么是Conda&#xff1f;3.1 Conda简介3.2 Conda的功能和用途3.3 Conda与Anaconda的关系 4. 什么是Pip&…...

odoo Request Entity Too Large

在数据库恢复中&#xff0c;文件有256M大小&#xff0c;无法正常恢复下。显示如下&#xff1a; 解决办法&#xff1a; 修改http.py文件里面的 DEFAULT_MAX_CONTENT_LENGTH参数&#xff0c; odoo\http.py DEFAULT_MAX_CONTENT_LENGTH 128 * 1024 * 1024 # 128MiB 修改为300M,即…...

Go 语言接口详解

Go 语言接口详解 核心概念 接口定义 在 Go 语言中&#xff0c;接口是一种抽象类型&#xff0c;它定义了一组方法的集合&#xff1a; // 定义接口 type Shape interface {Area() float64Perimeter() float64 } 接口实现 Go 接口的实现是隐式的&#xff1a; // 矩形结构体…...

高频面试之3Zookeeper

高频面试之3Zookeeper 文章目录 高频面试之3Zookeeper3.1 常用命令3.2 选举机制3.3 Zookeeper符合法则中哪两个&#xff1f;3.4 Zookeeper脑裂3.5 Zookeeper用来干嘛了 3.1 常用命令 ls、get、create、delete、deleteall3.2 选举机制 半数机制&#xff08;过半机制&#xff0…...

测试markdown--肇兴

day1&#xff1a; 1、去程&#xff1a;7:04 --11:32高铁 高铁右转上售票大厅2楼&#xff0c;穿过候车厅下一楼&#xff0c;上大巴车 &#xffe5;10/人 **2、到达&#xff1a;**12点多到达寨子&#xff0c;买门票&#xff0c;美团/抖音&#xff1a;&#xffe5;78人 3、中饭&a…...

2025 后端自学UNIAPP【项目实战:旅游项目】6、我的收藏页面

代码框架视图 1、先添加一个获取收藏景点的列表请求 【在文件my_api.js文件中添加】 // 引入公共的请求封装 import http from ./my_http.js// 登录接口&#xff08;适配服务端返回 Token&#xff09; export const login async (code, avatar) > {const res await http…...

学习STC51单片机32(芯片为STC89C52RCRC)OLED显示屏2

每日一言 今天的每一份坚持&#xff0c;都是在为未来积攒底气。 案例&#xff1a;OLED显示一个A 这边观察到一个点&#xff0c;怎么雪花了就是都是乱七八糟的占满了屏幕。。 解释 &#xff1a; 如果代码里信号切换太快&#xff08;比如 SDA 刚变&#xff0c;SCL 立刻变&#…...

优选算法第十二讲:队列 + 宽搜 优先级队列

优选算法第十二讲&#xff1a;队列 宽搜 && 优先级队列 1.N叉树的层序遍历2.二叉树的锯齿型层序遍历3.二叉树最大宽度4.在每个树行中找最大值5.优先级队列 -- 最后一块石头的重量6.数据流中的第K大元素7.前K个高频单词8.数据流的中位数 1.N叉树的层序遍历 2.二叉树的锯…...

均衡后的SNRSINR

本文主要摘自参考文献中的前两篇&#xff0c;相关文献中经常会出现MIMO检测后的SINR不过一直没有找到相关数学推到过程&#xff0c;其中文献[1]中给出了相关原理在此仅做记录。 1. 系统模型 复信道模型 n t n_t nt​ 根发送天线&#xff0c; n r n_r nr​ 根接收天线的 MIMO 系…...

SAP学习笔记 - 开发26 - 前端Fiori开发 OData V2 和 V4 的差异 (Deepseek整理)

上一章用到了V2 的概念&#xff0c;其实 Fiori当中还有 V4&#xff0c;咱们这一章来总结一下 V2 和 V4。 SAP学习笔记 - 开发25 - 前端Fiori开发 Remote OData Service(使用远端Odata服务)&#xff0c;代理中间件&#xff08;ui5-middleware-simpleproxy&#xff09;-CSDN博客…...

深度学习习题2

1.如果增加神经网络的宽度&#xff0c;精确度会增加到一个特定阈值后&#xff0c;便开始降低。造成这一现象的可能原因是什么&#xff1f; A、即使增加卷积核的数量&#xff0c;只有少部分的核会被用作预测 B、当卷积核数量增加时&#xff0c;神经网络的预测能力会降低 C、当卷…...

Aspose.PDF 限制绕过方案:Java 字节码技术实战分享(仅供学习)

Aspose.PDF 限制绕过方案&#xff1a;Java 字节码技术实战分享&#xff08;仅供学习&#xff09; 一、Aspose.PDF 简介二、说明&#xff08;⚠️仅供学习与研究使用&#xff09;三、技术流程总览四、准备工作1. 下载 Jar 包2. Maven 项目依赖配置 五、字节码修改实现代码&#…...