@lobehub/chat
Version:
Lobe Chat - an open-source, high-performance chatbot framework that supports speech synthesis, multimodal, and extensible Function Call plugin system. Supports one-click free deployment of your private ChatGPT/LLM web application.
100 lines (59 loc) • 5.31 kB
text/mdx
---
title: 在 Netlify 上部署 LobeChat
description: >-
学习如何在 Netlify 上部署 LobeChat，包括 Fork 仓库、准备 OpenAI API Key、导入到 Netlify 工作台、配置站点名称与环境变量等步骤。
tags:
- Netlify
- LobeChat
- 部署教程
- OpenAI API Key
- 环境配置
---
# 使用 Netlify 部署
如果想在 Netlify 上部署 LobeChat，可以按照以下步骤进行操作：
## Netlify 部署 LobeChat
<Steps>
### Fork LobeChat 仓库
点击 Fork 按钮，将 LobeChat 仓库 Fork 到你的 GitHub 账号下。
### 准备好你的 OpenAI API Key
前往 [OpenAI API Key](https://platform.openai.com/account/api-keys) 获取你的 OpenAI API Key
### 在 Netlify 工作台导入
<Callout>经过测试，暂不支持类似 Vercel/Zeabur 的一键部署按钮，原因未知。因此需要手动导入</Callout>
点击 「Import from git」
<Image alt={'在 Netflix 工作台点击 「Import from git」'} height={362} inStep src={'https://github.com/lobehub/lobe-chat/assets/28616219/31b999e5-2a74-45fc-935b-f036e72a684d'} />
然后点击 「Deploy with Github」，并授权 Netlify 访问你的 GitHub 账号
<Image alt={'授权 Netlify 访问你的 GitHub 账号'} height={273} inStep src={'https://github.com/lobehub/lobe-chat/assets/28616219/c9c58141-5ec6-43f1-8d97-0a84a04dcdba'} />
然后选择 LobeChat 项目：
<Image alt={'选择 LobeChat github 项目'} height={228} inStep src={'https://github.com/lobehub/lobe-chat/assets/28616219/6c3968a8-fbbb-4268-a587-edaced2d96af'} />
### 配置站点名称与环境变量
在这一步，你需要配置你的站点，包括站点名称、构建命令、发布目录等。在「Site Name」字段填写上你的站点名称。其余配置如果没有特殊要求，无需修改，我们已经设定好了默认配置。
<Image alt={'配置 LobeChat 站点名称'} height={712} inStep src={'https://github.com/lobehub/lobe-chat/assets/28616219/f3885537-6d43-422f-b1b8-e70732401025'} />
点击 「Add environment variables」按钮，添加站点环境变量：
<Image alt={'添加 LobeChat 站点环境变量'} height={537} inStep src={'https://github.com/lobehub/lobe-chat/assets/28616219/3b607482-4d99-455a-bc10-3090dd4fe3c5'} />
以配置 OpenAI 为例，你需要添加的环境变量如下：
| 环境变量 | 类型 | 描述 | 示例 |
| ------------------ | -- | ------------------------------------------------------- | ---------------------------------------------------------- |
| `OPENAI_API_KEY` | 必选 | 这是你在 OpenAI 账户页面申请的 API 密钥 | `sk-xxxxxx...xxxxxx` |
| `ACCESS_CODE` | 必选 | 添加访问此服务的密码，你可以设置一个长密码以防被爆破，该值用逗号分隔时为密码数组 | `awCT74` 或 `e3@09!` or `code1,code2,code3` |
| `OPENAI_PROXY_URL` | 可选 | 如果你手动配置了 OpenAI 接口代理，可以使用此配置项来覆盖默认的 OpenAI API 请求基础 URL | `https://aihubmix.com/v1` ，默认值：`https://api.openai.com/v1` |
<Callout type={'tip'}>
LobeChat 支持的完整环境变量列表请参考 [📘 环境变量](/zh/docs/self-hosting/environment-variables)
部分
</Callout>
添加完成后，最后点击「Deploy lobe-chat」 进入部署阶段。
<Image alt={'环境变量添加完成'} height={600} inStep src={'https://github.com/lobehub/lobe-chat/assets/28616219/c9f74ec4-ce63-4ce9-b9e2-34bda6fda10b'} />
### 等待部署完成
点击部署后，会进入站点详情页面，你可以点击青色字样的「Deploying your site」或者 「Building」 黄色标签查看部署进度。
<Image alt={'Netlify 站点详情页'} height={396} inStep src={'https://github.com/lobehub/lobe-chat/assets/28616219/a7fd85d5-fd32-4756-814e-ff7ab7567fe1'} />
进入部署详情，你会看到下述界面，这意味着你的 LobeChat 正在部署中，只需等待部署完成即可。
<Image alt={'LobeChat 部署构建中'} height={325} inStep src={'https://github.com/lobehub/lobe-chat/assets/28616219/1ed8b13d-046e-47c8-bd61-116ffdf5d01b'} />
部署构建过程中：
<Image alt={'部署构建中'} height={558} inStep src={'https://github.com/lobehub/lobe-chat/assets/28616219/1c82d707-cb6f-4924-b246-a5235a919864'} />
### 部署成功，开始使用
如果你的界面中的 Deploy Log 如下所示，意味着你的 LobeChat 部署成功了。
<Image alt={'部署成功'} height={558} inStep src={'https://github.com/lobehub/lobe-chat/assets/28616219/c1f945d1-f3e2-4100-b6bb-24d4cb13c438'} />
此时，你可以点击「Open production deploy」，即可访问你的 LobeChat 站点
<Image alt={'访问你的 LobeChat 站点'} height={527} inStep src={'https://github.com/lobehub/lobe-chat/assets/28616219/b04723eb-64ad-4028-a901-dc4e4ee2d0c1'} />
</Steps>
## 绑定自定义域名（可选）
你可以使用 Netlify 提供的子域名，也可以选择绑定自定义域名。目前 Netlify 提供的域名还未被污染，大多数地区都可以直连。