Deep Chat

活跃
GitHub TypeScript MIT

简介

Deep Chat 是一行代码即可嵌入网站的全可定制 AI 聊天组件，原生支持 20+ 主流模型、文件、语音和 Markdown 渲染。

核心特性

  • 一行嵌入 - 在任意框架中直接使用 <deep-chat></deep-chat>
  • 20+ 主流 AI API 直接集成 - 浏览器原生支持 OpenAI、Claude、Gemini、Open WebUI
  • 多模态输入 - 文本、文件、摄像头拍照、麦克风录音、语音对话
  • Markdown 与自定义元素 - 结构化文本、代码块和 MathJax/Katex 渲染
  • OpenAI Realtime API - 开箱即用的低延迟语音对话
  • 焦点模式与浏览器存储 - 恢复输入文本和滚动位置，会话不丢失

适用场景

💡 用一行 HTML 把 ChatGPT 风格组件嵌入营销站点
💡 搭建支持摄像头拍照和语音回答的多模态助手
💡 直连 OpenAI / Claude / Gemini API，无需编写后端胶水代码
💡 在 React、Vue、Angular、Svelte 或原生 JS 应用中嵌入 AI 对话
💡 在开发者文档门户中流式渲染 Markdown 和代码块

标签

chat-ui web-component react multimodal voice

分类

💬 聊天界面

快速开始

npm install deep-chat
# React 用户请用：
npm install deep-chat-react

# 在 HTML 中直接使用：
<deep-chat directConnection='{"openAI": {"key": "YOUR_KEY"}}'></deep-chat>

# React 用法：
import { Chat } from "deep-chat-react";
export default function App() {
  return (
    <Chat
      directConnection={{ openAI: { key: "YOUR_KEY" } }}
      textInput={{ placeholder: { text: "随便问我点什么..." } }}
    />
  );
}
访问 GitHub 访问官网 查看文档

相关项目