AI 中转指南
AI 工具 AI 工具研究员 2 views

NextChat 部署到 Vercel

NextChat 部署到 Vercel 教程 2025 如果你想要一个界面简洁、支持多模型、可自己掌控数据的 AI 聊天工具， NextChat 是非常适合新手上手的选择。它支持 OpenAI 兼容接口，部署到 Vercel 后几乎不用自己维护服务器，更新也方便。对于国内用户来说，如果直接配置海外接口常会遇到连接不稳定、延迟高等问题，因此使用支持国内直连的聚

NextChat 部署到 Vercel 教程 2025

如果你想要一个界面简洁、支持多模型、可自己掌控数据的 AI 聊天工具，NextChat 是非常适合新手上手的选择。它支持 OpenAI 兼容接口，部署到 Vercel 后几乎不用自己维护服务器，更新也方便。对于国内用户来说，如果直接配置海外接口常会遇到连接不稳定、延迟高等问题，因此使用支持国内直连的聚合 API，会让 NextChat 的体验顺畅很多。

一、准备工作

在开始之前，先准备好这几项内容：

  • 一个 GitHub 账号
  • 一个 Vercel 账号
  • 一个 NextChat 项目源码
  • 一个可用的 API Key
  • 推荐使用的 API 服务：
    • Base URL：https://api-ic.stillhappy.cn/v1
    • 模型名：claude-sonnet-4-6 / gpt-5 / gemini-2.5-pro
    • API Key 示例：sk-xxx

这里用的是块乐 Encore 的 API，国内直连，支持 Claude / GPT / Gemini 全家桶，可在 https://stillhappy.cn 注册后获取 key。

二、下载安装 / 准备 NextChat 项目

NextChat 部署到 Vercel 一般不需要你先在本地完整安装运行，但建议你至少了解项目来源，方便后续管理。

方式 1：直接 Fork 官方仓库

你可以在 GitHub 上找到 NextChat 项目仓库，然后点击 Fork 到自己的 GitHub 账号下。这样最适合后续一键部署。

方式 2：本地拉取后上传到 GitHub

如果你想先在本地修改配置，也可以先克隆项目：

git clone https://github.com/ChatGPTNextWeb/NextChat.git
cd NextChat

然后上传到你自己的 GitHub 仓库。

可选：本地安装测试

如果你电脑里装了 Node.js，也可以本地先跑起来看看：

npm install
npm run dev

打开浏览器访问本地地址，确认项目结构正常。

对纯新手来说，最省事的方法就是 Fork → Vercel 导入部署。

三、打开 Vercel 设置并导入项目

接下来正式开始部署。

第 1 步：登录 Vercel

访问 https://vercel.com，使用 GitHub 账号登录。

第 2 步：导入项目

登录后点击：

  • Add New...
  • Project
  • 选择你刚刚 Fork 的 NextChat 仓库

Vercel 会自动识别这是一个 Next.js 项目，通常不需要改构建命令。

第 3 步：进入环境变量设置

在导入项目时，或进入项目后的 Settings → Environment Variables 页面，添加 API 相关参数。

这是部署成功的关键步骤。

四、配置 API 参数

NextChat 支持通过环境变量接入兼容 OpenAI 格式的接口。这里推荐直接使用 块乐 Encore API。

推荐配置参数

请在 Vercel 的环境变量中添加以下内容：

1）API Key

变量名：

OPENAI_API_KEY

变量值示例：

sk-xxx

2）Base URL

变量名：

BASE_URL

变量值：

https://api-ic.stillhappy.cn/v1

有些版本也可能使用 OPENAI_API_BASE_URL，如果你发现 BASE_URL 不生效，可以同时加上这一项。

3）模型名

变量名：

CUSTOM_MODELS

变量值示例：

claude-sonnet-4-6,gpt-5,gemini-2.5-pro

如果你只想默认显示一个模型，也可以先填：

claude-sonnet-4-6

4）可选默认模型

有些部署场景会用到默认模型设置，你可以加入：

DEFAULT_MODEL=claude-sonnet-4-6

五、完整示例配置

为了方便新手照着填，下面给你一份可以直接参考的参数表。

参数名 示例值
OPENAI_API_KEY sk-xxx
BASE_URL https://api-ic.stillhappy.cn/v1
OPENAI_API_BASE_URL https://api-ic.stillhappy.cn/v1
CUSTOM_MODELS claude-sonnet-4-6,gpt-5,gemini-2.5-pro
DEFAULT_MODEL claude-sonnet-4-6

配置说明

  • API Key：你在块乐 Encore 后台生成的密钥
  • Base URL：接口入口地址
  • 模型名：必须和服务端支持的模型名完全一致
  • CUSTOM_MODELS：让 NextChat 前端下拉框中显示可选模型
  • DEFAULT_MODEL：首次进入时默认使用的模型

再提醒一次：这里用的是块乐 Encore 的 API，国内直连，支持 Claude/GPT/Gemini 全家桶，在 https://stillhappy.cn 注册后获取 key。

六、部署并发布

环境变量填写完成后，点击 Deploy。

Vercel 会自动开始构建项目。一般几分钟内就能完成。部署成功后，你会获得一个类似下面的网址：

https://your-nextchat.vercel.app

打开后就能进入 NextChat 页面。

如果后续你修改了环境变量，记得重新部署一次，或者在 Vercel 后台点击 Redeploy，让新配置生效。

七、打开设置并检查前端参数

部署完成后，进入你的 NextChat 页面，建议做一次基本检查。

检查点 1：模型列表是否正常显示

如果你配置了：

CUSTOM_MODELS=claude-sonnet-4-6,gpt-5,gemini-2.5-pro

那么在模型选择区域应该能看到这些模型。

检查点 2：是否能正常发起对话

新建一个聊天窗口，输入一句简单测试语，例如：

你好，请用一句话介绍 NextChat。

如果能正常返回内容，说明接口接通成功。

检查点 3：切换模型测试

分别切换到：

  • claude-sonnet-4-6
  • gpt-5
  • gemini-2.5-pro

各发送一条消息，确认不同模型都能返回结果。

八、测试是否配置成功

推荐按下面顺序测试：

1. 基础连通性测试

发送最简单的问题：

请回复“连接成功”。

如果能返回“连接成功”或类似内容，说明 API Key 和 Base URL 基本无误。

2. 多模型测试

依次切换不同模型，确认不是只有单一模型能用。

3. 长文本测试

输入稍长一点的问题，例如：

请帮我写一个 100 字的产品介绍，主题是 AI 聊天助手。

这样可以判断模型是否真正稳定工作，而不是只通过了简单连通性校验。

九、常见问题

下面是部署 NextChat 到 Vercel 时最常见的几个问题。

1）报错 401 Unauthorized

表现：页面能打开，但发送消息时报 401。

原因：

  • API Key 填错
  • Key 失效
  • 环境变量没有成功保存
  • 改完变量后没重新部署

解决方法：

  • 检查 OPENAI_API_KEY 是否为正确的 sk-xxx
  • 回到块乐 Encore 后台重新生成新 key
  • 在 Vercel 中确认变量已保存
  • 执行一次 Redeploy

2）提示余额不足或请求失败

表现：接口报余额不足、quota 不足或调用被拒绝。

原因：

  • 账户余额不足
  • 调用的模型价格较高
  • 当前 key 没有可用额度

解决方法：

  • 登录 https://stillhappy.cn 检查账户余额
  • 先切换到成本更低的模型测试
  • 确认当前 key 对应的账户状态正常

3）模型名错误

表现：接口返回 model not found、invalid model。

原因：

  • 模型名拼写不对
  • 填了服务端不支持的模型
  • 大小写或中划线写错

正确示例：

claude-sonnet-4-6
gpt-5
gemini-2.5-pro

解决方法：

  • 不要凭感觉写模型名
  • 直接复制后台支持的模型标识
  • 检查 CUSTOM_MODELS 和 DEFAULT_MODEL 是否一致

4）页面能打开，但没有模型列表

原因：

  • CUSTOM_MODELS 没配置
  • 环境变量格式有误
  • 部署缓存未刷新

解决方法：

  • 填入： 
    claude-sonnet-4-6,gpt-5,gemini-2.5-pro
  • 注意逗号分隔，不要有奇怪空格
  • 重新部署后再刷新页面

5）Base URL 配置后仍然请求默认官方接口

原因：

  • 只填了一个变量，但当前版本读取的是另一个变量名

解决方法： 同时填写这两个：

BASE_URL=https://api-ic.stillhappy.cn/v1
OPENAI_API_BASE_URL=https://api-ic.stillhappy.cn/v1

这样兼容性更高。

十、总结

把 NextChat 部署到 Vercel 的核心，其实就三件事：

  1. 把项目导入 Vercel
  2. 配好环境变量
  3. 用正确的 API 地址、模型名和 Key 测试连通性

如果你想要一个部署简单、界面好看、支持多模型切换的 AI 聊天前端，NextChat 确实很值得一试。尤其搭配 块乐 Encore API，国内直连、模型选择多，能明显降低折腾成本。

建议你现在就动手部署一次，从最基础的 claude-sonnet-4-6 或 gpt-5 开始测试，跑通后再慢慢扩展更多模型和玩法。

Encore 主站：https://stillhappy.cn

SEO Title：NextChat 部署到 Vercel 教程 2025｜国内直连 API 配置完整指南
SEO Keywords：NextChat 部署到 Vercel, NextChat API 配置, Vercel 部署 NextChat, Encore API, stillhappy
SEO Description：本文详细讲解 NextChat 如何部署到 Vercel，并配置块乐 Encore API，包含 Base URL、模型名、API Key、测试方法与常见报错解决方案。

NextChat 部署到 Vercel
相关阅读
1 Cursor 中文使用教程 2 Cherry Studio 安装配置