- 🤟 一站式轻松构建小程序、Web网站、移动应用:👉在线地址
- 💅小程序共同学习群,有两百多套小程序源码,可免费培训,一起畅谈摸鱼
使用 Next.js、Vercel AI SDK、OpenAI 以及 Supabase Auth 和 Postgres DB 构建的开源 AI 聊天机器人应用程序模板。
代码仓库:Next.js AI聊天机器人
特性
-
Next.js App 路由器
-
React 服务器组件 (RSC)、悬念和服务器操作
-
用于流式聊天 UI 的 Vercel AI SDK
-
支持 OpenAI(默认)、Anthropic、Hugging Face 或自定义 AI 聊天模型和/或 LangChain
-
边缘运行时就绪
-
-
使用 Tailwind CSS 进行样式设计
-
用于无头组件基元的 Radix UI
-
来自 Phosphor Icons 的图标
-
-
与Supabase Postgres DB的聊天记录
-
用于身份验证的 Supabase 身份验证
模型提供程序
此模板默认附带 OpenAI gpt-3.5-turbo
。但是,多亏了 Vercel AI SDK,您只需几行代码即可将 LLM 提供程序切换到 Anthropic、Hugging Face 或使用 LangChain。
部署
您可以一键将自己版本的 Next.js AI 聊天机器人部署到 Vercel:
设置 GitHub OAuth
此演示使用 GitHub Oauth。按照 Supabase 项目上的 GitHub OAuth 设置步骤进行操作。
配置站点网址
在 Supabase Dashboard 中,导航到 Auth > URL 配置,并将 Vercel URL 设置为站点 URL。
本地运行
您需要使用 .env.example
中定义的环境变量来运行 Next.js AI 聊天机器人。建议您为此使用 Vercel 环境变量,但只需要一个 .env
文件。
注意:您不应提交 .env 文件,否则它会暴露机密,从而允许其他人控制对您的各种 OpenAI 和身份验证提供商帐户的访问。
复制 .env.example
文件并填充所需的 env vars
:
cp .env.example .env
安装 Supabase CLI 并启动本地 Supabase 堆栈:
npm install supabase --save-dev npx supabase start
安装本地依赖项并启动开发模式:
pnpm install pnpm dev
- 资料
- 推荐使用国内版supabase:MemFire Cloud