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