一、安装步骤（宝塔版）

安装 Node.js
登录宝塔面板 → 软件商店
安装 Node.js 版本管理器
安装 Node.js ≥18（推荐 20.x）
设置为默认版本

上传项目
左侧【文件】→ 进入网站目录
上传项目压缩包 → 解压

安装依赖
进入项目根目录（看到 package.json）
点击顶部【终端】
输入：npm install

配置 API（看下面第二节）

开发模式启动（测试用）
终端输入：npm run dev

生产构建 + 启动（正式上线）
先执行构建：npm run build
构建成功后再启动：npm run start
注意：必须一条一条执行，不能一起输

注意：先按照3.4.5.6.步骤后。仍然无法访问。又重新做了一次步骤5后可以正常显示

二、API 配置（宝塔可视化修改）
配置文件位置
config/api.ts
修改方法
宝塔【文件】→ 找到 config/api.ts
点右侧【编辑】
把里面内容改成下面这样：
typescript

export const API_CONFIG = {
DOUBAO_API: {
baseUrl: “https://ark.cn-beijing.volces.com/api/v3/responses”,
apiKey: “你的API密钥”,
model: “doubao-seed-1-6-flash-250828”,
}
} as const
点击【保存】
三、更换其他 API（直接改文件即可）
OpenAI 示例
typescript

export const API_CONFIG = {
DOUBAO_API: {
baseUrl: “https://api.openai.com/v1/chat/completions”,
apiKey: “sk-你自己的key”,
model: “gpt-3.5-turbo”,
}
} as const
Ollama 本地模型示例
typescript

export const API_CONFIG = {
DOUBAO_API: {
baseUrl: “http://localhost:1143/api/chat”,
apiKey: “ollama”,
model: “llama2”,
}
} as const
修改后保存，重启项目即可。
四、让项目后台永久（宝塔必做）
npm run start 一关终端就停，用 PM2 常驻：

安装 PM2

npm install pm2 -g

启动项目

pm2 start npm –name “AI项目” — run start

常用命令

pm2 list # 查看状态
pm2 restart 名字 # 重启
pm2 logs 名字 # 看日志
五、域名访问（反向代理）
宝塔【网站】→ 你的域名 →【设置】
左侧【反向代理】→【添加反向代理】
目标 URL：http://127.0.0.1:3000
提交即可用域名访问
六、常见问题（宝塔版）

API 调用失败
检查 apiKey 是否填错
检查 API 余额是否充足
看 PM2 日志排查：pm2 logs AI项目

端口被占用（EADDRINUSE :::3000）
执行：

kill -9 $(lsof -t -i:3000)
再重启 PM2 即可。

安全保存密钥（可选）
项目根目录新建文件 .env.local
写入：
plaintext
NEXT_PUBLIC_API_BASE_URL=https://xxx
NEXT_PUBLIC_API_KEY=sk-xxx
NEXT_PUBLIC_API_MODEL=gpt-3.5-turbo
修改 config/api.ts：
typescript

baseUrl: process.env.NEXT_PUBLIC_API_BASE_URL || “”,
apiKey: process.env.NEXT_PUBLIC_API_KEY || “”,
model: process.env.NEXT_PUBLIC_API_MODEL || “”,

以下是原版教程

目录

安装步骤

API 配置

更换其他 API

常见问题

安装步骤

1. 确保已安装 Node.js

需要 Node.js 18.0 或更高版本。

# 检查 Node.js 版本
node -v

2. 安装项目依赖

# 在项目根目录执行
npm install
# 或
pnpm install
# 或
yarn install

3. 配置 API（见下方说明）

4. 启动开发服务器

npm run dev

应用将在 http://localhost:3000 启动。

5. 构建生产版本

npm run build
npm run start

API 配置

当前 API 设置位置

文件路径: config/api.ts

export const API_CONFIG = {
DOUBAO_API: {
baseUrl: “”, // API 基础 URL
apiKey: “”, // API 密钥
model: “”, // 模型名称
}
} as const

配置豆包 AI API

获取豆包 API 密钥：

访问 火山引擎

创建应用并获取 API Key

编辑 config/api.ts 文件：

export const API_CONFIG = {
DOUBAO_API: {
baseUrl: “https://ark.cn-beijing.volces.com/api/v3/responses”,
apiKey: “你的API密钥”,
model: “doubao-seed-1-6-flash-250828”, // 或其他可用模型
}
} as const

更换其他 API

方式一：直接修改配置文件

编辑 config/api.ts，替换为你使用的 API：

export const API_CONFIG = {
DOUBAO_API: {
baseUrl: “https://your-api-endpoint.com/v1/chat/completions”,
apiKey: “your-api-key”,
model: “your-model-name”,
}
} as const

方式二：修改服务层适配

如果更换的 API 格式不同，需要修改 services/doubao-service.ts 文件：

文件路径: services/doubao-service.ts

// 示例：适配 OpenAI 格式 API
export async function generateBabyNames(formData: NameFormData): Promise<GeneratedName[]> {
const response = await fetch(`${API_CONFIG.DOUBAO_API.baseUrl}`, {
method: “POST”,
headers: {
“Content-Type”: “application/json”,
“Authorization”: `Bearer ${API_CONFIG.DOUBAO_API.apiKey}`,
},
body: JSON.stringify({
model: API_CONFIG.DOUBAO_API.model,
messages: [
{
role: “user”,
content: `请根据以下信息生成5个宝宝名字…`
}
]
}),
});

// 处理响应…
}

常见 API 配置示例

OpenAI API

{
baseUrl: “https://api.openai.com/v1/chat/completions”,
apiKey: “sk-xxx…”,
model: “gpt-3.5-turbo”,
}

Azure OpenAI

{
baseUrl: “https://your-resource.openai.azure.com/openai/deployments/your-deployment/chat/completions?api-version=2023-05-15”,
apiKey: “your-api-key”,
model: “gpt-35-turbo”,
}

Anthropic Claude

{
baseUrl: “https://api.anthropic.com/v1/messages”,
apiKey: “sk-ant-xxx…”,
model: “claude-3-sonnet-20240229”,
}

本地 Ollama

{
baseUrl: “http://localhost:11434/api/chat”,
apiKey: “ollama”, // Ollama 不需要真实 key
model: “llama2”,
}

常见问题

Q: API 调用失败怎么办？

检查 API 密钥是否正确

确认 API 余额是否充足

查看浏览器控制台和终端的错误信息

检查网络连接和 CORS 设置

Q: 如何使用环境变量保护 API 密钥？

创建 .env.local 文件：

NEXT_PUBLIC_API_BASE_URL=https://your-api.com
NEXT_PUBLIC_API_KEY=your-api-key
NEXT_PUBLIC_API_MODEL=your-model

然后修改 config/api.ts：

export const API_CONFIG = {
DOUBAO_API: {
baseUrl: process.env.NEXT_PUBLIC_API_BASE_URL || “”,
apiKey: process.env.NEXT_PUBLIC_API_KEY || “”,
model: process.env.NEXT_PUBLIC_API_MODEL || “”,
}
} as const

Q: 支持哪些 AI 模型？

任何提供 HTTP API 的 AI 服务都可以接入，包括但不限于：

OpenAI (GPT-3.5/4)

豆包 AI

通义千问

文心一言

Claude

本地部署的模型 (Ollama, LocalAI)

需要帮助？

如遇到问题，请检查：

Node.js 和 npm 版本是否符合要求

所有依赖是否正确安装

API 配置是否完整正确

浏览器控制台是否有错误信息

资源收集不易，有能力者，可以直接下单购买。当然，你也可以通过以下渠道，免费获取下载资源。

关注“刺桐娱乐”公众号，回复“2605291”，也可免费获得资源