Deep Chat 是一个完全可定制的AI聊天组件,可以轻松嵌入到您的网站中。无论您是想创建一个利用热门API(如ChatGPT)的聊天机器人,还是连接到您自己的自定义服务,这个组件都可以实现!访问 deepchat.dev 查看所有可用功能、使用方法、示例等!
:rocket: 主要功能
- 连接到任何API
- 头像
- 名称
- 发送/接收文件
- 通过网络摄像头捕捉照片
- 通过麦克风录制音频
- 消息输入的语音转文字
- 听取消息回复的文字转语音
- 支持MarkDown和自定义元素来帮助结构化文本和渲染代码
- 为用户介绍功能的引导面板和动态模态窗口
- 从浏览器直接连接到热门AI API如OpenAI、HuggingFace、Cohere
- 支持所有主流的UI框架/库
- 在浏览器中托管模型
- 一切都可以定制!
:tada: :tada: 2.0现已推出 :tada: :tada:
宣布Deep Chat 2.0!根据您宝贵的反馈意见,我们重新设计并改善了Deep Chat。现在更容易实现到任何网站并配置,以提供用户最佳的聊天体验。查看 发布说明 以获取更多信息。
:computer: 入门指南
npm install deep-chat
如果使用React,请安装以下组件:
npm install deep-chat-react
只需将以下内容添加到您的标记中:
<deep-chat></deep-chat>
上述语法会根据您选择的框架有所不同(详见此处)。
:zap: 连接
连接到服务很简单,您只需使用 request
属性定义其API详细信息:
<deep-chat request='{"url":"https://service.com/chat"}'/>
该服务需要能够处理Deep Chat中使用的请求和响应格式。请阅读文档中的 连接 部分并查看 服务器模板 示例。
或者,如果您想在不更改目标服务的情况下连接,可以使用 interceptor
属性来增强传输对象,或使用 handler
函数来控制请求代码。
:electric_plug: 直接连接
通过使用 directConnection
属性从浏览器直接连接到流行AI API:
<deep-chat directConnection='{"openAI":true}'/>
<deep-chat directConnection='{"openAI":{"key": "optional-key-here"}}'/>
请注意,此方法应仅用于本地/原型/演示目的,因为它会将API Key暴露给浏览器。当准备上线时,请切换到上述使用 connect
属性的方法,并结合 代理服务。
当前支持的直接API连接: OpenAI, HuggingFace, Cohere, Stability AI, Azure, AssemblyAI
:robot: 网络模型
无需服务器,无需连接,完全在浏览器中托管LLM模型。
只需添加 deep-chat-web-llm 模块并定义 webModel 属性:
<deep-chat webModel="true" />
:camera: :microphone: 相机和麦克风
使用Deep Chat通过网络摄像头捕捉照片和通过麦克风录制音频。您可以使用 camera
和 microphone
属性启用此功能:
<deep-chat camera="true" microphone="true" ...other properties />
:microphone: :sound: 语音
https://github.com/OvidijusParsiunas/deep-chat/assets/18709577/e103a42e-b3a7-4449-b9db-73fed6d7876e
使用语音输入文本,使用语音合成功能收听回复。您可以通过 speechToText
和 textToSpeech
属性启用此功能。
<deep-chat speechToText="true" textToSpeech="true" ...other properties />
:beginner: 示例
查看您所选 UI框架/库 的在线codepen示例:
搭建您自己的服务器从未如此简单,这些 服务器模板 可以帮助快速建立您自己的服务或为其他API(如OpenAI)创建代理,一切都有文档和清晰的示例,让您可以在几秒钟内上线:
所有示例都可以部署在诸如 Vercel 这样的托管平台上。
:tv: 教程
演示视频可在 YouTube 上观看:
:joystick: 操作平台
在官方 操作平台 中创建、配置和使用 Deep Chat 组件,无需编写任何代码!
:tada: 更新 - 现在可以使用新的 扩展视图 将组件扩展到全屏尺寸:
:star2: 赞助商
感谢我们慷慨的赞助商!
matthiasamberg dorra techpeace aquarius-wing
:heart: 贡献
开源是由社区为社区建设的。欢迎所有对本项目的贡献!
另外,如果您有任何增强建议、关于如何进一步推进项目的想法或发现了一个错误,请不要犹豫创建一个新的问题票,我们会尽快查看!