|
|
---
|
|
|
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 提供的域名还未被污染，大多数地区都可以直连。
|
