AI导哈

聊天工具模板

一个基于Next.js的ChatKit应用启动模板，包含预配置的会话端点和UI组件，用于快速构建OpenAI托管的聊天工作流。

  • by mcp-lab-creator
  • TypeScript
  • 本地部署
  • 更新于
在 GitHub 查看 mcp-lab-creator/weather

使用说明

ChatKit 初始模板

这个仓库是启动（或初始化）一个（项目/系统）的最简单方式 ChatKit（聊天工具包） 应用程序。它自带一个最小化的Next.js用户界面、ChatKit网络组件以及一个即开即用的会话端点，这样您就可以尝试使用OpenAI托管的工作流进行实验，这些工作流是基于 代理构建器。

你将获得

  • 使用 Next.js 构建的应用程序 <openai-chatkit> 网页组件和主题控制
  • 用于在[某处]创建会话的API终端 app/api/create-session/route.ts
  • 启动提示、主题、占位符文本和问候消息的配置文件

入门指南

1. 安装依赖项

npm install

2. 创建你的环境文件

复制示例文件并填写所需值：

cp .env.example .env.local

你可以从（某个地方）获取你的工作流ID 代理构建器 界面，点击“发布”后：

您可以从以下位置获取您的OpenAI API密钥： OpenAI API密钥 页面。

3. 配置ChatKit凭证

更新 .env.local 使用与您的设置相匹配的变量。

  • OPENAI_API_KEY API密钥已创建 在与您的Agent Builder相同的组织和项目中
  • NEXT_PUBLIC_CHATKIT_WORKFLOW_ID — 您在（某处）创建的工作流程 代理构建器
  • （可选） CHATKIT_API_BASE - ChatKit API终端的可定制基础URL

4. 运行应用程序

npm run dev

参观 http://localhost:3000 并开始聊天。使用启动屏幕上的提示来验证您的工作流程连接，然后自定义用户界面或提示列表 lib/config.ts 并且 components/ChatKitPanel.tsx。

5. 部署您的应用程序

npm run build

在部署您的应用程序之前，您需要通过将其添加到（验证域名的列表中）来验证该域名 域名白名单 在你的仪表盘上。

定制小贴士

参考文献

相关 MCP