🔧 chore: Add changelog workflow (#4662)

* 🔧 chore: Add changelog workflow * 🔧 chore: Update schema * 🔧 chore: Update schema * 🔧 chore: Update changelog workflow * 🔧 chore: Update changelog json * 🔧 chore: Update changelog * 📝 docs: Update Changelog
2026-06-14 03:30:19 +00:00 · 2024-11-26 14:48:06 +08:00
parent 19a0c5710c
commit 19da5e419d
77 changed files with 24859 additions and 17193 deletions
@@ -29,11 +29,17 @@ module.exports = defineConfig({
    jsonMode: true,
  },
  markdown: {
-    // reference: '你需要保持 mdx 的组件格式，输出文本不需要在最外层包裹任何代码块语法',
+    reference: '你需要保持 mdx 的组件格式，输出文本不需要在最外层包裹任何代码块语法',
    entry: ['./README.zh-CN.md', './contributing/**/*.zh-CN.md', './docs/**/*.zh-CN.mdx'],
    entryLocale: 'zh-CN',
    outputLocales: ['en-US'],
-    exclude: ['./contributing/_Sidebar.md', './contributing/_Footer.md', './contributing/Home.md'],
+    includeMatter: true,
    exclude: [
      './src/**/*',
      './contributing/_Sidebar.md',
      './contributing/_Footer.md',
      './contributing/Home.md',
    ],
    outputExtensions: (locale, { filePath }) => {
      if (filePath.includes('.mdx')) {
        if (locale === 'en-US') return '.mdx';
@@ -1 +1,10 @@
-module.exports = require('@lobehub/lint').semanticRelease;
+const config = require('@lobehub/lint').semanticRelease;
 config.plugins.push([
  '@semantic-release/exec',
  {
    prepareCmd: 'npm run workflow:changelog',
  },
 ]);
 module.exports = config;
@@ -0,0 +1,19 @@
 ---
 title: New Model Providers Added to LobeChat in November
 description: >-
  LobeChat model providers now support Gitee AI, InternLM (ShuSheng PuYu), xAI,
  and Cloudflare WorkersAI
 ---
 # Exciting New Additions to LobeChat's Model Providers This November! 🎉
 Wow, it looks like our AI family has welcomed some new members! This November, we are thrilled to introduce these shining new AI model providers:
 - **Gitee AI**: [https://ai.gitee.com](https://ai.gitee.com)
 - **InternLM**: [https://internlm.intern-ai.org.cn](https://internlm.intern-ai.org.cn)
 - **xAI**: [https://x.ai](https://x.ai)
 - **Cloudflare WorkersAI**: [https://developers.cloudflare.com/workers-ai](https://developers.cloudflare.com/workers-ai)
 We are always listening. Do you need support for more model providers?
 - Please visit [More Model Providers Support](https://github.com/lobehub/lobe-chat/discussions/1284) to submit your requests.
@@ -0,0 +1,17 @@
 ---
 title: LobeChat 11 月新增模型服务
 description: 'LobeChat 模型服务新增支持 Gitee AI, InternLM (书生浦语), xAI, Cloudflare WorkersAI'
 ---
 # LobeChat 11 月模型服务又添新成员啦! 🎉
 哇哦, 看来我们的 AI 大家庭又迎来了新成员! 在 11 月份,我们为你带来了这些闪亮登场的 AI 模型服务:
 - **Gitee AI**: [https://ai.gitee.com](https://ai.gitee.com)
 - **InternLM (书生浦语)**: [https://internlm.intern-ai.org.cn](https://internlm.intern-ai.org.cn)
 - **xAI**: [https://x.ai](https://x.ai)
 - **Cloudflare WorkersAI**: [https://developers.cloudflare.com/workers-ai](https://developers.cloudflare.com/workers-ai)
 我们始终在倾听，需要支持更多的模型服务？
 - 请前往 [更多模型服务商支持](https://github.com/lobehub/lobe-chat/discussions/1284) 提交您的需求
@@ -0,0 +1,12 @@
 {
  "$schema": "https://github.com/lobehub/lobe-chat/blob/main/docs/changelog/schema.json",
  "cloud": [],
  "community": [
    {
      "image": "https://github.com/user-attachments/assets/fa8fab19-ace2-4f85-8428-a3a0e28845bb",
      "id": "2024-11-25-november-providers",
      "date": "2024-11-25",
      "versionRange": ["1.33.0", "1.30.0"]
    }
  ]
 }
@@ -0,0 +1,70 @@
 {
  "$schema": "http://json-schema.org/draft-07/schema#",
  "additionalProperties": false,
  "properties": {
    "$schema": {
      "type": "string",
      "format": "uri"
    },
    "community": {
      "type": "array",
      "items": {
        "type": "object",
        "properties": {
          "image": {
            "type": "string"
          },
          "date": {
            "type": "string",
            "pattern": "^\\d+-\\d+-\\d+$"
          },
          "id": {
            "type": "string"
          },
          "versionRange": {
            "type": "array",
            "items": {
              "type": "string",
              "pattern": "^\\d+\\.\\d+\\.\\d+$"
            },
            "minItems": 1,
            "maxItems": 2
          }
        },
        "required": ["date", "id", "versionRange"],
        "additionalProperties": false
      }
    },
    "cloud": {
      "type": "array",
      "items": {
        "type": "object",
        "properties": {
          "image": {
            "type": "string"
          },
          "date": {
            "type": "string",
            "pattern": "^\\d+-\\d+-\\d+$"
          },
          "id": {
            "type": "string"
          },
          "versionRange": {
            "type": "array",
            "items": {
              "type": "string",
              "pattern": "^\\d+\\.\\d+\\.\\d+$"
            },
            "minItems": 1,
            "maxItems": 2
          }
        },
        "required": ["date", "id", "versionRange"],
        "additionalProperties": false
      }
    }
  },
  "required": ["$schema", "community"],
  "type": "object"
 }
@@ -60,17 +60,17 @@ To simultaneously enable multiple identity verification sources, please set the
 The order corresponds to the display order of the SSO providers.
-| SSO Provider       | Value       |
+| SSO Provider          | Value                   |
-| ------------------ | ----------- |
+| --------------------- | ----------------------- |
-| Auth0              | `auth0`     |
+| Auth0                 | `auth0`                 |
-| Authenlia          | `authenlia` |
+| Authenlia             | `authenlia`             |
-| Authentik          | `authentik` |
+| Authentik             | `authentik`             |
-| Casdoor            | `casdoor`   |
+| Casdoor               | `casdoor`               |
 | Cloudflare Zero Trust | `cloudflare-zero-trust` |
-| Github             | `github`    |
+| Github                | `github`                |
-| Logto              | `logto`     |
+| Logto                 | `logto`                 |
-| Microsoft Entra ID | `microsoft-entra-id`  |
+| Microsoft Entra ID    | `microsoft-entra-id`    |
-| ZITADEL            | `zitadel`   |
+| ZITADEL               | `zitadel`               |
 ## Other SSO Providers
@@ -57,17 +57,17 @@ LobeChat 与 Clerk 做了深度集成，能够为用户提供一个更加安全
 顺序为 SSO 提供商的显示顺序。
-| SSO 提供商         | 值          |
+| SSO 提供商            | 值                      |
-| ------------------ | ----------- |
+| --------------------- | ----------------------- |
-| Auth0              | `auth0`     |
+| Auth0                 | `auth0`                 |
-| Authenlia          | `authenlia` |
+| Authenlia             | `authenlia`             |
-| Authentik          | `authentik` |
+| Authentik             | `authentik`             |
-| Casdoor            | `casdoor`   |
+| Casdoor               | `casdoor`               |
 | Cloudflare Zero Trust | `cloudflare-zero-trust` |
-| Github             | `github`    |
+| Github                | `github`                |
-| Logto              | `logto`     |
+| Logto                 | `logto`                 |
-| Microsoft Entra ID | `microsoft-entra-id`  |
+| Microsoft Entra ID    | `microsoft-entra-id`    |
-| ZITADEL            | `zitadel`   |
+| ZITADEL               | `zitadel`               |
 ## 其他 SSO 提供商
@@ -8,9 +8,10 @@ tags:
  - Environment Variables
  - Webhook Configuration
 ---
 # Configure Clerk Authentication Service
-Go to [Clerk](https://clerk.com?utm_source=lobehub\&utm_medium=docs) to register and create an application to obtain the corresponding Public Key and Secret Key.
+Go to [Clerk](https://clerk.com?utm_source=lobehub&utm_medium=docs) to register and create an application to obtain the corresponding Public Key and Secret Key.
 ## Get Environment Variables
@@ -21,11 +22,9 @@ Go to [Clerk](https://clerk.com?utm_source=lobehub\&utm_medium=docs) to register
 Add `NEXT_PUBLIC_CLERK_PUBLISHABLE_KEY` and `CLERK_SECRET_KEY` environment variables. You can click on the "API Keys" in the menu and copy the corresponding values to get these environment variables.
 <Image
-alt={'Find the corresponding public and private key environment variables in Clerk'}
+  alt={'Find the corresponding public and private key environment variables in Clerk'}
-src={'https://github.com/lobehub/lobe-chat/assets/28616219/89883703-7a1a-4a11-b944-5d804544e57c'}>
+  src={'https://github.com/lobehub/lobe-chat/assets/28616219/89883703-7a1a-4a11-b944-5d804544e57c'}
-
+/>
 >
 </Image>
 The environment variables required for this step are as follows:
@@ -41,33 +40,31 @@ Since we let Clerk fully handle user authentication and management, we need Cler
 We need to add an endpoint in Clerk's Webhooks to inform Clerk to send notifications to this endpoint when a user's information changes.
 <Image
-alt={'Add Webhooks endpoint in Clerk'}
+  alt={'Add Webhooks endpoint in Clerk'}
-src={'https://github.com/lobehub/lobe-chat/assets/28616219/f50f47fb-5e8e-4930-bf4e-8cf6f5b8afb9'}>
+  src={'https://github.com/lobehub/lobe-chat/assets/28616219/f50f47fb-5e8e-4930-bf4e-8cf6f5b8afb9'}
-
+/>
 >
 </Image>
 Fill in your project URL in the endpoint, such as `https://your-project.com/api/webhooks/clerk`. Then, subscribe to events by checking the three user events (`user.created`, `user.deleted`, `user.updated`), and click create.
-<Callout type={'warning'}>The `https://` in the URL is essential to maintain the integrity of the URL.</Callout>
+<Callout type={'warning'}>
 The `https://` in the URL is essential to maintain the integrity of the URL.
 </Callout>
 <Image
-alt={'Configure URL and user events when adding Clerk Webhooks'}
+  alt={'Configure URL and user events when adding Clerk Webhooks'}
-src={'https://github.com/lobehub/lobe-chat/assets/28616219/0249ea56-ab17-4aa9-a56c-9ebd556c2645'}>
+  src={'https://github.com/lobehub/lobe-chat/assets/28616219/0249ea56-ab17-4aa9-a56c-9ebd556c2645'}
-
+/>
 >
 </Image>
 ### Add Webhook Secret to Environment Variables
 After creating, you can find the secret of this Webhook in the bottom right corner:
 <Image
-alt={'View Clerk Webhooks secret'}
+  alt={'View Clerk Webhooks secret'}
-src={'https://github.com/lobehub/lobe-chat/assets/28616219/fab4abb2-584b-49de-9340-813382951635'}>
+  src={'https://github.com/lobehub/lobe-chat/assets/28616219/fab4abb2-584b-49de-9340-813382951635'}
-
+/>
 >
 </Image>
 The environment variable corresponding to this secret is `CLERK_WEBHOOK_SECRET`:
@@ -78,4 +75,3 @@ CLERK_WEBHOOK_SECRET=whsec_xxxxxxxxxxxxxxxxxxxxxx
 </Steps>
 By following these steps, you have successfully configured the Clerk authentication service.
@@ -7,6 +7,7 @@ tags:
  - Webhook
  - 环境变量
 ---
 # 配置 Clerk 身份验证服务
 前往 [Clerk](https://clerk.com?utm_source=lobehub&utm_medium=docs) 注册并创建应用，获取相应的 Public Key 和 Secret Key。
@@ -22,7 +23,7 @@ tags:
 <Image
  alt={'在 Clerk 中找到对应的公私钥环境变量'}
  src={'https://github.com/lobehub/lobe-chat/assets/28616219/89883703-7a1a-4a11-b944-5d804544e57c'}
-></Image>
+/>
 此步骤所需的环境变量如下：
@@ -40,7 +41,7 @@ CLERK_SECRET_KEY=sk_live_xxxxxxxxxxxxxxxxxxxxxx
 <Image
  alt={'Clerk 添加 Webhooks 端点'}
  src={'https://github.com/lobehub/lobe-chat/assets/28616219/f50f47fb-5e8e-4930-bf4e-8cf6f5b8afb9'}
-></Image>
+/>
 在 endppint 中填写你的项目 URL，如 `https://your-project.com/api/webhooks/clerk`。然后在订阅事件（Subscribe to events）中，勾选 user 的三个事件（`user.created` 、`user.deleted`、`user.updated`），然后点击创建。
@@ -49,7 +50,7 @@ CLERK_SECRET_KEY=sk_live_xxxxxxxxxxxxxxxxxxxxxx
 <Image
  alt={'添加 Clerk Webhooks 时，配置 URL 和用户事件'}
  src={'https://github.com/lobehub/lobe-chat/assets/28616219/0249ea56-ab17-4aa9-a56c-9ebd556c2645'}
-></Image>
+/>
 ### 将 Webhook 秘钥添加到环境变量
@@ -58,7 +59,7 @@ CLERK_SECRET_KEY=sk_live_xxxxxxxxxxxxxxxxxxxxxx
 <Image
  alt={'查看 Clerk Webhooks 秘钥'}
  src={'https://github.com/lobehub/lobe-chat/assets/28616219/fab4abb2-584b-49de-9340-813382951635'}
-></Image>
+/>
 这个秘钥所对应的环境变量名为 `CLERK_WEBHOOK_SECRET`：
@@ -19,8 +19,7 @@ tags:
 <Steps>
 ### Create an Authelia Identity Provider
-We assume you are already familiar with using Authelia. Let's say your LobeChat instance is deployed at https://lobe.example.com/.
+We assume you are already familiar with using Authelia. Let's say your LobeChat instance is deployed at https://lobe.example.com/. Note that currently only localhost supports HTTP access; other domains need to enable TLS, otherwise Authelia will actively interrupt authentication by default.
 Note that currently only localhost supports HTTP access; other domains need to enable TLS, otherwise Authelia will actively interrupt authentication by default.
 Now, let's open and edit the configuration file of your Authelia instance:
@@ -46,8 +45,7 @@ identity_providers:
      userinfo_signing_algorithm: none
 ```
-Make sure to replace secret and redirect_urls with your own values.
+Make sure to replace secret and redirect_urls with your own values. Note! The secret configured in Authelia is ciphertext, i.e., a salted hash value. Its corresponding plaintext needs to be filled in LobeChat later.
 Note! The secret configured in Authelia is ciphertext, i.e., a salted hash value. Its corresponding plaintext needs to be filled in LobeChat later.
 Save the configuration file and restart the Authelia service. Now we have completed the Authelia configuration.
@@ -16,8 +16,7 @@ tags:
 <Steps>
 ### 创建 Authelia 提供应用
-我们现在默认您已经了解了如何使用 Authelia。假设您的 LobeChat 实例部署在 `https://lobe.example.com/` 中。
+我们现在默认您已经了解了如何使用 Authelia。假设您的 LobeChat 实例部署在 `https://lobe.example.com/` 中。注意，目前只有 `localhost` 支持 HTTP 访问，其他域名需要启用 TLS，否则 Authelia 默认将主动中断身份认证。
 注意，目前只有 `localhost` 支持 HTTP 访问，其他域名需要启用 TLS，否则 Authelia 默认将主动中断身份认证。
 现在，我们打开 Authelia 实例的配置文件进行编辑：
@@ -44,8 +43,7 @@ identity_providers:
      userinfo_signing_algorithm: none
 ```
-请您确保 `secret` 和 `redirect_urls` 替换成您自己的值。
+请您确保 `secret` 和 `redirect_urls` 替换成您自己的值。注意！Authelia 中配置 `secret` 是密文，即加盐哈希值。其对应的明文稍后需要填写在 lobeChat 中。
 注意！Authelia 中配置 `secret` 是密文，即加盐哈希值。其对应的明文稍后需要填写在 lobeChat 中。
 保存配置文件，然后重启 Authelia 服务。现在我们完成了 Authelia 的配置工作。
@@ -59,7 +57,7 @@ identity_providers:
 | `NEXT_AUTH_SSO_PROVIDERS` | 必选 | 选择 LoboChat 的单点登录提供商。使用 Authelia 请填写 `authelia`。 |
 | `AUTH_AUTHELIA_ID` | 必选 | 刚刚在 Authelia 配置的 `id`，示例值是 `lobe-chat` |
 | `AUTH_AUTHELIA_SECRET` | 必选 | 刚刚在 Authelia 配置的 `secret` 对应的明文，示例值是 `insecure_secret` |
-| `AUTH_AUTHELIA_ISSUER` | 必选 |您的 Authelia 的网址，例如 `https://sso.example.com` |
+| `AUTH_AUTHELIA_ISSUER` | 必选 | 您的 Authelia 的网址，例如 `https://sso.example.com` |
 | `NEXTAUTH_URL` | 必选 | 该 URL 用于指定 Auth.js 在执行 OAuth 验证时的回调地址，当默认生成的重定向地址发生不正确时才需要设置。`https://chat.example.com/api/auth` |
  <Callout type={'tip'}>
@@ -27,8 +27,8 @@ https://your-domain/api/auth/callback/authentik
 ```
 <Callout type={'info'}>
-  - 可以之后再填写或修改 `重定向 URL/Origin（正则）`，但是务必保证填写的 URL 与部署的 URL 一致。 
+  - 可以之后再填写或修改 `重定向 URL/Origin（正则）`，但是务必保证填写的 URL 与部署的 URL 一致。 -
-  - your-domain 请替换为自己的域名
+  your-domain 请替换为自己的域名
 </Callout>
 <Image
@@ -16,7 +16,8 @@ tags:
 [Casdoor](https://github.com/casdoor/casdoor) is an open-source authentication service that is rich in features and easy to use.
 <Callout type={'tip'}>
-  If you want to privately deploy Casdoor, we recommend using Docker Compose to deploy it together with the LobeChat database version, allowing LobeChat to share the same Postgres instance.
+  If you want to privately deploy Casdoor, we recommend using Docker Compose to deploy it together
  with the LobeChat database version, allowing LobeChat to share the same Postgres instance.
 </Callout>
 ## Casdoor Configuration Process
@@ -32,7 +33,8 @@ If you are deploying using a public network, the following assumptions apply:
 - You privately deploy Casdoor, and its domain is `https://lobe-auth-api.example.com`.
 <Steps>
-  ### Create a Casdoor Application
+
 ### Create a Casdoor Application
 Access your privately deployed Casdoor WebUI (default is `http://localhost:8000/`) to enter the console. The default account is `admin`, and the password is `123`.
@@ -49,46 +51,46 @@ There are also some optional fields that can enhance user experience:
 - Logo: `https://lobehub.com/icon-192x192.png`
 - Form CSS, Form CSS (Mobile):
-  ```html
+```html
-  <style>
+<style>
  .login-panel {
    padding: 40px 70px 0 70px;
    border-radius: 10px;
    background-color: #ffffff;
    box-shadow: rgba(17, 12, 46, 0.15) 0px 48px 100px 0px;
  }
  .panel-logo {
    width: 64px;
  }
  .login-logo-box {
    margin-top: 20px;
  }
  #parent-area
    > main
    > div
    > div.login-content
    > div.login-panel
    > div.login-form
    > div
    > div
    > button {
    box-shadow: none !important;
    border-radius: 10px !important;
    transition-property: all;
    transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
    transition-duration: 150ms;
    border: 1px solid #eee !important;
  }
  @media (max-width: 640px) {
    .login-panel {
-      padding: 40px 70px 0 70px;
+      padding: 40px 0 0 0;
-      border-radius: 10px;
+      box-shadow: none;
      background-color: #ffffff;
      box-shadow: rgba(17, 12, 46, 0.15) 0px 48px 100px 0px;
    }
-    .panel-logo {
+  }
-      width: 64px;
+</style>
-    }
+```
    .login-logo-box {
      margin-top: 20px;
    }
    #parent-area
      > main
      > div
      > div.login-content
      > div.login-panel
      > div.login-form
      > div
      > div
      > button {
      box-shadow: none !important;
      border-radius: 10px !important;
      transition-property: all;
      transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
      transition-duration: 150ms;
      border: 1px solid #eee !important;
    }
    @media (max-width: 640px) {
      .login-panel {
        padding: 40px 0 0 0;
        box-shadow: none;
      }
    }
  </style>
  ```
 Then, copy the `Client ID` and `Client Secret` and save them.
@@ -113,10 +115,13 @@ When deploying LobeChat, you need to configure the following environment variabl
 | `AUTH_CASDOOR_ISSUER` | Required | The OpenID Connect issuer for the Casdoor provider. |
 | `NEXTAUTH_URL` | Required | This URL specifies the callback address for Auth.js during OAuth verification and needs to be set only if the default generated redirect address is incorrect. `https://lobe.example.com/api/auth` |
-  <Callout type={'tip'}>
+<Callout type={'tip'}>
-    Visit [📘 Environment Variables](/docs/self-hosting/environment-variables/auth#casdoor) for details on related variables.
+  Visit [📘 Environment Variables](/docs/self-hosting/environment-variables/auth#casdoor) for
- 
+  details on related variables.
 </Callout>
 </Steps>
-<Callout type={'info'}>Once deployed successfully, users will be able to authenticate via Casdoor and use LobeChat.</Callout>
+<Callout type={'info'}>
  Once deployed successfully, users will be able to authenticate via Casdoor and use LobeChat.
 </Callout>
@@ -30,7 +30,8 @@ tags:
 - 你私有部署 Casdoor，其域名为 `https://lobe-auth-api.example.com`。
 <Steps>
-  ### 创建 Casdoor 应用
+
 ### 创建 Casdoor 应用
 访问你私有部署的 Casdoor WebUI（默认为 `http://localhost:8000/`） 进入控制台，默认账号为 `admin`，密码为 `123`。
@@ -47,46 +48,46 @@ tags:
 - Logo：`https://lobehub.com/icon-192x192.png`
 - 表单 CSS、表单 CSS（移动端）：
-  ```html
+```html
-  <style>
+<style>
  .login-panel {
    padding: 40px 70px 0 70px;
    border-radius: 10px;
    background-color: #ffffff;
    box-shadow: rgba(17, 12, 46, 0.15) 0px 48px 100px 0px;
  }
  .panel-logo {
    width: 64px;
  }
  .login-logo-box {
    margin-top: 20px;
  }
  #parent-area
    > main
    > div
    > div.login-content
    > div.login-panel
    > div.login-form
    > div
    > div
    > button {
    box-shadow: none !important;
    border-radius: 10px !important;
    transition-property: all;
    transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
    transition-duration: 150ms;
    border: 1px solid #eee !important;
  }
  @media (max-width: 640px) {
    .login-panel {
-      padding: 40px 70px 0 70px;
+      padding: 40px 0 0 0;
-      border-radius: 10px;
+      box-shadow: none;
      background-color: #ffffff;
      box-shadow: rgba(17, 12, 46, 0.15) 0px 48px 100px 0px;
    }
-    .panel-logo {
+  }
-      width: 64px;
+</style>
-    }
+```
    .login-logo-box {
      margin-top: 20px;
    }
    #parent-area
      > main
      > div
      > div.login-content
      > div.login-panel
      > div.login-form
      > div
      > div
      > button {
      box-shadow: none !important;
      border-radius: 10px !important;
      transition-property: all;
      transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
      transition-duration: 150ms;
      border: 1px solid #eee !important;
    }
    @media (max-width: 640px) {
      .login-panel {
        padding: 40px 0 0 0;
        box-shadow: none;
      }
    }
  </style>
  ```
 随后，复制 `客户端 ID` 和 `客户端密钥`，并保存。
@@ -113,8 +114,8 @@ tags:
  <Callout type={'tip'}>
    前往 [📘 环境变量](/zh/docs/self-hosting/environment-variables/auth#casdoor) 可查阅相关变量详情。
- 
+
 </Callout>
 </Steps>
-<Callout type={'info'}>部署成功后，用户将可以通过 Casdoor 身份认证并使用 LobeChat。</Callout>
+<Callout type={'info'}>部署成功后，用户将可以通过 Casdoor 身份认证并使用 LobeChat。</Callout>
@@ -31,39 +31,47 @@ If you are using Logto Cloud, assume its endpoint domain is `https://example.log
 <Steps>
  ### Create Logto Application
-  Access your privately deployed Logto WebUI or [Logto Cloud](http://cloud.logto.io/) to enter the console, and create a `Next.js (App Router)` application under `Applications` with any name.
+Access your privately deployed Logto WebUI or [Logto Cloud](http://cloud.logto.io/) to enter the console, and create a `Next.js (App Router)` application under `Applications` with any name.
-  ### Configure Logto
+### Configure Logto
-  Set the `Redirect URI` to `https://lobe.example.com/api/auth/callback/logto` and the `Post sign-out redirect URI` to `https://lobe.example.com/`.
+Set the `Redirect URI` to `https://lobe.example.com/api/auth/callback/logto` and the `Post sign-out redirect URI` to `https://lobe.example.com/`.
-  Set `CORS allowed origins` to `https://lobe.example.com`.
+Set `CORS allowed origins` to `https://lobe.example.com`.
-  <Image alt="Configure Logto" inStep src="https://github.com/user-attachments/assets/5b816379-c07b-40ea-bde4-df16e2e4e523" />
+<Image
  alt="Configure Logto"
  inStep
  src="https://github.com/user-attachments/assets/5b816379-c07b-40ea-bde4-df16e2e4e523"
 />
-  After successful creation, save the `Client ID` and `Client Secret`.
+After successful creation, save the `Client ID` and `Client Secret`.
-  ### Configure Environment Variables
+### Configure Environment Variables
-  <Image alt="Configure Environment Variables" inStep src="https://github.com/user-attachments/assets/15af6d94-af4f-4aa9-bbab-7a46e9f9e837" />
+<Image
  alt="Configure Environment Variables"
  inStep
  src="https://github.com/user-attachments/assets/15af6d94-af4f-4aa9-bbab-7a46e9f9e837"
 />
-  Set the obtained `Client ID` and `Client Secret` as `AUTH_LOGTO_ID` and `AUTH_LOGTO_SECRET` in the LobeChat environment variables.
+Set the obtained `Client ID` and `Client Secret` as `AUTH_LOGTO_ID` and `AUTH_LOGTO_SECRET` in the LobeChat environment variables.
-  Configure `AUTH_LOGTO_ISSUER` in the LobeChat environment variables as follows:
+Configure `AUTH_LOGTO_ISSUER` in the LobeChat environment variables as follows:
-  - `https://lobe-auth-api.example.com/oidc` if you are using a privately deployed Logto
+- `https://lobe-auth-api.example.com/oidc` if you are using a privately deployed Logto
-  - `https://example.logto.app/oidc` if you are using Logto Cloud
+- `https://example.logto.app/oidc` if you are using Logto Cloud
-  When deploying LobeChat, you need to configure the following environment variables:
+When deploying LobeChat, you need to configure the following environment variables:
-  | Environment Variable      | Type     | Description                                                                                                                                                                            |
+| Environment Variable | Type | Description |
-  | ------------------------- | -------- | -------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
+| --- | --- | --- |
-  | `NEXT_AUTH_SECRET`        | Required | The key used to encrypt Auth.js session tokens. You can generate a key using the command: `openssl rand -base64 32`                                                                    |
+| `NEXT_AUTH_SECRET` | Required | The key used to encrypt Auth.js session tokens. You can generate a key using the command: `openssl rand -base64 32` |
-  | `NEXT_AUTH_SSO_PROVIDERS` | Required | Select the single sign-on provider for LobeChat. For Logto, enter `logto`.                                                                                                             |
+| `NEXT_AUTH_SSO_PROVIDERS` | Required | Select the single sign-on provider for LobeChat. For Logto, enter `logto`. |
-  | `AUTH_LOGTO_ID`           | Required | The Client ID from the Logto App details page                                                                                                                                          |
+| `AUTH_LOGTO_ID` | Required | The Client ID from the Logto App details page |
-  | `AUTH_LOGTO_SECRET`       | Required | The Client Secret from the Logto App details page                                                                                                                                      |
+| `AUTH_LOGTO_SECRET` | Required | The Client Secret from the Logto App details page |
-  | `AUTH_LOGTO_ISSUER`       | Required | OpenID Connect issuer of the Logto provider                                                                                                                                            |
+| `AUTH_LOGTO_ISSUER` | Required | OpenID Connect issuer of the Logto provider |
-  | `NEXTAUTH_URL`            | Required | This URL specifies the callback address for Auth.js during OAuth verification, needed only if the default generated redirect address is incorrect. `https://lobe.example.com/api/auth` |
+| `NEXTAUTH_URL` | Required | This URL specifies the callback address for Auth.js during OAuth verification, needed only if the default generated redirect address is incorrect. `https://lobe.example.com/api/auth` |
  <Callout type={'tip'}>
    Visit [📘 Environment Variables](/docs/self-hosting/environment-variables/auth#logto) for details on related variables.
@@ -13,7 +13,8 @@ tags:
 [Logto](https://github.com/logto-io/logto) 是一个开源的身份验证服务，界面简洁美观、功能配置丰富且易于上手，你即可以选择使用其官方提供的 Logto Cloud，也可以选择私有部署 Logto。
 <Callout type={'tip'}>
-    若你想要私有部署 Logto，我们建议你将之与 LobeChat 数据库版本一同使用 Docker Compose 部署，此时 LobeChat 可以与之共用同一个 Postgres 实例。
+  若你想要私有部署 Logto，我们建议你将之与 LobeChat 数据库版本一同使用 Docker Compose 部署，此时
  LobeChat 可以与之共用同一个 Postgres 实例。
 </Callout>
 ## Logto 配置流程
@@ -42,6 +42,6 @@ tags:
 | `market`                  | 启用助手市场功能。               | 开启   |
 | `speech_to_text`          | 启用语音转文本功能。             | 开启   |
 | `knowledge_base`          | 启用知识库功能。                 | 开启   |
-| `clerk_sign_up`          | 启用Clerk注册功能。                 | 开启   |
+| `clerk_sign_up`           | 启用Clerk注册功能。              | 开启   |
 你可以随时检查 [featureFlags](https://github.com/lobehub/lobe-chat/blob/main/src/config/featureFlags/schema.ts) 以获取最新的特性标志列表。
@@ -12,7 +12,7 @@ tags:
 # Model List
-LobeChat supports customizing the model list during deployment. This configuration is done in the environment for each [model provider](/docs/self-hosting/environment-variables/model-provider). 
+LobeChat supports customizing the model list during deployment. This configuration is done in the environment for each [model provider](/docs/self-hosting/environment-variables/model-provider).
 You can use `+` to add a model, `-` to hide a model, and use `model name=display name<extension configuration>` to customize the display name of a model, separated by English commas. The basic syntax is as follows:
@@ -8,6 +8,7 @@ tags:
  - Cloud Storage
  - Image Upload
 ---
 # Configuring S3 Storage Service
 LobeChat has supported multimodal AI conversations since [a long time ago](https://x.com/lobehub/status/1724289575672291782), which involves the function of uploading images to AI. In the client-side database solution, image files are stored as binary data directly in the browser's IndexedDB database. However, this solution is not feasible in the server-side database. Storing file-like data directly in Postgres would greatly waste database storage space and slow down computational performance.
@@ -15,7 +16,9 @@ LobeChat has supported multimodal AI conversations since [a long time ago](https
 The best practice in this area is to use a file storage service (S3) to store image files. S3 is also the storage solution on which the file upload/knowledge base function depends.
 <Callout type={'info'}>
-In this documentation, S3 refers to a compatible S3 storage solution, which supports the Amazon S3 API for object storage systems. Common examples include Cloudflare R2, Alibaba Cloud OSS, and self-deployable Minio, all of which support the S3 compatible API.
+  In this documentation, S3 refers to a compatible S3 storage solution, which supports the Amazon S3
  API for object storage systems. Common examples include Cloudflare R2, Alibaba Cloud OSS, and
  self-deployable Minio, all of which support the S3 compatible API.
 </Callout>
 ## Core Environment Variables
@@ -23,57 +26,58 @@ In this documentation, S3 refers to a compatible S3 storage solution, which supp
 <Steps>
  ### `S3_ACCESS_KEY_ID` and `S3_SECRET_ACCESS_KEY`
-  These are the two keys required by all S3 compatible storage services to access the S3 storage service, not detailed here.
+These are the two keys required by all S3 compatible storage services to access the S3 storage service, not detailed here.
-  ### `S3_ENDPOINT`
+### `S3_ENDPOINT`
-  The request endpoint of the storage bucket. Note that this link should not contain the name of the storage bucket.
+The request endpoint of the storage bucket. Note that this link should not contain the name of the storage bucket.
-  <Callout type={'warning'}>`S3_ENDPOINT` must remove the suffix path, otherwise the uploaded files will not be accessible</Callout>
+<Callout type={'warning'}>
-
+  `S3_ENDPOINT` must remove the suffix path, otherwise the uploaded files will not be accessible
  For example, for Cloudflare:
  ```shell
  S3_ENDPOINT=https://0b33a03b5c993fd2f453379dc36558e5.r2.cloudflarestorage.com
  ```
  ### `S3_BUCKET` and `S3_REGION`
  The name and region of the storage bucket. `S3_BUCKET` is required to specify the name of the storage bucket. `S3_REGION` is optional and is used to specify the region of the storage bucket. Generally, it does not need to be added, but some service providers may require configuration.
  ### `S3_SET_ACL`
  Whether to set the ACL to `public-read` when uploading files. This option is enabled by default. If the service provider does not support setting individual ACLs for files (i.e., all files inherit the ACL of the storage bucket), enabling this option may cause request errors. Set `S3_SET_ACL` to `0` to disable it.
  ### `S3_PUBLIC_DOMAIN`
  The public access domain of the storage bucket, used to access files in the storage bucket. This address needs to be **publicly readable**. The reason is that when OpenAI's gpt-4o and other vision models recognize images, OpenAI will try to download this image link on their servers. Therefore, this link must be publicly accessible. If it is a private link, OpenAI will not be able to access the image and thus will not be able to recognize the image content properly.
  <Callout type={'warning'}>
    Additionally, since this access domain is often a separate URL, it needs to be configured to allow cross-origin access to the site. Otherwise, cross-origin issues will occur in the browser.
 </Callout>
-  ### `S3_ENABLE_PATH_STYLE`
+For example, for Cloudflare:
-  Whether to enable the `path-style` access mode of S3. This option is disabled by default. If your S3 service provider uses `path-style`, set `S3_ENABLE_PATH_STYLE` to `1` to enable it.
+```shell
 S3_ENDPOINT=https://0b33a03b5c993fd2f453379dc36558e5.r2.cloudflarestorage.com
 ```
 ### `S3_BUCKET` and `S3_REGION`
 The name and region of the storage bucket. `S3_BUCKET` is required to specify the name of the storage bucket. `S3_REGION` is optional and is used to specify the region of the storage bucket. Generally, it does not need to be added, but some service providers may require configuration.
 ### `S3_SET_ACL`
 Whether to set the ACL to `public-read` when uploading files. This option is enabled by default. If the service provider does not support setting individual ACLs for files (i.e., all files inherit the ACL of the storage bucket), enabling this option may cause request errors. Set `S3_SET_ACL` to `0` to disable it.
 ### `S3_PUBLIC_DOMAIN`
 The public access domain of the storage bucket, used to access files in the storage bucket. This address needs to be **publicly readable**. The reason is that when OpenAI's gpt-4o and other vision models recognize images, OpenAI will try to download this image link on their servers. Therefore, this link must be publicly accessible. If it is a private link, OpenAI will not be able to access the image and thus will not be able to recognize the image content properly.
 <Callout type={'warning'}>
  Additionally, since this access domain is often a separate URL, it needs to be configured to allow
  cross-origin access to the site. Otherwise, cross-origin issues will occur in the browser.
 </Callout>
 ### `S3_ENABLE_PATH_STYLE`
 Whether to enable the `path-style` access mode of S3. This option is disabled by default. If your S3 service provider uses `path-style`, set `S3_ENABLE_PATH_STYLE` to `1` to enable it.
  <Callout type={'info'}>
-  `path-style` and `virtual-host` are different ways to access buckets and objects in S3, with different URL structures and domain name resolutions.
+`path-style` and `virtual-host` are different ways to access buckets and objects in S3, with different URL structures and domain name resolutions.
-  Assuming the domain name of the S3 service provider is s3.example.net, the bucket is mybucket, and the object is config.env, the specific differences are as follows:
+Assuming the domain name of the S3 service provider is s3.example.net, the bucket is mybucket, and the object is config.env, the specific differences are as follows:
-  - path-style: `s3.example.net/mybucket/config.env`
+
-  - virtual-host: `mybucket.s3.example.net/config.env`
+- path-style: `s3.example.net/mybucket/config.env`
 - virtual-host: `mybucket.s3.example.net/config.env`
 </Callout>
  <Callout type={'tip'}>
-  Common S3 cloud service providers often default to the `virtual-host` mode, while self-deployed services like Minio default to using `path-style`. Therefore, if you use Minio as the S3 service, you need to set `S3_ENABLE_PATH_STYLE=1`.
+Common S3 cloud service providers often default to the `virtual-host` mode, while self-deployed services like Minio default to using `path-style`. Therefore, if you use Minio as the S3 service, you need to set `S3_ENABLE_PATH_STYLE=1`.
 </Callout>
 </Steps>
@@ -88,4 +92,3 @@ Currently, the S3 configuration tutorials included in the documentation are:
 </Cards>
 Click to view the tutorial for the corresponding platform. If the above tutorials do not include the S3 service provider you are using, feel free to submit a Pull Request to collectively improve the guide on S3 object storage.
@@ -64,6 +64,7 @@ S3_ENDPOINT=https://0b33a03b5c993fd2f453379dc36558e5.r2.cloudflarestorage.com
 `path-style` 和 `virtual-host` 在 S3 中是访问 bucket 和 object 的不同方式，URL 的结构和域名解析不太一样
 假设 S3 服务商的域名是 s3.example.net ，bucket为mybucket，object为config.env，具体区别如下：
 - path-style : `s3.example.net/mybucket/config.env`
 - virtual-host : `mybucket.s3.example.net/config.env`
@@ -6,6 +6,7 @@ tags:
  - S3 Storage
  - Configuration Guide
 ---
 # Configuring Cloudflare R2 Storage Service
 We need to configure an S3 storage service in the server-side database to store files.
@@ -23,13 +24,14 @@ The interface of Cloudflare R2 is shown below:
 <Image
  alt={'Cloudflare R2 Storage Interface'}
  src={'https://github.com/lobehub/lobe-chat/assets/28616219/41f7f677-0153-4a96-b849-5ac9b7ebefee'}
-></Image>
+/>
 When creating the bucket, specify its name and then click create.
 <Image
  alt={'Create Bucket in R2'}
  src={'https://github.com/lobehub/lobe-chat/assets/28616219/9c0d184c-3169-40fa-9115-011cfffb9ca7'}
-></Image>
+/>
 ### Obtain Environment Variables for the Bucket
@@ -38,7 +40,7 @@ In the settings of the R2 storage bucket, you can view the bucket configuration
 <Image
  alt={'View relevant information of the bucket'}
  src={'https://github.com/lobehub/lobe-chat/assets/28616219/2ceb210c-eca0-4439-ba27-8734d4ebb3ee'}
-></Image>
+/>
 The corresponding environment variables are:
@@ -51,7 +53,9 @@ S3_ENDPOINT=https://0b33a03b5c993fd2f453379dc36558e5.r2.cloudflarestorage.com
 S3_PUBLIC_DOMAIN=https://s3-for-lobechat.your-domain.com
 ```
-<Callout type={'warning'}>`S3_ENDPOINT` must have its path removed, otherwise uploaded files cannot be accessed.</Callout>
+<Callout type={'warning'}>
  `S3_ENDPOINT` must have its path removed, otherwise uploaded files cannot be accessed.
 </Callout>
 ### Obtain S3 Key Environment Variables
@@ -60,28 +64,28 @@ You need to obtain the access key for S3 so that the LobeChat server has permiss
 <Image
  alt={'View access key of the bucket'}
  src={'https://github.com/lobehub/lobe-chat/assets/28616219/be0c95c0-6693-44ee-a490-7e8dfaa8b34d'}
-></Image>
+/>
 Click the button in the upper right corner to create an API token and enter the create API Token page.
 <Image
  alt={'Create corresponding API token'}
  src={'https://github.com/lobehub/lobe-chat/assets/28616219/7b0ea46c-5157-40a8-888f-f47664a4884f'}
-></Image>
+/>
 Since our server-side database needs to read and write to the S3 storage service, the permission needs to be set to `Object Read and Write`, then click create.
 <Image
  alt={'Configure API token permissions'}
  src={'https://github.com/lobehub/lobe-chat/assets/28616219/d6f5a918-7b50-4d6e-83a6-3894ab930ddf'}
-></Image>
+/>
 After creation, you can see the corresponding S3 API token.
 <Image
  alt={'Copy API token'}
  src={'https://github.com/lobehub/lobe-chat/assets/28616219/763b18f9-2b5f-44bb-a479-9b56d46f7397'}
-></Image>
+/>
 The corresponding environment variables are:
@@ -99,14 +103,14 @@ In R2, you can find the CORS configuration in the settings of the storage bucket
 <Image
  alt={'Cross-Origin Settings in Cloudflare R2'}
  src={'https://github.com/lobehub/lobe-chat/assets/28616219/ab008be7-26b2-4b78-8bd9-24301bf34d23'}
-></Image>
+/>
 Add a CORS rule to allow requests from your domain (in the previous section, it is `https://your-project.vercel.app`):
 <Image
  alt={'Configure allowed site domain'}
  src={'https://github.com/lobehub/lobe-chat/assets/28616219/dfcc2cb3-2958-4498-a8a4-51bec584fe7d'}
-></Image>
+/>
 Example configuration is as follows:
@@ -126,7 +130,9 @@ After configuration, click save.
 ## Overview of Environment Variables
-<Callout type={'warning'}>The `https://` in the URL is essential and must be included to maintain the integrity of the URL.</Callout>
+<Callout type={'warning'}>
  The `https://` in the URL is essential and must be included to maintain the integrity of the URL.
 </Callout>
 ```shell
 # S3 Keys
@@ -143,4 +149,3 @@ S3_PUBLIC_DOMAIN=https://s3-dev.your-domain.com
 # Bucket Region, such as us-west-1. Generally not required, but some service providers may need it.
 # S3_REGION=us-west-1
 ```
@@ -19,45 +19,58 @@ We need to configure S3 storage service for file storage in the server-side data
 <Steps>
  ### Configure and Obtain S3 Bucket
-  Create a new bucket on [Tencent Cloud COS](https://console.cloud.tencent.com/cos/bucket):
+Create a new bucket on [Tencent Cloud COS](https://console.cloud.tencent.com/cos/bucket):
-  <Image alt={'Tencent Cloud COS Storage Interface'} src={'https://github.com/user-attachments/assets/d3626294-74ba-4944-9a63-052e6cf719ab'} />
+<Image
  alt={'Tencent Cloud COS Storage Interface'}
  src={'https://github.com/user-attachments/assets/d3626294-74ba-4944-9a63-052e6cf719ab'}
 />
-  Name the bucket (e.g., 'lobe'). Choose 'Public Read, Private Write', select any region, and keep other settings default.
+Name the bucket (e.g., 'lobe'). Choose 'Public Read, Private Write', select any region, and keep other settings default.
-  <Image alt={'COS Create Bucket'} src={'https://github.com/user-attachments/assets/7257eb0e-4e2c-4db2-981d-354598e2c60f'} />
+<Image
  alt={'COS Create Bucket'}
  src={'https://github.com/user-attachments/assets/7257eb0e-4e2c-4db2-981d-354598e2c60f'}
 />
-  ### Get Bucket-related Environment Variables
+### Get Bucket-related Environment Variables
-  View bucket information in COS bucket overview:
+View bucket information in COS bucket overview:
-  <Image alt={'View Bucket Information'} src={'https://github.com/user-attachments/assets/d7d65e32-679d-4e50-a933-28cf5dde1330'} />
+<Image
  alt={'View Bucket Information'}
  src={'https://github.com/user-attachments/assets/d7d65e32-679d-4e50-a933-28cf5dde1330'}
 />
-  Corresponding environment variables:
+Corresponding environment variables:
-  ```shell
+```shell
-  S3_BUCKET=lobe-130xxxxxx2
+S3_BUCKET=lobe-130xxxxxx2
-  S3_ENDPOINT=https://cos.ap-chengdu.myqcloud.com
+S3_ENDPOINT=https://cos.ap-chengdu.myqcloud.com
-  S3_REGION=ap-chengdu
+S3_REGION=ap-chengdu
-  S3_PUBLIC_DOMAIN=https://lobe-1251234567.cos.ap-chengdu.myqcloud.com
+S3_PUBLIC_DOMAIN=https://lobe-1251234567.cos.ap-chengdu.myqcloud.com
-  ```
+```
  <Callout type={'warning'}>
    Note: `S3_ENDPOINT` should be `https://cos.ap-chengdu.myqcloud.com`, not `https://lobe-130xxxxxx2.cos.ap-chengdu.myqcloud.com`
    Include `https://` in the URL
- 
+
 </Callout>
-  ### Configure CORS
+### Configure CORS
-  Add the following in 'Security Management - CORS Settings':
+Add the following in 'Security Management - CORS Settings':
-  <Image alt={'Configure CORS'} src={'https://github.com/user-attachments/assets/35164b25-c964-42ce-9cb0-32f6ebe1d07c'} />
+<Image
  alt={'Configure CORS'}
  src={'https://github.com/user-attachments/assets/35164b25-c964-42ce-9cb0-32f6ebe1d07c'}
 />
-  ### Get S3 Keys
+### Get S3 Keys
 Create a new SecretId and SecretKey at [Tencent Cloud API Key Management](https://console.cloud.tencent.com/cam/capi). Use as `S3_ACCESS_KEY_ID` and `S3_SECRET_ACCESS_KEY`.
  Create a new SecretId and SecretKey at [Tencent Cloud API Key Management](https://console.cloud.tencent.com/cam/capi). Use as `S3_ACCESS_KEY_ID` and `S3_SECRET_ACCESS_KEY`.
 </Steps>
 ### Additional Notes
@@ -10,6 +10,7 @@ tags:
  - Real-Time Communication
  - Peer-to-Peer
 ---
 # LobeChat WebRTC Sync
 ## Introduction to WebRTC
@@ -24,14 +24,14 @@ LobeChat provides some additional configuration options when deployed, which can
 ## Building a Custom Image with Overridden NEXT_PUBLIC Variables
-If you need to override NEXT_PUBLIC environment variables, you can build a custom Docker image using GitHub Actions
+If you need to override NEXT_PUBLIC environment variables, you can build a custom Docker image using GitHub Actions without forking the entire LobeChat repository. Here's a guide on how to do this:
 without forking the entire LobeChat repository. Here's a guide on how to do this:
 1. Create a new GitHub repository for your custom build.
 2. In your new repository, create a `.github/workflows` directory.
 3. Inside the `.github/workflows` directory, create a file named `build-custom-lobe.yml`:
 ```yaml
 name: Build Custom Image
@@ -82,13 +82,10 @@ jobs:
            NEXT_PUBLIC_SERVICE_MODE=${{ secrets.NEXT_PUBLIC_SERVICE_MODE }}
 ```
-4. In your GitHub Repository settings > Secrets and variables > Actions > Repository secrets,
+4. In your GitHub Repository settings > Secrets and variables > Actions > Repository secrets, add any NEXT_PUBLIC variables you want to override
 add any NEXT_PUBLIC variables you want to override
-5. Set "Read and write" permissions for workflows in  Repository settings > Actions > General > Workflow permissions.
+5. Set "Read and write" permissions for workflows in Repository settings > Actions > General > Workflow permissions.
-6. To build your custom image, go to the "Actions" tab in your GitHub repository and manually trigger the
+6. To build your custom image, go to the "Actions" tab in your GitHub repository and manually trigger the "Build Custom LobeChat Image" workflow.
 "Build Custom LobeChat Image" workflow.
-This approach allows you to create a custom build with your desired NEXT_PUBLIC variables without maintaining
+This approach allows you to create a custom build with your desired NEXT_PUBLIC variables without maintaining a full fork of the LobeChat repository. You can trigger a new build whenever you need to update your custom image.
 a full fork of the LobeChat repository. You can trigger a new build whenever you need to update your custom image.
@@ -75,8 +75,9 @@ LobeChat supports multimodal AI sessions, including the ability to upload unstru
 <Callout type={'info'}>
  `path-style` and `virtual-host` are different methods of accessing buckets and objects in S3, with differences in URL structure and domain name resolution.
-  Assuming the S3 service provider's domain is s3.example.net, the bucket is mybucket, and the object is config.env, the specific differences are:
+Assuming the S3 service provider's domain is s3.example.net, the bucket is mybucket, and the object is config.env, the specific differences are:
 - path-style: `s3.example.net/mybucket/config.env`
 - virtual-host: `mybucket.s3.example.net/config.env`
  - path-style: `s3.example.net/mybucket/config.env`
  - virtual-host: `mybucket.s3.example.net/config.env`
 </Callout>
@@ -75,6 +75,7 @@ LobeChat 支持多模态的 AI 会话，包括将图片、文件等非结构化
 `path-style` 和 `virtual-host` 在 S3 中是访问 bucket 和 object 的不同方式，URL 的结构和域名解析不太一样
 假设 S3 服务商的域名是 s3.example.net ，bucket为mybucket，object为config.env，具体区别如下：
 - path-style : `s3.example.net/mybucket/config.env`
 - virtual-host : `mybucket.s3.example.net/config.env`
@@ -21,8 +21,7 @@ If you want to deploy LobeChat on Alibaba Cloud, you can follow the steps below:
 ### Prepare your API Key
-Go to [OpenAI API Key](https://platform.openai.com/account/api-keys) to get your OpenAI API Key.
+Go to [OpenAI API Key](https://platform.openai.com/account/api-keys) to get your OpenAI API Key. Or go to [Tongyi Qianwen API Key](https://bailian.console.aliyun.com/?apiKey=1#/api-key) to get your API Key.
 Or go to [Tongyi Qianwen API Key](https://bailian.console.aliyun.com/?apiKey=1#/api-key) to get your API Key.
 ### One-click to deploy
@@ -18,8 +18,7 @@ tags:
 ### 准备好你的 API Key
-前往 [OpenAI API Key](https://platform.openai.com/account/api-keys) 获取你的 OpenAI API Key
+前往 [OpenAI API Key](https://platform.openai.com/account/api-keys) 获取你的 OpenAI API Key 或 前往 [通义千问 API Key](https://bailian.console.aliyun.com/?apiKey=1#/api-key) 获取你的通义千问 API Key
 或 前往 [通义千问 API Key](https://bailian.console.aliyun.com/?apiKey=1#/api-key) 获取你的通义千问 API Key
 ### 点击下方按钮进行部署
@@ -17,20 +17,16 @@ To install aaPanel, go to the [aaPanel](https://www.aapanel.com/new/download.htm
 ## Deployment
-1. Log in to aaPanel and click `Docker` in the menu bar
+1. Log in to aaPanel and click `Docker` in the menu bar ![install](https://github.com/user-attachments/assets/f67180c2-47ba-4b04-9f12-d274c7821085)
 ![install](https://github.com/user-attachments/assets/f67180c2-47ba-4b04-9f12-d274c7821085)
-2. The first time you will be prompted to install the `Docker` and `Docker Compose` services, click Install Now. If it is already installed, please ignore it.
+2. The first time you will be prompted to install the `Docker` and `Docker Compose` services, click Install Now. If it is already installed, please ignore it. ![install2](https://github.com/user-attachments/assets/e269bd27-d323-43ba-811b-c0f5e4137903)
 ![install2](https://github.com/user-attachments/assets/e269bd27-d323-43ba-811b-c0f5e4137903)
 3. After the installation is complete, find `LobeChat` in `One-Click Install` and click `install`  
-![install-LobeChat](https://github.com/user-attachments/assets/9f989104-bb8e-4acd-9721-6b1db1017d2b)
+   ![install-LobeChat](https://github.com/user-attachments/assets/9f989104-bb8e-4acd-9721-6b1db1017d2b)
-4. configure basic information such as the domain name, OpenAI API key, and port to complete the installation
+4. configure basic information such as the domain name, OpenAI API key, and port to complete the installation Note: The domain name is optional, if the domain name is filled, it can be managed through [Website]--> [Proxy Project], and you do not need to check [Allow external access] after filling in the domain name, otherwise you need to check it before you can access it through the port ![addLobeChat](https://github.com/user-attachments/assets/f0b2e72d-9eee-46a8-b094-4834b78764df)
   Note:
   The domain name is optional, if the domain name is filled, it can be managed through [Website]--> [Proxy Project], and you do not need to check [Allow external access] after filling in the domain name, otherwise you need to check it before you can access it through the port
 ![addLobeChat](https://github.com/user-attachments/assets/f0b2e72d-9eee-46a8-b094-4834b78764df)
 5. After installation, enter the domain name or IP+ port set in the previous step in the browser to access.
 - Name: application name, default `LobeChat-random characters`
 - Version selection: default `latest`
 - Domain name: If you need to access directly through the domain name, please configure the domain name here and resolve the domain name to the server
@@ -39,9 +35,7 @@ To install aaPanel, go to the [aaPanel](https://www.aapanel.com/new/download.htm
 6. After submission, the panel will automatically initialize the application, which will take about `1-3` minutes. It can be accessed after the initialization is completed.
 ## Visit LobeChat
 - If you have set a domain name, please directly enter the domain name in the browser address bar, such as `http://demo.lobechat`, to access the `LobeChat` console.
 - If you choose to access through `IP+Port`, please enter the domain name in the browser address bar to access `http://<aaPanelIP>:3210` to access the `HertzBeat` console.
 ![console](https://github.com/user-attachments/assets/a1af5778-f47a-4fdc-baf5-ca2a1e66f48e)
 - If you have set a domain name, please directly enter the domain name in the browser address bar, such as `http://demo.lobechat`, to access the `LobeChat` console.
 - If you choose to access through `IP+Port`, please enter the domain name in the browser address bar to access `http://<aaPanelIP>:3210` to access the `HertzBeat` console. ![console](https://github.com/user-attachments/assets/a1af5778-f47a-4fdc-baf5-ca2a1e66f48e)
@@ -12,23 +12,20 @@ tags:
 # 宝塔面板部署
 ## 前提
 - 仅适用于宝塔面板9.2.0及以上版本
 - 安装宝塔面板，前往[宝塔面板](https://www.bt.cn/new/download.html)官网，选择正式版的脚本下载安装
 ## 部署
-1. 登录宝塔面板，在左侧菜单栏中点击 `Docker`
+1. 登录宝塔面板，在左侧菜单栏中点击 `Docker` ![Docker](https://github.com/user-attachments/assets/15d92756-92f0-45da-8f95-bfe725d13003)
 ![Docker](https://github.com/user-attachments/assets/15d92756-92f0-45da-8f95-bfe725d13003) 
-2. 首次会提示安装`Docker`和`Docker Compose`服务，点击立即安装，若已安装请忽略。
+2. 首次会提示安装`Docker`和`Docker Compose`服务，点击立即安装，若已安装请忽略。 ![安装环境](https://github.com/user-attachments/assets/6e383b75-09e3-42d1-8a6c-5fb7cf558f00)
 ![安装环境](https://github.com/user-attachments/assets/6e383b75-09e3-42d1-8a6c-5fb7cf558f00)
-3. 安装完成后在`Docker-应用商店-AI/大模型`中找到 `LobeChat`，点击`安装`
+3. 安装完成后在`Docker-应用商店-AI/大模型`中找到 `LobeChat`，点击`安装` ![安装](https://github.com/user-attachments/assets/db59a5e7-32ed-49d7-a791-8f8ee6618c01)
-![安装](https://github.com/user-attachments/assets/db59a5e7-32ed-49d7-a791-8f8ee6618c01)
+
 4. 设置域名等基本信息，点击`确定` ![设置](https://github.com/user-attachments/assets/37251adf-949b-4aec-bc49-bf4647e119da)
 4. 设置域名等基本信息，点击`确定`
 ![设置](https://github.com/user-attachments/assets/37251adf-949b-4aec-bc49-bf4647e119da)
 - 名称：应用名称，默认`lobechat_随机字符`
 - 版本选择：默认`latest`
 - 域名：如您需要通过域名访问，请在此处填写您的域名
@@ -41,11 +38,9 @@ tags:
 - CPU 核心数限制：0为不限制，根据实际需要设置
 - 内存限制：0为不限制，根据实际需要设置
 5. 提交后面板会自动进行应用初始化，大概需要`1-3`分钟，初始化完成后即可访问。
 ## 访问 LobeChat
 - 如果您填写域名，请在浏览器输入您的域名访问，如`http://demo.lobechat`，即可访问 `LobeChat` 页面。
- 请在浏览器地址栏中输入域名访问 `http://<宝塔面板IP>:3210`，即可访问 `LobeChat` 页面。
+- 请在浏览器地址栏中输入域名访问 `http://<宝塔面板IP>:3210`，即可访问 `LobeChat` 页面。 ![LobeChat](https://github.com/user-attachments/assets/808f8849-5738-4a60-8ccf-01e300b0dc88)
 ![LobeChat](https://github.com/user-attachments/assets/808f8849-5738-4a60-8ccf-01e300b0dc88)
@@ -65,7 +65,8 @@ $ docker run -d -p 3210:3210 \
 - 使用你的 OpenAI API Key 替换上述命令中的 `sk-xxxx` ，获取 API Key 的方式详见最后一节。
 <Callout type={'tip'}>
-  LobeChat 支持的完整环境变量列表请参考 [📘 环境变量](/zh/docs/self-hosting/environment-variables) 部分
+  LobeChat 支持的完整环境变量列表请参考 [📘 环境变量](/zh/docs/self-hosting/environment-variables)
  部分
 </Callout>
 <Callout>
@@ -86,7 +86,8 @@ tags:
 | `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) 部分
+  LobeChat 支持的完整环境变量列表请参考 [📘 环境变量](/zh/docs/self-hosting/environment-variables)
  部分
 </Callout>
 添加完成后，最后点击「Deploy lobe-chat」 进入部署阶段。
@@ -13,7 +13,10 @@ tags:
 LobeChat defaults to using a client-side database (IndexedDB) but also supports deploying a server-side database. LobeChat uses Postgres as the backend storage database.
 <Callout>
-  PostgreSQL is a powerful open-source relational database management system with high scalability and standard SQL support. It provides rich data types, concurrency control, data integrity, security, and programmability, making it suitable for complex applications and large-scale data management.
+  PostgreSQL is a powerful open-source relational database management system with high scalability
  and standard SQL support. It provides rich data types, concurrency control, data integrity,
  security, and programmability, making it suitable for complex applications and large-scale data
  management.
 </Callout>
 This guide will introduce the process and principles of deploying the server-side database version of LobeChat on any platform from a framework perspective, so you can understand both the what and the why, and then deploy according to your specific needs.
@@ -37,7 +40,9 @@ Before deployment, make sure you have a Postgres database instance ready. You ca
 - `A.` Use Serverless Postgres instances like Vercel/Neon;
 - `B.` Use self-deployed Postgres instances like Docker/Railway/Zeabur, collectively referred to as Node Postgres instances;
-<Callout>There is a slight difference in the way they are configured in terms of environment variables.</Callout>
+<Callout>
  There is a slight difference in the way they are configured in terms of environment variables.
 </Callout>
 Since we support file-based conversations/knowledge base conversations, we need to install the `pgvector` plugin for Postgres. This plugin provides vector search capabilities and is a key component for LobeChat to implement RAG.
@@ -49,13 +54,16 @@ LobeChat supports both client-side and server-side databases, so we provide an e
 For server-side database deployment scenarios, you need to set `NEXT_PUBLIC_SERVICE_MODE` to `server`.
 <Callout type={'info'}>
-In the official `lobe-chat-database` Docker image, this environment variable is already set to `server` by default. Therefore, if you deploy using the Docker image, you do not need to configure this environment variable again.
+  In the official `lobe-chat-database` Docker image, this environment variable is already set to
  `server` by default. Therefore, if you deploy using the Docker image, you do not need to configure
  this environment variable again.
 </Callout>
 <Callout type={'tip'}>
 Since environment variables starting with `NEXT_PUBLIC` take effect in the front-end code, they cannot be modified through container runtime injection. (Refer to the `next.js` documentation [Configuring: Environment Variables | Next.js (nextjs.org)](https://nextjs.org/docs/pages/building-your-application/configuring/environment-variables)). This is why we chose to create a separate DB version image.
 If you need to modify variables with the `NEXT_PUBLIC` prefix in a Docker deployment, you must build the image yourself and inject your own `NEXT_PUBLIC` prefixed environment variables during the build.
 </Callout>
 ### `DATABASE_URL`
@@ -63,7 +71,9 @@ If you need to modify variables with the `NEXT_PUBLIC` prefix in a Docker deploy
 The core of configuring the database is to add the `DATABASE_URL` environment variable and fill in the Postgres database connection URL you have prepared. The typical format of the database connection URL is `postgres://username:password@host:port/database`.
 <Callout type={'info'}>
-If you want to enable SSL when connecting to the database, please refer to the [documentation](https://stackoverflow.com/questions/14021998/using-psql-to-connect-to-postgresql-in-ssl-mode) for setup instructions.
+  If you want to enable SSL when connecting to the database, please refer to the
  [documentation](https://stackoverflow.com/questions/14021998/using-psql-to-connect-to-postgresql-in-ssl-mode)
  for setup instructions.
 </Callout>
 ### `DATABASE_DRIVER`
@@ -85,7 +95,8 @@ Therefore, if you follow the standard deployment methods below, you do not need
 Considering that users will store sensitive information such as their API Key and baseURL in the database, we need a key to encrypt this information to prevent leakage in case of a database breach. Hence, the `KEY_VAULTS_SECRET` environment variable is used to encrypt sensitive information like user-stored apikeys.
 <Callout type={'info'}>
-You can generate a random 32-character string as the value of `KEY_VAULTS_SECRET` using `openssl rand -base64 32`.
+  You can generate a random 32-character string as the value of `KEY_VAULTS_SECRET` using `openssl
  rand -base64 32`.
 </Callout>
 </Steps>
@@ -104,7 +115,8 @@ The integration of Clerk is relatively simple, requiring only the configuration
 - `CLERK_WEBHOOK_SECRET`, which is generated by following these instructions: [Configure Clerk Authentication Service](/docs/self-hosting/advanced/auth/clerk#create-and-configure-webhook-in-clerk).
 <Callout type={'tip'}>
-In Vercel deployment mode, we recommend using Clerk as the authentication service for a better user experience.
+  In Vercel deployment mode, we recommend using Clerk as the authentication service for a better
  user experience.
 </Callout>
 However, this type of authentication relies on Clerk's official service, so there may be some limitations in certain scenarios:
@@ -122,7 +134,8 @@ NextAuth is an open-source authentication library that supports multiple identit
 For information on configuring NextAuth, you can refer to the [Authentication](/docs/self-hosting/advanced/authentication) documentation.
 <Callout type={'tip'}>
-In the official Docker image `lobe-chat-database`, we recommend using NextAuth as the authentication service.
+  In the official Docker image `lobe-chat-database`, we recommend using NextAuth as the
  authentication service.
 </Callout>
 ## Configuring S3 Storage Service
@@ -132,7 +145,9 @@ LobeChat has supported multimodal AI conversations since [a long time ago](https
 The best practice in this area is to use a file storage service (S3) to store image files, which is also the storage solution relied upon for subsequent file uploads/knowledge base functions.
 <Callout type={'info'}>
-In this documentation, S3 refers to a compatible S3 storage solution, which supports the Amazon S3 API-compatible object storage system. Common examples include Cloudflare R2, Alibaba Cloud OSS, and self-deployable Minio, all of which support the S3-compatible API.
+  In this documentation, S3 refers to a compatible S3 storage solution, which supports the Amazon S3
  API-compatible object storage system. Common examples include Cloudflare R2, Alibaba Cloud OSS,
  and self-deployable Minio, all of which support the S3-compatible API.
 </Callout>
 For detailed configuration guidelines on S3, please refer to [S3 Object Storage](/docs/self-hosting/advanced/s3) for more information.
@@ -9,6 +9,7 @@ tags:
  - Database Deployment
  - Postgres
 ---
 # Deploying Server Database Version Using Docker
 <div style={{display:"flex", gap: 4}}>
@@ -21,7 +22,11 @@ tags:
 </div>
 <Callout type="info">
-This article assumes that you are familiar with the basic principles and processes of deploying the LobeChat server database version, so it only includes content related to core environment variable configuration. If you are not familiar with the deployment principles of the LobeChat server database version, please refer to [Deploying Server Database](/docs/self-hosting/server-database) first.
+  This article assumes that you are familiar with the basic principles and processes of deploying
  the LobeChat server database version, so it only includes content related to core environment
  variable configuration. If you are not familiar with the deployment principles of the LobeChat
  server database version, please refer to [Deploying Server
  Database](/docs/self-hosting/server-database) first.
 </Callout>
 <Callout type="warning">
@@ -50,11 +55,14 @@ docker run --name my-postgres --network pg -e POSTGRES_PASSWORD=mysecretpassword
 The above command will create a PG instance named `my-postgres` on the network `pg`, where `pgvector/pgvector:pg16` is a Postgres 16 image with the pgvector plugin installed by default.
 <Callout type="info">
-The pgvector plugin provides vector search capabilities for Postgres, which is an important component for LobeChat to implement RAG.
+  The pgvector plugin provides vector search capabilities for Postgres, which is an important
  component for LobeChat to implement RAG.
 </Callout>
 <Callout type="warning">
-The above command does not specify a persistent storage location for the pg instance, so it is only for testing/demonstration purposes. Please configure persistent storage for production environments.
+  The above command does not specify a persistent storage location for the pg instance, so it is
  only for testing/demonstration purposes. Please configure persistent storage for production
  environments.
 </Callout>
 ### Create a file named `lobe-chat.env` to store environment variables:
@@ -119,7 +127,10 @@ If you see the following logs in the container, it means it has started successf
 </Steps>
 <Callout type="tip">
-In our official Docker image, the database schema migration is automatically executed before starting the image. We ensure stability from an empty database to all tables being formally available. Therefore, we recommend using an empty table instance for your database to avoid the cost of manually maintaining table structure migration.
+  In our official Docker image, the database schema migration is automatically executed before
  starting the image. We ensure stability from an empty database to all tables being formally
  available. Therefore, we recommend using an empty table instance for your database to avoid the
  cost of manually maintaining table structure migration.
 </Callout>
 ## Using Locally (Mac / Windows)
@@ -150,7 +161,9 @@ $ docker run -it -d --name lobe-chat-database -p 3210:3210 \
 ```
 <Callout type="tip">
-`Docker` uses a virtual machine solution on `Windows` and `macOS`. If you use `localhost` / `127.0.0.1`, it will refer to the container's `localhost`. In this case, try using `host.docker.internal` instead of `localhost`.
+  `Docker` uses a virtual machine solution on `Windows` and `macOS`. If you use `localhost` /
  `127.0.0.1`, it will refer to the container's `localhost`. In this case, try using
  `host.docker.internal` instead of `localhost`.
 </Callout>
 [docker-pulls-link]: https://hub.docker.com/r/lobehub/lobe-chat-database
@@ -20,15 +20,19 @@ tags:
 </div>
 <Callout type="info">
-  本文已经假定你了解了 LobeChat 服务端数据库版本（下简称 DB 版）的部署基本原理和流程，因此只包含核心环境变量配置的内容。如果你还不了解 LobeChat DB 版的部署原理，请先查阅 [使用服务端数据库部署](/zh/docs/self-hosting/server-database) 。
+  本文已经假定你了解了 LobeChat 服务端数据库版本（下简称 DB
-  此外，针对国内的腾讯云储存桶用户，可查询[配置腾讯云 COS 存储服务](/zh/docs/self-hosting/advanced/s3/tencent-cloud)。
+  版）的部署基本原理和流程，因此只包含核心环境变量配置的内容。如果你还不了解 LobeChat DB
  版的部署原理，请先查阅 [使用服务端数据库部署](/zh/docs/self-hosting/server-database) 。
  此外，针对国内的腾讯云储存桶用户，可查询[配置腾讯云 COS
  存储服务](/zh/docs/self-hosting/advanced/s3/tencent-cloud)。
 </Callout>
 <Callout type="warning">
  由于无法使用 Docker 环境变量暴露 `NEXT_PUBLIC_CLERK_PUBLISHABLE_KEY`，使用 Docker / Docker Compose
  部署 LobeChat 时，你不能使用 Clerk 作为登录鉴权服务。
-  如果你确实需要 Clerk 作为登录鉴权服务，你可以考虑使用 Vercel 部署或者自行构建镜像。
+如果你确实需要 Clerk 作为登录鉴权服务，你可以考虑使用 Vercel 部署或者自行构建镜像。
 </Callout>
 ## 在 Linux 服务器上部署
@@ -83,10 +87,10 @@ AUTH_AUTH0_ISSUER=https://lobe-chat-demo.us.auth0.com
 S3_ACCESS_KEY_ID=xxxxxxxxxx
 S3_SECRET_ACCESS_KEY=xxxxxxxxxx
 # 用于 S3 API 访问的域名
-S3_ENDPOINT=https://xxxxxxxxxx.r2.cloudflarestorage.com 
+S3_ENDPOINT=https://xxxxxxxxxx.r2.cloudflarestorage.com
 S3_BUCKET=lobechat
 # 用于外网访问 S3 的公共域名，需配置 CORS
-S3_PUBLIC_DOMAIN=https://s3-for-lobechat.your-domain.com 
+S3_PUBLIC_DOMAIN=https://s3-for-lobechat.your-domain.com
 # S3_REGION=ap-chengdu # 如果需要指定地域
 # 其他环境变量，视需求而定
@@ -163,7 +167,6 @@ $ docker run -it -d --name lobe-chat-database -p 3210:3210 \
  ，将会走到自身容器的 `localhost`，此时请尝试用 `host.docker.internal` 替代 `localhost`
 </Callout>
 [docker-pulls-link]: https://hub.docker.com/r/lobehub/lobe-chat-database
 [docker-pulls-shield]: https://img.shields.io/docker/pulls/lobehub/lobe-chat-database?color=45cc11&labelColor=black&style=flat-square
 [docker-release-link]: https://hub.docker.com/r/lobehub/lobe-chat-database
@@ -11,4 +11,3 @@ tags:
 # Deploy LobeChat with Database on Netlify
 TODO
@@ -11,4 +11,3 @@ tags:
 # Deploy LobeChat with Database on Railway
 TODO
@@ -1,6 +1,8 @@
 ---
 title: Deploy LobeChat with Database on RepoCloud
-description: Learn how to deploy LobeChat on RepoCloud with ease, including: database, authentication and S3 storage service.
+description: >-
  Learn how to deploy LobeChat on RepoCloud with ease, including database,
  authentication and S3 storage service.
 tags:
  - Deploy LobeChat
  - RepoCloud Deployment
@@ -15,7 +17,8 @@ If you want to deploy LobeChat Database Edition on RepoCloud, you can follow the
 ## RepoCloud Deployment Process
 <Steps>
-  ### Prepare your OpenAI API Key
+
 ### Prepare your OpenAI API Key
 Go to [OpenAI API Key](https://platform.openai.com/account/api-keys) to get your OpenAI API Key.
@@ -1,6 +1,6 @@
 ---
 title: 在 RepoCloud 上部署 LobeChat 数据库版
-description: 学习如何在RepoCloud上部署LobeChat应用，包括准备OpenAI API Key、点击部署按钮、绑定自定义域名等操作。
+description: 学习如何在 RepoCloud 上部署 LobeChat 应用，包括准备 OpenAI API Key、点击部署按钮、绑定自定义域名等操作。
 tags:
  - RepoCloud
  - LobeChat
@@ -9,6 +9,26 @@ tags:
  - 自定义域名
 ---
-# 使用 RepoCloud 部署 LobeChat 数据库版
+# 在 RepoCloud 上部署 LobeChat 数据库版
-TODO
+如果您想在RepoCloud上部署LobeChat数据库版，可以按照以下步骤进行操作：
 ## RepoCloud部署流程
 <Steps>
 ### 准备您的 OpenAI API 密钥
 请访问 [OpenAI API密钥](https://platform.openai.com/account/api-keys) 获取您的OpenAI API密钥。
 ### 一键部署
 [![部署到RepoCloud](https://d16t0pc4846x52.cloudfront.net/deploy.svg)](https://repocloud.io/details/?app_id=248)
 ### 部署完成后，您可以开始使用
 ### 绑定自定义域名（可选）
 您可以使用RepoCloud提供的子域名，或选择绑定自定义域名。目前，RepoCloud提供的域名尚未被污染，大多数地区可以直接连接。
 </Steps>
@@ -10,3 +10,6 @@ tags:
  - Custom Domain Binding
 ---
 # Deploy LobeChat on SealOS
 TODO
@@ -15,6 +15,7 @@ tags:
 This article will detail how to deploy the server database version of LobeChat on Vercel, including: 1) database configuration; 2) identity authentication service configuration; 3) steps for setting up the S3 storage service.
 <Callout type={'warning'}>
 Before proceeding, please make sure of the following:
 - Export all data, as after deploying the server-side database, existing user data cannot be automatically migrated and can only be manually imported after backup!
@@ -42,7 +43,7 @@ In Vercel's deployment environment variables, add `DATABASE_URL` and other envir
 <Tabs items={['Serverless Postgres', 'Node Postgres']}>
-<Tab>
+  <Tab>
 <Callout type={'warning'}>
  Please confirm the `Postgres` type provided by your vendor. If it is `Node Postgres`, switch to
@@ -68,8 +69,8 @@ An example of filling in Vercel is as follows:
 </Tab>
-<Tab>
+  <Tab>
-  Variables to be filled for Node Postgres are as follows:
+    Variables to be filled for Node Postgres are as follows:
 ```shell
 # Node Postgres DB Url
@@ -93,10 +94,12 @@ An example of filling in Vercel is as follows:
 </Tabs>
-<Callout type={'info'}>
+  <Callout type={'info'}>
-  If you wish to enable SSL when connecting to the database, please refer to the
+
-  [link](https://stackoverflow.com/questions/14021998/using-psql-to-connect-to-postgresql-in-ssl-mode)
+    If you wish to enable SSL when connecting to the database, please refer to the
-  for setup instructions.
+    [link](https://stackoverflow.com/questions/14021998/using-psql-to-connect-to-postgresql-in-ssl-mode)
    for setup instructions.
 </Callout>
 ### Add the `KEY_VAULTS_SECRET` Environment Variable
@@ -125,9 +128,11 @@ The server-side database needs to be paired with a user authentication service t
 Go to [Clerk](https://clerk.com?utm_source=lobehub&utm_medium=docs) to register and create an application to obtain the corresponding Public Key and Secret Key.
-<Callout type={'info'}>
+  <Callout type={'info'}>
-  If you are not familiar with Clerk, you can refer to [Authentication
+
-  Service-Clerk](/en/docs/self-hosting/advanced/authentication#clerk) for details on using Clerk.
+    If you are not familiar with Clerk, you can refer to [Authentication
    Service-Clerk](/en/docs/self-hosting/advanced/authentication#clerk) for details on using Clerk.
 </Callout>
 ### Add Public and Private Key Environment Variables in Vercel
@@ -166,29 +171,25 @@ We need to add an endpoint in Clerk's Webhooks to inform Clerk to send notificat
 Fill in the endpoint with the URL of your Vercel project, such as `https://your-project.vercel.app/api/webhooks/clerk`. Then, subscribe to events by checking the three user events (`user.created`, `user.deleted`, `user.updated`), and click create.
-<Callout type={'warning'}>
+  <Callout type={'warning'}>
-  The `https://` in the URL is essential to maintain the integrity of the URL.
+
    The `https://` in the URL is essential to maintain the integrity of the URL.
 </Callout>
 <Image
-alt={'Configure URL and user events when adding Clerk Webhooks'}
+  alt={'Configure URL and user events when adding Clerk Webhooks'}
-src={'https://github.com/lobehub/lobe-chat/assets/28616219/0249ea56-ab17-4aa9-a56c-9ebd556c2645'}>
+  src={'https://github.com/lobehub/lobe-chat/assets/28616219/0249ea56-ab17-4aa9-a56c-9ebd556c2645'}
-
+/>
 >
 </Image>
 ### Add Webhook Secret to Vercel Environment Variables
 After creation, you can find the secret of this Webhook in the bottom right corner:
 <Image
-alt={'View Clerk Webhooks secret'}
+  alt={'View Clerk Webhooks secret'}
-src={'https://github.com/lobehub/lobe-chat/assets/28616219/fab4abb2-584b-49de-9340-813382951635'}>
+  src={'https://github.com/lobehub/lobe-chat/assets/28616219/fab4abb2-584b-49de-9340-813382951635'}
-
+/>
 >
 </Image>
 The environment variable corresponding to this secret is `CLERK_WEBHOOK_SECRET`:
@@ -212,9 +213,9 @@ By completing these steps, you have successfully configured the Clerk authentica
 In the server-side database, we need to configure the S3 storage service to store files.
 <Callout type={'info'}>
-  In this article, S3 refers to a compatible S3 storage solution, which supports object storage
+
-  systems that comply with the Amazon S3 API. Common examples include Cloudflare R2, Alibaba Cloud
+In this article, S3 refers to a compatible S3 storage solution, which supports object storage systems that comply with the Amazon S3 API. Common examples include Cloudflare R2, Alibaba Cloud OSS, etc., all of which support S3-compatible APIs.
-  OSS, etc., all of which support S3-compatible APIs.
+
 </Callout>
 <Steps>
@@ -338,7 +339,7 @@ In R2, you can find the CORS configuration in the bucket settings:
 <Image
  alt={'Cloudflare R2 CORS settings'}
  src={'https://github.com/lobehub/lobe-chat/assets/28616219/ab008be7-26b2-4b78-8bd9-24301bf34d23'}
-></Image>
+/>
 Add a CORS rule to allow requests from your domain (in this case, `https://your-project.vercel.app`):
@@ -382,12 +383,14 @@ After configuring the environment variables, you need to redeploy the latest com
 If you click on the login button in the top left corner and the login popup appears normally, then you have successfully configured it. Enjoy using it\~
 <Image
-alt={'User login popup'}
+  alt={'User login popup'}
-src={'https://github.com/lobehub/lobe-chat/assets/28616219/da84edc3-46f7-4e2b-a0cd-dc33a98bf5cb'}/>
+  src={'https://github.com/lobehub/lobe-chat/assets/28616219/da84edc3-46f7-4e2b-a0cd-dc33a98bf5cb'}
 />
 <Image
-alt={'Login successful state'}
+  alt={'Login successful state'}
-src={'https://github.com/lobehub/lobe-chat/assets/28616219/9cb5150d-6e1e-4c59-9a18-4e418dce1a5d'}/>
+  src={'https://github.com/lobehub/lobe-chat/assets/28616219/9cb5150d-6e1e-4c59-9a18-4e418dce1a5d'}
 />
 </Steps>
@@ -17,10 +17,10 @@ tags:
 本文将详细介绍如何在 Vercel 中部署服务端数据库版 LobeChat，包括： 1）数据库配置；2）身份验证服务配置；3） S3 存储服务的设置步骤。
 <Callout type={'warning'}>
-进行后续操作前，请务必确认以下事项：
+  进行后续操作前，请务必确认以下事项： -
-  - 导出所有数据，部署服务端数据库后，原有用户数据无法自动迁移，只能提前备份后进行手动导入！
+  导出所有数据，部署服务端数据库后，原有用户数据无法自动迁移，只能提前备份后进行手动导入！ -
-  - 环境变量中的`ACCESS_CODE`未设置或已清除！
+  环境变量中的`ACCESS_CODE`未设置或已清除！ -
-  - 配置服务端数据库所需要的环境变量时，需全部填入后再进行部署，否则可能遭遇数据库迁移问题！
+  配置服务端数据库所需要的环境变量时，需全部填入后再进行部署，否则可能遭遇数据库迁移问题！
 </Callout>
 ## 一、 配置数据库
@@ -61,7 +61,7 @@ tags:
      在 Vercel 中填写的示例如下：
-      <Image alt={'添加 Serverless Postgres DATABASE_URL'} src={'https://github.com/lobehub/lobe-chat/assets/28616219/d4a710cd-6404-4196-90d0-cd08ca385074'}></Image>
+      <Image alt={'添加 Serverless Postgres DATABASE_URL'} src={'https://github.com/lobehub/lobe-chat/assets/28616219/d4a710cd-6404-4196-90d0-cd08ca385074'}/>
 </Tab>
@@ -81,7 +81,7 @@ tags:
      在 Vercel 中填写的示例如下：
-      <Image alt={'添加 Node Postgres DATABASE_URL'} src={'https://github.com/lobehub/lobe-chat/assets/28616219/1c689738-809b-4199-b305-ba5770d39da7'}></Image>
+      <Image alt={'添加 Node Postgres DATABASE_URL'} src={'https://github.com/lobehub/lobe-chat/assets/28616219/1c689738-809b-4199-b305-ba5770d39da7'}/>
 </Tab>
@@ -130,7 +130,7 @@ KEY_VAULTS_SECRET=jgwsK28dspyVQoIf8/M3IIHl1h6LYYceSYNXeLpy6uk=
 <Image
  alt={'在 Clerk 中找到对应的公私钥环境变量'}
  src={'https://github.com/lobehub/lobe-chat/assets/28616219/89883703-7a1a-4a11-b944-5d804544e57c'}
-></Image>
+/>
 此步骤所需的环境变量如下：
@@ -144,7 +144,7 @@ CLERK_SECRET_KEY=sk_live_xxxxxxxxxxxxxxxxxxxxxx
 <Image
  alt={'在 Vercel 中添加 Clerk 公私钥环境变量'}
  src={'https://github.com/lobehub/lobe-chat/assets/28616219/2bfa13df-6e20-4768-97c0-4dad06c85a2f'}
-></Image>
+/>
 ### 在 Clerk 中创建并配置 Webhook
@@ -155,7 +155,7 @@ CLERK_SECRET_KEY=sk_live_xxxxxxxxxxxxxxxxxxxxxx
 <Image
  alt={'Clerk 添加 Webhooks 端点'}
  src={'https://github.com/lobehub/lobe-chat/assets/28616219/f50f47fb-5e8e-4930-bf4e-8cf6f5b8afb9'}
-></Image>
+/>
 在 endppint 中填写你的 Vercel 项目的 URL，如 `https://your-project.vercel.app/api/webhooks/clerk`。然后在订阅事件（Subscribe to events）中，勾选 user 的三个事件（`user.created` 、`user.deleted`、`user.updated`），然后点击创建。
@@ -164,7 +164,7 @@ CLERK_SECRET_KEY=sk_live_xxxxxxxxxxxxxxxxxxxxxx
 <Image
  alt={'添加 Clerk Webhooks 时，配置 URL 和用户事件'}
  src={'https://github.com/lobehub/lobe-chat/assets/28616219/0249ea56-ab17-4aa9-a56c-9ebd556c2645'}
-></Image>
+/>
 ### 将 Webhook 秘钥添加到 Vercel 环境变量
@@ -173,7 +173,7 @@ CLERK_SECRET_KEY=sk_live_xxxxxxxxxxxxxxxxxxxxxx
 <Image
  alt={'查看 Clerk Webhooks 秘钥'}
  src={'https://github.com/lobehub/lobe-chat/assets/28616219/fab4abb2-584b-49de-9340-813382951635'}
-></Image>
+/>
 这个秘钥所对应的环境变量名为 `CLERK_WEBHOOK_SECRET`：
@@ -186,7 +186,7 @@ CLERK_WEBHOOK_SECRET=whsec_xxxxxxxxxxxxxxxxxxxxxx
 <Image
  alt={'在 Vercel 中 添加 Clerk Webhooks 秘钥'}
  src={'https://github.com/lobehub/lobe-chat/assets/28616219/5fdc9479-007f-46ab-9d6e-a9603e949116'}
-></Image>
+/>
 </Steps>
@@ -212,13 +212,13 @@ CLERK_WEBHOOK_SECRET=whsec_xxxxxxxxxxxxxxxxxxxxxx
    <Image
      alt={'Cloudflare R2 存储界面'}
      src={'https://github.com/lobehub/lobe-chat/assets/28616219/41f7f677-0153-4a96-b849-5ac9b7ebefee'}
-    ></Image>
+    />
    创建存储桶时将指定其名称，然后点击创建。
    <Image
      alt={'R2 创建存储桶'}
      src={'https://github.com/lobehub/lobe-chat/assets/28616219/9c0d184c-3169-40fa-9115-011cfffb9ca7'}
-    ></Image>
+    />
    ### 获取存储桶相关环境变量
@@ -227,7 +227,7 @@ CLERK_WEBHOOK_SECRET=whsec_xxxxxxxxxxxxxxxxxxxxxx
    <Image
      alt={'查看存储桶的相关信息'}
      src={'https://github.com/lobehub/lobe-chat/assets/28616219/2ceb210c-eca0-4439-ba27-8734d4ebb3ee'}
-    ></Image>
+    />
 其对应的环境变量为：
@@ -249,28 +249,28 @@ S3_PUBLIC_DOMAIN=https://s3-for-lobechat.your-domain.com
    <Image
      alt={'查看存储桶的访问秘钥'}
      src={'https://github.com/lobehub/lobe-chat/assets/28616219/be0c95c0-6693-44ee-a490-7e8dfaa8b34d'}
-    ></Image>
+    />
    点击右上角按钮创建 API token，进入创建 API Token 页面
    <Image
      alt={'创建对应 API token'}
      src={'https://github.com/lobehub/lobe-chat/assets/28616219/7b0ea46c-5157-40a8-888f-f47664a4884f'}
-    ></Image>
+    />
    鉴于我们的服务端数据库需要读写 S3 存储服务，因此权限需要选择`对象读与写`，然后点击创建。
    <Image
      alt={'配置 API token 权限'}
      src={'https://github.com/lobehub/lobe-chat/assets/28616219/d6f5a918-7b50-4d6e-83a6-3894ab930ddf'}
-    ></Image>
+    />
    创建完成后，就可以看到对应的 S3 API token
    <Image
      alt={'复制 API token'}
      src={'https://github.com/lobehub/lobe-chat/assets/28616219/763b18f9-2b5f-44bb-a479-9b56d46f7397'}
-    ></Image>
+    />
    其对应的环境变量为：
@@ -306,7 +306,7 @@ S3_PUBLIC_DOMAIN=https://s3-dev.your-domain.com
    <Image
      alt={'在  Vercel 中添加 S3 的环境变量'}
      src={'https://github.com/lobehub/lobe-chat/assets/28616219/cd74152d-0ae8-44fd-b815-3307c56a3c18'}
-    ></Image>
+    />
    ### 配置跨域
@@ -317,14 +317,14 @@ S3_PUBLIC_DOMAIN=https://s3-dev.your-domain.com
    <Image
      alt={'Cloudflare R2 的跨域设置'}
      src={'https://github.com/lobehub/lobe-chat/assets/28616219/ab008be7-26b2-4b78-8bd9-24301bf34d23'}
-    ></Image>
+    />
    添加跨域规则，允许你的域名（在上文是 `https://your-project.vercel.app`）来源的请求：
    <Image
      alt={'配置允许你的站点域名'}
      src={'https://github.com/lobehub/lobe-chat/assets/28616219/dfcc2cb3-2958-4498-a8a4-51bec584fe7d'}
-    ></Image>
+    />
 示例配置如下：
@@ -354,7 +354,7 @@ S3_PUBLIC_DOMAIN=https://s3-dev.your-domain.com
 <Image
  alt={'重新部署最新的 commit'}
  src={'https://github.com/lobehub/lobe-chat/assets/28616219/b3a78112-adc8-4837-b4e3-48f67058f16e'}
-></Image>
+/>
 ### 检查功能是否正常
@@ -363,12 +363,12 @@ S3_PUBLIC_DOMAIN=https://s3-dev.your-domain.com
 <Image
  alt={'用户登录弹窗'}
  src={'https://github.com/lobehub/lobe-chat/assets/28616219/da84edc3-46f7-4e2b-a0cd-dc33a98bf5cb'}
-></Image>
+/>
 <Image
  alt={'登录成功状态'}
  src={'https://github.com/lobehub/lobe-chat/assets/28616219/9cb5150d-6e1e-4c59-9a18-4e418dce1a5d'}
-></Image>
+/>
 </Steps>
@@ -21,6 +21,7 @@ tags:
 </Callout>
 The template on Zeabur includes 4 services:
 - Logto for authrization.
 - PostgreSQL with Vector plugin for data storage and indexing.
 - MinIO for image storage.
@@ -62,8 +63,7 @@ You will see another modal pop-up where you can see the deployment progress.
 After the deployment is done, you need to configure your Logto service to enable authrization.
-Access your Logto console with the console domain you just binded, and then create a `Next.js 14(App router)` application to get the client ID and client secret, and fill in the cors and callback URLs.
+Access your Logto console with the console domain you just binded, and then create a `Next.js 14(App router)` application to get the client ID and client secret, and fill in the cors and callback URLs. You can check [this document](../advanced/auth.mdx) for a more detailed guide.
 You can check [this document](../advanced/auth.mdx) for a more detailed guide.
 Fill in those variables into your LobeChat service on Zeabur, here is a more detailed guide for [editing environment variables on Zeabur](https://zeabur.com/docs/deploy/variables).
@@ -18,6 +18,7 @@ tags:
 </Callout>
 在 Zeabur 的模板中总共包含有以下四个服务：
 - Logto 提供身份校验
 - 带有 Vector 插件的 PostgreSQL 来做数据存储和向量化
 - MinIO 作为对象存储
@@ -53,11 +54,9 @@ tags:
 ### 配置 Logto
-当部署完成后，你会被自动导航到你在 Zeabur 控制台上刚刚创建的项目。
+当部署完成后，你会被自动导航到你在 Zeabur 控制台上刚刚创建的项目。你需要再进一步配置你的 Logto 服务。
 你需要再进一步配置你的 Logto 服务。
-使用你刚绑定的域名来访问你的 Logto 控制台，创建一个新项目以获得对应的客户端 ID 与密钥，将它们填入你的 LobeChat 服务的变量中。
+使用你刚绑定的域名来访问你的 Logto 控制台，创建一个新项目以获得对应的客户端 ID 与密钥，将它们填入你的 LobeChat 服务的变量中。关于如何填入变量，可以参照 [Zeabur 的官方文档](https://zeabur.com/docs/deploy/variables)。
 关于如何填入变量，可以参照 [Zeabur 的官方文档](https://zeabur.com/docs/deploy/variables)。
 Logto 的详细配置可以参考[这篇文档](/zh/docs/self-hosting/advanced/auth/next-auth/logto)。
@@ -11,6 +11,7 @@ tags:
  - Docker Compose
  - Alibaba Cloud
 ---
 # Build Your Own Lobe Chat
 LobeChat supports various deployment platforms, including Vercel, Docker, and Docker Compose. You can choose a deployment platform that suits you to build your own Lobe Chat.
@@ -24,7 +25,9 @@ You can follow the guide below for quick deployment of LobeChat:
 <PlatformCards urlPrefix={'platform'} />
 <Callout>
-  In the client-side database mode, data is stored locally on the user's device, without cross-device synchronization, and does not support advanced features such as file uploads and knowledge base.
+  In the client-side database mode, data is stored locally on the user's device, without
  cross-device synchronization, and does not support advanced features such as file uploads and
  knowledge base.
 </Callout>
 ## Advanced Mode: Server-Side Database
@@ -32,5 +35,8 @@ You can follow the guide below for quick deployment of LobeChat:
 For users who are already familiar with LobeChat or need cross-device synchronization, you can deploy a version with a server-side database to access a more complete and powerful LobeChat.
 <Cards>
-<Card href={'/docs/self-hosting/server-database'} title={'Server-Side Database Deployment Guide'} />
+  <Card
    href={'/docs/self-hosting/server-database'}
    title={'Server-Side Database Deployment Guide'}
  />
 </Cards>
@@ -51,4 +51,4 @@ tags:
 服务端数据库方案则适合那些希望简化数据管理流程，享受便捷使用体验的用户。通过服务端数据库与用户身份验证，LobeChat 能够确保数据的安全性与高效性。如果您希望了解如何配置服务端数据库，请参考我们的[详细文档](/zh/docs/self-hosting/advanced/server-database)。
-无论选择本地数据库还是服务端数据库，LobeChat 都能为你提供卓越的用户体验。
+无论选择本地数据库还是服务端数据库，LobeChat 都能为你提供卓越的用户体验。
@@ -37,8 +37,7 @@ LobeChat also offers the Midjourney plugin, which generates images by calling th
 />
 <Callout type={'info'}>
-  info For plugin installation, please refer to [Plugin
+  info For plugin installation, please refer to [Plugin Usage](/docs/usage/plugins/basic-usage)
  Usage](/docs/usage/plugins/basic-usage)
 </Callout>
 When using the Midjourney plugin for the first time, you will need to fill in your Midjourney API key in the plugin settings.
@@ -34,9 +34,7 @@ LobeChat 还提供 Midjourney 插件，通过 API 调用 Midjourney 生成图片
  src={'https://github.com/user-attachments/assets/5f526846-02cd-4dbc-b6e3-a603fa5ac8e7'}
 />
-<Callout type={'info'}>
+<Callout type={'info'}>插件安装请参考[插件使用](/zh/docs/usage/plugins/basic-usage)</Callout>
  插件安装请参考[插件使用](/zh/docs/usage/plugins/basic-usage)
 </Callout>
 首次使用 Midjourney 插件时，您需要在插件设置中填写您的 Midjourney API 密钥。
@@ -9,13 +9,12 @@ tags:
  - API Key
  - Web UI
 ---
 # Using AI21 Labs in LobeChat
 <Image
-cover
+  cover
-src={
+  src={'https://github.com/user-attachments/assets/ae03eab5-a319-4d2a-a5f6-1683ab7739ee'}
 'https://github.com/user-attachments/assets/ae03eab5-a319-4d2a-a5f6-1683ab7739ee'
 }
 />
 [AI21 Labs](https://www.ai21.com/) is a company focused on artificial intelligence, offering advanced language models and API services designed to help developers and businesses leverage natural language processing technology. Their flagship product, the "Jamba" series of models, can perform complex language understanding and generation tasks, widely utilized in fields such as content creation and conversational systems.
@@ -30,9 +29,9 @@ This article will guide you on how to use AI21 Labs within LobeChat.
 - Copy and save the generated API key
 <Image
-alt={'Copy API Key'}
+  alt={'Copy API Key'}
-inStep
+  inStep
-src={'https://github.com/user-attachments/assets/a42ba52b-491e-4993-8e2f-217aa1776e0f'}
+  src={'https://github.com/user-attachments/assets/a42ba52b-491e-4993-8e2f-217aa1776e0f'}
 />
 ### Step 2: Configure AI21 Labs in LobeChat
@@ -41,25 +40,25 @@ src={'https://github.com/user-attachments/assets/a42ba52b-491e-4993-8e2f-217aa17
 - Under `Language Model`, find the setting for `AI21 Labs`
 <Image
-alt={'Enter API Key'}
+  alt={'Enter API Key'}
-inStep
+  inStep
-src={'https://github.com/user-attachments/assets/9336d6c5-2a83-4aa9-854e-75e245b665cb'}
+  src={'https://github.com/user-attachments/assets/9336d6c5-2a83-4aa9-854e-75e245b665cb'}
 />
 - Enter the API key you obtained
 - Choose an AI21 Labs model for your AI assistant to begin the conversation
 <Image
-alt={'Select AI21 Labs Model and Start Conversation'}
+  alt={'Select AI21 Labs Model and Start Conversation'}
-inStep
+  inStep
-src={'https://github.com/user-attachments/assets/63e5ced7-1d23-44e1-b933-cc3b5df47eab'}
+  src={'https://github.com/user-attachments/assets/63e5ced7-1d23-44e1-b933-cc3b5df47eab'}
 />
 <Callout type={'warning'}>
-During use, you may need to pay the API service provider; please refer to the relevant fee policy of AI21 Labs.
+  During use, you may need to pay the API service provider; please refer to the relevant fee policy
  of AI21 Labs.
 </Callout>
 </Steps>
 Now you are ready to engage in conversations using the models provided by AI21 Labs in LobeChat.
@@ -12,9 +12,7 @@ tags:
 <Image
  cover
-  src={
+  src={'https://github.com/user-attachments/assets/ae03eab5-a319-4d2a-a5f6-1683ab7739ee'}
    'https://github.com/user-attachments/assets/ae03eab5-a319-4d2a-a5f6-1683ab7739ee'
  }
 />
 [AI21 Labs](https://www.ai21.com/) 是一家专注于人工智能的公司，提供先进的语言模型和API服务，旨在帮助开发者和企业利用自然语言处理技术。其旗舰产品 "Jamba" 系列模型能够进行复杂的语言理解和生成任务，广泛应用于内容创作、对话系统等领域。
@@ -7,13 +7,12 @@ tags:
  - API Key
  - Web UI
 ---
 # Using the 360AI in LobeChat
 <Image
-cover
+  cover
-src={
+  src={'https://github.com/user-attachments/assets/e617def1-ce50-4acc-974b-12f5ed592a0e'}
 'https://github.com/user-attachments/assets/e617def1-ce50-4acc-974b-12f5ed592a0e'
 }
 />
 The [360AI](https://ai.360.com/) is a cognitive general model independently developed by 360 Company, aimed at providing powerful natural language processing capabilities for enterprises and developers. This model has been upgraded to version 4.0 and supports various application scenarios, including conversational services, image generation, vector database services, and more.
@@ -28,9 +27,9 @@ This article will guide you on how to use the 360AI in LobeChat.
 - Create an API key and copy it
 <Image
-alt={'Create API Key'}
+  alt={'Create API Key'}
-inStep
+  inStep
-src={'https://github.com/user-attachments/assets/72da7af1-e180-4759-84a5-a6f6ca28392e'}
+  src={'https://github.com/user-attachments/assets/72da7af1-e180-4759-84a5-a6f6ca28392e'}
 />
 ### Step 2: Configure 360AI in LobeChat
@@ -39,25 +38,25 @@ src={'https://github.com/user-attachments/assets/72da7af1-e180-4759-84a5-a6f6ca2
 - Under `Language Models`, find the option for `360`
 <Image
-alt={'Enter API Key'}
+  alt={'Enter API Key'}
-inStep
+  inStep
-src={'https://github.com/user-attachments/assets/a53deb11-2c14-441a-8a5c-a0f3a74e2a63'}
+  src={'https://github.com/user-attachments/assets/a53deb11-2c14-441a-8a5c-a0f3a74e2a63'}
 />
 - Enter the API key you obtained
 - Choose a 360AI model for your AI assistant to start chatting
 <Image
-alt={'Select 360 Model and Start Chatting'}
+  alt={'Select 360 Model and Start Chatting'}
-inStep
+  inStep
-src={'https://github.com/user-attachments/assets/452d0b48-5ff7-4f42-a46e-68a62b87632b'}
+  src={'https://github.com/user-attachments/assets/452d0b48-5ff7-4f42-a46e-68a62b87632b'}
 />
 <Callout type={'warning'}>
-Please note that you may need to pay the API service provider during use, refer to the relevant pricing policy of the 360AI.
+  Please note that you may need to pay the API service provider during use, refer to the relevant
  pricing policy of the 360AI.
 </Callout>
 </Steps>
 You can now use the models provided by the 360AI for conversations in LobeChat.
@@ -12,9 +12,7 @@ tags:
 <Image
  cover
-  src={
+  src={'https://github.com/user-attachments/assets/e617def1-ce50-4acc-974b-12f5ed592a0e'}
    'https://github.com/user-attachments/assets/e617def1-ce50-4acc-974b-12f5ed592a0e'
  }
 />
 [360智脑](https://ai.360.com/)是360公司自主研发的认知型通用大模型，旨在为企业和开发者提供强大的自然语言处理能力。该模型已升级至4.0版本，能够支持多种应用场景，包括对话服务、图片生成、向量数据库服务等。
@@ -48,7 +48,7 @@ This document will guide you on how to use Cloudflare Workers AI in LobeChat:
 <Callout type={"warning"}>
 - Please store your API token securely, as it will only be displayed once. If you accidentally lose it, you will need to create a new token.
- 
+
 </Callout>
 ### Step 2: Configure Cloudflare Workers AI in LobeChat
@@ -9,13 +9,12 @@ tags:
  - API Key
  - Web UI
 ---
 # Using Fireworks AI in LobeChat
 <Image
-cover
+  cover
-src={
+  src={'https://github.com/user-attachments/assets/facdc83c-e789-4649-8060-7f7a10a1b1dd'}
 'https://github.com/user-attachments/assets/facdc83c-e789-4649-8060-7f7a10a1b1dd'
 }
 />
 [Fireworks.ai](https://fireworks.ai/) is a high-performance generative AI model inference platform that allows users to access and utilize various models through its API. The platform supports multiple modalities, including text and visual language models, and offers features like function calls and JSON schemas to enhance the flexibility of application development.
@@ -30,21 +29,22 @@ This article will guide you on how to use Fireworks AI in LobeChat.
 - Create a new API key
 <Image
-alt={'Create API Key'}
+  alt={'Create API Key'}
-inStep
+  inStep
-src={'https://github.com/user-attachments/assets/eb027093-5ceb-4a9d-8850-b791fbf69a71'}
+  src={'https://github.com/user-attachments/assets/eb027093-5ceb-4a9d-8850-b791fbf69a71'}
 />
 - Copy and securely save the generated API key
 <Image
-alt={'Save API Key'}
+  alt={'Save API Key'}
-inStep
+  inStep
-src={'https://github.com/user-attachments/assets/28590f7f-bfee-4215-b50b-8feddbf72366'}
+  src={'https://github.com/user-attachments/assets/28590f7f-bfee-4215-b50b-8feddbf72366'}
 />
 <Callout type={'warning'}>
-Please store the key securely, as it will appear only once. If you accidentally lose it, you will need to create a new key.
+  Please store the key securely, as it will appear only once. If you accidentally lose it, you will
  need to create a new key.
 </Callout>
 ### Step 2: Configure Fireworks AI in LobeChat
@@ -53,25 +53,25 @@ Please store the key securely, as it will appear only once. If you accidentally
 - Under `Language Model`, locate the settings for `Fireworks AI`
 <Image
-alt={'Enter API Key'}
+  alt={'Enter API Key'}
-inStep
+  inStep
-src={'https://github.com/user-attachments/assets/12c1957d-f050-4235-95da-d55ddedfa6c9'}
+  src={'https://github.com/user-attachments/assets/12c1957d-f050-4235-95da-d55ddedfa6c9'}
 />
 - Enter the obtained API key
 - Select a Fireworks AI model for your AI assistant to start a conversation
 <Image
-alt={'Select Fireworks AI Model and Start Conversation'}
+  alt={'Select Fireworks AI Model and Start Conversation'}
-inStep
+  inStep
-src={'https://github.com/user-attachments/assets/378df8df-8ec4-436e-8451-fbc52705faee'}
+  src={'https://github.com/user-attachments/assets/378df8df-8ec4-436e-8451-fbc52705faee'}
 />
 <Callout type={'warning'}>
-Please note that you may need to pay fees to the API service provider during use; refer to Fireworks AI's pricing policy for details.
+  Please note that you may need to pay fees to the API service provider during use; refer to
  Fireworks AI's pricing policy for details.
 </Callout>
 </Steps>
 You are now ready to use the models provided by Fireworks AI for conversations in LobeChat.
@@ -12,9 +12,7 @@ tags:
 <Image
  cover
-  src={
+  src={'https://github.com/user-attachments/assets/facdc83c-e789-4649-8060-7f7a10a1b1dd'}
    'https://github.com/user-attachments/assets/facdc83c-e789-4649-8060-7f7a10a1b1dd'
  }
 />
 [Fireworks.ai](https://fireworks.ai/) 是一个高性能的生成式 AI 模型推理平台，允许用户通过其 API 访问和使用各种模型。该平台支持多种模态，包括文本和视觉语言模型，并提供函数调用和 JSON 模式等功能，以增强应用开发的灵活性。
@@ -8,13 +8,12 @@ tags:
  - API Key
  - Web UI
 ---
 # Using GitHub Models in LobeChat
 <Image
-cover
+  cover
-src={
+  src={'https://github.com/user-attachments/assets/3050839a-cb16-485d-8bae-1bc2f9ade632'}
 'https://github.com/user-attachments/assets/3050839a-cb16-485d-8bae-1bc2f9ade632'
 }
 />
 [GitHub Models](https://github.com/marketplace/models) is a new feature recently launched by GitHub, designed to provide developers with a free platform to access and experiment with various AI models. GitHub Models offers an interactive sandbox environment where users can test different model parameters and prompts, and observe the responses of the models. The platform supports advanced language models, including OpenAI's GPT-4o, Meta's Llama 3.1, and Mistral's Large 2, covering a wide range of applications from large-scale language models to task-specific models.
@@ -26,13 +25,15 @@ This article will guide you on how to use GitHub Models in LobeChat.
 Currently, the usage of the Playground and free API is subject to limits on the number of requests per minute, the number of requests per day, the number of tokens per request, and the number of concurrent requests. If you hit the rate limit, you will need to wait for the limit to reset before making further requests. The rate limits vary for different models (low, high, and embedding models). For model type information, please refer to the GitHub Marketplace.
 <Image
-alt={'GitHub Models Rate Limits'}
+  alt={'GitHub Models Rate Limits'}
-inStep
+  inStep
-src={'https://github.com/user-attachments/assets/21c52e2a-b2f8-4de8-a5d4-cf3444608db7'}
+  src={'https://github.com/user-attachments/assets/21c52e2a-b2f8-4de8-a5d4-cf3444608db7'}
 />
 <Callout type="note">
-  These limits are subject to change at any time. For specific information, please refer to the [GitHub Official Documentation](https://docs.github.com/en/github-models/prototyping-with-ai-models#rate-limits).
+  These limits are subject to change at any time. For specific information, please refer to the
  [GitHub Official
  Documentation](https://docs.github.com/en/github-models/prototyping-with-ai-models#rate-limits).
 </Callout>
 ---
@@ -46,17 +47,17 @@ src={'https://github.com/user-attachments/assets/21c52e2a-b2f8-4de8-a5d4-cf34446
 - Create and configure a new access token.
 <Image
-alt={'Creating Access Token'}
+  alt={'Creating Access Token'}
-inStep
+  inStep
-src={'https://github.com/user-attachments/assets/8570db14-dac6-4279-ab71-04a072c15490'}
+  src={'https://github.com/user-attachments/assets/8570db14-dac6-4279-ab71-04a072c15490'}
 />
 - Copy and save the generated token from the results returned.
 <Image
-alt={'Saving Access Token'}
+  alt={'Saving Access Token'}
-inStep
+  inStep
-src={'https://github.com/user-attachments/assets/3c1a492d-a3d4-4570-9e74-785c2942ca41'}
+  src={'https://github.com/user-attachments/assets/3c1a492d-a3d4-4570-9e74-785c2942ca41'}
 />
 <Callout type={"warning"}>
@@ -64,6 +65,7 @@ src={'https://github.com/user-attachments/assets/3c1a492d-a3d4-4570-9e74-785c294
 - During the testing phase of GitHub Models, users must apply to join the [waitlist](https://github.com/marketplace/models/waitlist/join) in order to gain access.
 - Please store the access token securely, as it will only be displayed once. If you accidentally lose it, you will need to create a new token.
 </Callout>
 ### Step 2: Configure GitHub Models in LobeChat
@@ -72,21 +74,20 @@ src={'https://github.com/user-attachments/assets/3c1a492d-a3d4-4570-9e74-785c294
 - Under `Language Models`, find the GitHub settings.
 <Image
-alt={'Entering Access Token'}
+  alt={'Entering Access Token'}
-inStep
+  inStep
-src={'https://github.com/user-attachments/assets/a00f06cc-da7c-41e8-a4d5-d4b675a22673'}
+  src={'https://github.com/user-attachments/assets/a00f06cc-da7c-41e8-a4d5-d4b675a22673'}
 />
 - Enter the access token you obtained.
 - Select a GitHub model for your AI assistant to start the conversation.
 <Image
-alt={'Selecting GitHub Model and Starting Conversation'}
+  alt={'Selecting GitHub Model and Starting Conversation'}
-inStep
+  inStep
-src={'https://github.com/user-attachments/assets/aead3c6c-891e-47c3-9f34-bdc33875e0c2'}
+  src={'https://github.com/user-attachments/assets/aead3c6c-891e-47c3-9f34-bdc33875e0c2'}
 />
 </Steps>
 You are now ready to use the models provided by GitHub for conversations within LobeChat.
@@ -13,9 +13,7 @@ tags:
 <Image
  cover
-  src={
+  src={'https://github.com/user-attachments/assets/3050839a-cb16-485d-8bae-1bc2f9ade632'}
    'https://github.com/user-attachments/assets/3050839a-cb16-485d-8bae-1bc2f9ade632'
  }
 />
 [GitHub Models](https://github.com/marketplace/models) 是 GitHub 最近推出的一项新功能，旨在为开发者提供一个免费的平台来访问和实验多种 AI 模型。GitHub Models 提供了一个互动沙盒环境，用户可以在此测试不同的模型参数和提示语，观察模型的响应。该平台支持多种先进的语言模型，包括 OpenAI 的 GPT-4o、Meta 的 Llama 3.1 和 Mistral 的 Large 2 等，覆盖了从大规模语言模型到特定任务模型的广泛应用。
@@ -24,7 +22,7 @@ tags:
 ## GitHub Models 速率限制
-当前 Playground 和免费 API 的使用受到每分钟请求数、每日请求数、每个请求的令牌数以及并发请求数的限制。若达到速率限制，则需等待限制重置后方可继续发出请求。不同模型（低、高及嵌入模型）的速率限制有所不同。  模型类型信息请参阅 GitHub Marketplace。
+当前 Playground 和免费 API 的使用受到每分钟请求数、每日请求数、每个请求的令牌数以及并发请求数的限制。若达到速率限制，则需等待限制重置后方可继续发出请求。不同模型（低、高及嵌入模型）的速率限制有所不同。 模型类型信息请参阅 GitHub Marketplace。
 <Image
  alt={'GitHub Models 速率限制'}
@@ -33,7 +31,8 @@ tags:
 />
 <Callout type="note">
-  这些限制可能随时更改，具体信息请参考 [GitHub 官方文档](https://docs.github.com/en/github-models/prototyping-with-ai-models#rate-limits)。
+  这些限制可能随时更改，具体信息请参考 [GitHub
  官方文档](https://docs.github.com/en/github-models/prototyping-with-ai-models#rate-limits)。
 </Callout>
 ---
@@ -63,7 +62,8 @@ tags:
 <Callout type={"warning"}>
  - GitHub Models 测试期间，要使用 GitHub Models，用户需要申请加入[等待名单（waitlist）](https://github.com/marketplace/models/waitlist/join) 通过后才能获得访问权限。
-  - 请安全地存储访问令牌，因为它只会出现一次。如果您意外丢失它，您将需要创建一个新令牌。
+- 请安全地存储访问令牌，因为它只会出现一次。如果您意外丢失它，您将需要创建一个新令牌。
 </Callout>
 ### 步骤二：在 LobeChat 中配置 GitHub Models
@@ -9,13 +9,12 @@ tags:
  - API Key
  - Web UI
 ---
 # Using Tencent Hunyuan in LobeChat
 <Image
-cover
+  cover
-src={
+  src={'https://github.com/user-attachments/assets/467bb431-ca0d-4bb4-ac17-e5e2b764a770'}
 'https://github.com/user-attachments/assets/467bb431-ca0d-4bb4-ac17-e5e2b764a770'
 }
 />
 [Tencent Hunyuan](https://hunyuan.tencent.com/) is a large model launched by Tencent, designed to provide users with intelligent assistant services. It utilizes natural language processing technology to help users solve problems, offer suggestions, and generate content. By conversing with the model, users can quickly access the information they need, thereby enhancing work efficiency.
@@ -30,17 +29,17 @@ This article will guide you on how to use Tencent Hunyuan in LobeChat.
 - Create an API key
 <Image
-alt={'Create API Key'}
+  alt={'Create API Key'}
-inStep
+  inStep
-src={'https://github.com/user-attachments/assets/5f344314-ecbc-41e6-9120-520a2d5352ff'}
+  src={'https://github.com/user-attachments/assets/5f344314-ecbc-41e6-9120-520a2d5352ff'}
 />
 - Click `View`, and copy the API key from the pop-up panel, ensuring you save it securely
 <Image
-alt={'Save Key'}
+  alt={'Save Key'}
-inStep
+  inStep
-src={'https://github.com/user-attachments/assets/659b5ac1-82f1-43bd-9d4b-a98491e05794'}
+  src={'https://github.com/user-attachments/assets/659b5ac1-82f1-43bd-9d4b-a98491e05794'}
 />
 ### Step 2: Configure Tencent Hunyuan in LobeChat
@@ -49,25 +48,25 @@ src={'https://github.com/user-attachments/assets/659b5ac1-82f1-43bd-9d4b-a98491e
 - Find the `Tencent Hunyuan` settings under `Language Models`
 <Image
-alt={'Enter API Key'}
+  alt={'Enter API Key'}
-inStep
+  inStep
-src={'https://github.com/user-attachments/assets/796c94af-9bad-4e3c-b1c7-dbb17c215c56'}
+  src={'https://github.com/user-attachments/assets/796c94af-9bad-4e3c-b1c7-dbb17c215c56'}
 />
 - Enter the API key you obtained
 - Select a Tencent Hunyuan model for your AI assistant to start the conversation
 <Image
-alt={'Select Tencent Hunyuan Model and Start Conversation'}
+  alt={'Select Tencent Hunyuan Model and Start Conversation'}
-inStep
+  inStep
-src={'https://github.com/user-attachments/assets/e3f44bc8-2fa5-441d-8934-943481472450'}
+  src={'https://github.com/user-attachments/assets/e3f44bc8-2fa5-441d-8934-943481472450'}
 />
 <Callout type={'warning'}>
-During usage, you may need to pay the API service provider, please refer to Tencent Hunyuan's relevant pricing policy.
+  During usage, you may need to pay the API service provider, please refer to Tencent Hunyuan's
  relevant pricing policy.
 </Callout>
 </Steps>
 You can now engage in conversations using the models provided by Tencent Hunyuan in LobeChat.
@@ -12,9 +12,7 @@ tags:
 <Image
  cover
-  src={
+  src={'https://github.com/user-attachments/assets/467bb431-ca0d-4bb4-ac17-e5e2b764a770'}
    'https://github.com/user-attachments/assets/467bb431-ca0d-4bb4-ac17-e5e2b764a770'
  }
 />
 [腾讯混元](https://hunyuan.tencent.com/)是由腾讯推出的一款大模型，旨在为用户提供智能助手服务。它能够通过自然语言处理技术，帮助用户解决问题、提供建议以及进行内容生成等任务。用户可以通过与模型的对话，快速获取所需信息，从而提高工作效率。
@@ -9,13 +9,12 @@ tags:
  - API Key
  - Web UI
 ---
 # Using SiliconCloud in LobeChat
 <Image
-cover
+  cover
-src={
+  src={'https://github.com/user-attachments/assets/9a78bbb9-7c96-4f32-9b66-e57f92660410'}
 'https://github.com/user-attachments/assets/9a78bbb9-7c96-4f32-9b66-e57f92660410'
 }
 />
 [SiliconCloud](https://siliconflow.cn/) is an AI service platform based on open-source foundational models, offering a variety of generative AI (GenAI) services.
@@ -30,9 +29,9 @@ This article will guide you on how to use SiliconCloud in LobeChat.
 - Create an API Key and copy it
 <Image
-alt={'Create API Key'}
+  alt={'Create API Key'}
-inStep
+  inStep
-src={'https://github.com/user-attachments/assets/872756dc-305e-4e63-9fb7-60550280fc12'}
+  src={'https://github.com/user-attachments/assets/872756dc-305e-4e63-9fb7-60550280fc12'}
 />
 ### Step 2: Configure SiliconCloud in LobeChat
@@ -41,25 +40,25 @@ src={'https://github.com/user-attachments/assets/872756dc-305e-4e63-9fb7-6055028
 - Under `Language Model`, find the setting for `SiliconFlow`
 <Image
-alt={'Enter API Key'}
+  alt={'Enter API Key'}
-inStep
+  inStep
-src={'https://github.com/user-attachments/assets/4c792f62-5203-4f13-8f23-df228f70d67f'}
+  src={'https://github.com/user-attachments/assets/4c792f62-5203-4f13-8f23-df228f70d67f'}
 />
 - Enter the API Key you obtained
 - Choose a SiliconCloud model for your AI assistant to start the conversation
 <Image
-alt={'Select SiliconCloud Model and Start Conversation'}
+  alt={'Select SiliconCloud Model and Start Conversation'}
-inStep
+  inStep
-src={'https://github.com/user-attachments/assets/f4dbbadb-7461-4370-a836-09c487fdd206'}
+  src={'https://github.com/user-attachments/assets/f4dbbadb-7461-4370-a836-09c487fdd206'}
 />
 <Callout type={'warning'}>
-During usage, you may need to pay the API service provider, so please refer to SiliconCloud's relevant pricing policy.
+  During usage, you may need to pay the API service provider, so please refer to SiliconCloud's
  relevant pricing policy.
 </Callout>
 </Steps>
 At this point, you can start chatting using the models provided by SiliconCloud in LobeChat.
@@ -8,13 +8,11 @@ tags:
  - Web UI
 ---
-# 在 LobeChat 中使用 SiliconCloud 
+# 在 LobeChat 中使用 SiliconCloud
 <Image
  cover
-  src={
+  src={'https://github.com/user-attachments/assets/9a78bbb9-7c96-4f32-9b66-e57f92660410'}
    'https://github.com/user-attachments/assets/9a78bbb9-7c96-4f32-9b66-e57f92660410'
  }
 />
 [SiliconCloud](https://siliconflow.cn/) 是一个基于开源基础模型的人工智能服务平台，提供多种生成式AI（GenAI）服务。
@@ -34,7 +32,7 @@ tags:
  src={'https://github.com/user-attachments/assets/872756dc-305e-4e63-9fb7-60550280fc12'}
 />
-### 步骤二：在 LobeChat 中配置 SiliconCloud 
+### 步骤二：在 LobeChat 中配置 SiliconCloud
 - 访问 LobeChat 的`设置`界面
 - 在`语言模型`下找到 `SiliconFlow` 的设置项
@@ -8,13 +8,12 @@ tags:
  - API Key
  - Web UI
 ---
 # Using iFLYTEK Spark in LobeChat
 <Image
-cover
+  cover
-src={
+  src={'https://github.com/user-attachments/assets/f3068287-8ade-4eca-9841-ea67d8ff1226'}
 'https://github.com/user-attachments/assets/f3068287-8ade-4eca-9841-ea67d8ff1226'
 }
 />
 [iFLYTEK Spark](https://xinghuo.xfyun.cn/) is a powerful AI model launched by iFLYTEK, equipped with cross-domain knowledge and language understanding capabilities, able to perform various tasks such as Q&A, conversations, and literary creation.
@@ -28,18 +27,18 @@ This guide will instruct you on how to use iFLYTEK Spark in LobeChat.
 - Create an application
 <Image
-alt={'Create Application'}
+  alt={'Create Application'}
-inStep
+  inStep
-src={'https://github.com/user-attachments/assets/1bf1a5f0-32ad-418c-a8d1-6c54740f50b9'}
+  src={'https://github.com/user-attachments/assets/1bf1a5f0-32ad-418c-a8d1-6c54740f50b9'}
 />
 - Select a large model to view details
 - Copy the `API Password` from the top right corner under the HTTP service interface authentication information
 <Image
-alt={'Copy API Key'}
+  alt={'Copy API Key'}
-inStep
+  inStep
-src={'https://github.com/user-attachments/assets/7239d611-1989-414b-a51c-444e47096d75'}
+  src={'https://github.com/user-attachments/assets/7239d611-1989-414b-a51c-444e47096d75'}
 />
 ### Step 2: Configure iFLYTEK Spark in LobeChat
@@ -48,25 +47,25 @@ src={'https://github.com/user-attachments/assets/7239d611-1989-414b-a51c-444e470
 - Find the iFLYTEK Spark settings under `Language Model`
 <Image
-alt={'Enter API Key'}
+  alt={'Enter API Key'}
-inStep
+  inStep
-src={'https://github.com/user-attachments/assets/d693be02-e08c-43ae-8bde-1294f180aaf6'}
+  src={'https://github.com/user-attachments/assets/d693be02-e08c-43ae-8bde-1294f180aaf6'}
 />
 - Input the obtained API Key
 - Choose an iFLYTEK Spark model for your AI assistant to start the conversation
 <Image
-alt={'Select iFLYTEK Spark Model and Start Conversation'}
+  alt={'Select iFLYTEK Spark Model and Start Conversation'}
-inStep
+  inStep
-src={'https://github.com/user-attachments/assets/8910186f-4609-4798-a588-2780dcf8db60'}
+  src={'https://github.com/user-attachments/assets/8910186f-4609-4798-a588-2780dcf8db60'}
 />
 <Callout type={'warning'}>
-During usage, you may need to pay the API service provider, please refer to the relevant pricing policy of iFLYTEK Spark.
+  During usage, you may need to pay the API service provider, please refer to the relevant pricing
  policy of iFLYTEK Spark.
 </Callout>
 </Steps>
 Now you can use the models provided by iFLYTEK Spark for conversations in LobeChat.
@@ -12,9 +12,7 @@ tags:
 <Image
  cover
-  src={
+  src={'https://github.com/user-attachments/assets/f3068287-8ade-4eca-9841-ea67d8ff1226'}
    'https://github.com/user-attachments/assets/f3068287-8ade-4eca-9841-ea67d8ff1226'
  }
 />
 [讯飞星火](https://xinghuo.xfyun.cn/)是科大讯飞推出的一款强大的AI大模型，具备跨领域的知识和语言理解能力，能够执行问答、对话和文学创作等多种任务。
@@ -7,13 +7,12 @@ tags:
  - API Key
  - Web UI
 ---
 # Using Upstage in LobeChat
 <Image
-cover
+  cover
-src={
+  src={'https://github.com/user-attachments/assets/14696698-03f7-4856-b36c-9a53997eb12c'}
 'https://github.com/user-attachments/assets/14696698-03f7-4856-b36c-9a53997eb12c'
 }
 />
 [Upstage](https://www.upstage.ai/) is a platform that offers AI models and services, focusing on applications in natural language processing and machine learning. It allows developers to access its powerful AI capabilities through APIs, supporting various tasks such as text generation and conversational systems.
@@ -29,9 +28,9 @@ This article will guide you on how to use Upstage in LobeChat.
 - Copy and save the generated API key
 <Image
-alt={'Save the API Key'}
+  alt={'Save the API Key'}
-inStep
+  inStep
-src={'https://github.com/user-attachments/assets/8a0225e0-16ed-40ce-9cd5-553dda561679'}
+  src={'https://github.com/user-attachments/assets/8a0225e0-16ed-40ce-9cd5-553dda561679'}
 />
 ### Step 2: Configure Upstage in LobeChat
@@ -40,25 +39,25 @@ src={'https://github.com/user-attachments/assets/8a0225e0-16ed-40ce-9cd5-553dda5
 - Locate the `Upstage` settings under `Language Models`
 <Image
-alt={'Enter API Key'}
+  alt={'Enter API Key'}
-inStep
+  inStep
-src={'https://github.com/user-attachments/assets/e89d2a56-4bf0-4bff-ac39-0d44789fa858'}
+  src={'https://github.com/user-attachments/assets/e89d2a56-4bf0-4bff-ac39-0d44789fa858'}
 />
 - Enter the obtained API key
 - Select an Upstage model for your AI assistant to start the conversation
 <Image
-alt={'Select Upstage Model and Start Conversation'}
+  alt={'Select Upstage Model and Start Conversation'}
-inStep
+  inStep
-src={'https://github.com/user-attachments/assets/88e14294-20a6-47c6-981e-fb65453b57cd'}
+  src={'https://github.com/user-attachments/assets/88e14294-20a6-47c6-981e-fb65453b57cd'}
 />
 <Callout type={'warning'}>
-Please note that you may need to pay the API service provider for usage. Refer to Upstage's pricing policy for more information.
+  Please note that you may need to pay the API service provider for usage. Refer to Upstage's
  pricing policy for more information.
 </Callout>
 </Steps>
 You can now use the models provided by Upstage for conversations in LobeChat.
@@ -12,9 +12,7 @@ tags:
 <Image
  cover
-  src={
+  src={'https://github.com/user-attachments/assets/14696698-03f7-4856-b36c-9a53997eb12c'}
    'https://github.com/user-attachments/assets/14696698-03f7-4856-b36c-9a53997eb12c'
  }
 />
 [Upstage](https://www.upstage.ai/) 是一个提供 AI 模型和服务的平台，专注于自然语言处理和机器学习应用。它允许开发者通过 API 接入其强大的 AI 功能，支持多种任务，如文本生成、对话系统等。
@@ -10,13 +10,12 @@ tags:
  - API密钥
  - Web UI
 ---
 # Using Wenxin Qianfan in LobeChat
 <Image
-cover
+  cover
-src={
+  src={'https://github.com/user-attachments/assets/e43dacf6-313e-499c-8888-f1065c53e424'}
 'https://github.com/user-attachments/assets/e43dacf6-313e-499c-8888-f1065c53e424'
 }
 />
 [Wenxin Qianfan](https://qianfan.cloud.baidu.com/) is an artificial intelligence large language model platform launched by Baidu, supporting a variety of application scenarios, including literary creation, commercial copywriting, and mathematical logic reasoning. The platform features deep semantic understanding and generation capabilities across modalities and languages, and it is widely utilized in fields such as search Q&A, content creation, and smart office applications.
@@ -32,18 +31,18 @@ This article will guide you on how to use Wenxin Qianfan in LobeChat.
 - Create an application
 <Image
-alt={'Create Application'}
+  alt={'Create Application'}
-inStep
+  inStep
-src={'https://github.com/user-attachments/assets/927b1040-e23f-4919-92e2-80a400db8327'}
+  src={'https://github.com/user-attachments/assets/927b1040-e23f-4919-92e2-80a400db8327'}
 />
 - Enter the `Security Authentication` -> `Access Key` management page from the user account menu
 - Copy the `Access Key` and `Secret Key`, and store them safely
 <Image
-alt={'Save Keys'}
+  alt={'Save Keys'}
-inStep
+  inStep
-src={'https://github.com/user-attachments/assets/bb9dadd3-7e9c-45fd-8c56-553ab7287453'}
+  src={'https://github.com/user-attachments/assets/bb9dadd3-7e9c-45fd-8c56-553ab7287453'}
 />
 ### Step 2: Configure Wenxin Qianfan in LobeChat
@@ -52,25 +51,25 @@ src={'https://github.com/user-attachments/assets/bb9dadd3-7e9c-45fd-8c56-553ab72
 - Locate the settings for `Wenxin Qianfan` under `Language Model`
 <Image
-alt={'Enter API Keys'}
+  alt={'Enter API Keys'}
-inStep
+  inStep
-src={'https://github.com/user-attachments/assets/e3995de7-38d9-489b-80a2-434477018469'}
+  src={'https://github.com/user-attachments/assets/e3995de7-38d9-489b-80a2-434477018469'}
 />
 - Enter the obtained `Access Key` and `Secret Key`
 - Select a Wenxin Qianfan model for your AI assistant to start interacting
 <Image
-alt={'Select Wenxin Qianfan Model and Start Chat'}
+  alt={'Select Wenxin Qianfan Model and Start Chat'}
-inStep
+  inStep
-src={'https://github.com/user-attachments/assets/b6e6a3eb-13c6-46f0-9c7c-69a20deae30f'}
+  src={'https://github.com/user-attachments/assets/b6e6a3eb-13c6-46f0-9c7c-69a20deae30f'}
 />
 <Callout type={'warning'}>
-During usage, you may need to pay the API service provider. Please refer to Wenxin Qianfan's relevant fee policy.
+  During usage, you may need to pay the API service provider. Please refer to Wenxin Qianfan's
  relevant fee policy.
 </Callout>
 </Steps>
 You can now use the models provided by Wenxin Qianfan for conversations in LobeChat.
@@ -13,9 +13,7 @@ tags:
 <Image
  cover
-  src={
+  src={'https://github.com/user-attachments/assets/e43dacf6-313e-499c-8888-f1065c53e424'}
    'https://github.com/user-attachments/assets/e43dacf6-313e-499c-8888-f1065c53e424'
  }
 />
 [文心千帆](https://qianfan.cloud.baidu.com/)是百度推出的一个人工智能大语言模型平台，支持多种应用场景，包括文学创作、商业文案生成、数理逻辑推算等。该平台具备跨模态、跨语言的深度语义理解与生成能力，广泛应用于搜索问答、内容创作和智能办公等领域。
@@ -75,8 +75,8 @@ This document will guide you on how to use 01 AI in LobeChat:
 />
 <Callout type={'warning'}>
-  During usage, you may need to pay the API service provider. Please refer to 01 AI's relevant
+  During usage, you may need to pay the API service provider. Please refer to 01 AI's relevant fee
-  fee policies.
+  policies.
 </Callout>
 </Steps>
@@ -65,6 +65,7 @@
    "test:update": "vitest -u",
    "type-check": "tsc --noEmit",
    "webhook:ngrok": "ngrok http http://localhost:3011",
    "workflow:changelog": "tsx ./scripts/changelogWorkflow/index.ts",
    "workflow:countCharters": "tsx scripts/countEnWord.ts",
    "workflow:docs": "tsx ./scripts/docsWorkflow/index.ts",
    "workflow:i18n": "tsx ./scripts/i18nWorkflow/index.ts",
@@ -244,11 +245,13 @@
    "@next/bundle-analyzer": "^14.2.15",
    "@next/eslint-plugin-next": "^14.2.15",
    "@peculiar/webcrypto": "^1.5.0",
    "@semantic-release/exec": "^6.0.3",
    "@testing-library/jest-dom": "^6.6.2",
    "@testing-library/react": "^16.0.1",
    "@types/chroma-js": "^2.4.4",
    "@types/debug": "^4.1.12",
    "@types/diff": "^6.0.0",
    "@types/fs-extra": "^11.0.4",
    "@types/ip": "^1.1.3",
    "@types/json-schema": "^7.0.15",
    "@types/lodash": "^4.17.12",
@@ -276,6 +279,7 @@
    "eslint-plugin-mdx": "^2.3.4",
    "eslint-plugin-unused-imports": "4.0.1",
    "fake-indexeddb": "^6.0.0",
    "fs-extra": "^11.2.0",
    "glob": "^11.0.0",
    "gray-matter": "^4.0.3",
    "happy-dom": "^15.7.4",
@@ -284,6 +288,7 @@
    "lint-staged": "^15.2.10",
    "lodash": "^4.17.21",
    "markdown-table": "^3.0.3",
    "markdown-to-txt": "^2.0.1",
    "node-fetch": "^3.3.2",
    "node-gyp": "^10.2.0",
    "openapi-typescript": "^6.7.6",
@@ -0,0 +1,135 @@
 import { consola } from 'consola';
 import { readJsonSync, writeJSONSync } from 'fs-extra';
 import { markdownToTxt } from 'markdown-to-txt';
 import { existsSync, readFileSync } from 'node:fs';
 import { resolve } from 'node:path';
 import semver from 'semver';
 import { CHANGELOG_DIR, CHANGELOG_FILE } from './const';
 export interface ChangelogStaticItem {
  children: {
    [category: string]: string[];
  };
  date: string;
  version: string;
 }
 class BuildStaticChangelog {
  private removeDetailsTag = (changelog: string): string => {
    const detailsRegex: RegExp = /<details\b[^>]*>[\S\s]*?<\/details>/gi;
    return changelog.replaceAll(detailsRegex, '');
  };
  private cleanVersion = (version: string): string => {
    return semver.clean(version) || version;
  };
  private formatCategory = (category: string): string => {
    const cate = category.trim().toLowerCase();
    switch (cate) {
      case 'bug fixes': {
        return 'fixes';
      }
      case 'features': {
        return 'features';
      }
      default: {
        return 'improvements';
      }
    }
  };
  private formatChangelog = (changelog: string): ChangelogStaticItem[] => {
    const cleanedChangelog = this.removeDetailsTag(changelog);
    const input = markdownToTxt(cleanedChangelog);
    const versions = input.split(/Version&nbsp;|Version /).slice(1);
    const output: ChangelogStaticItem[] = [];
    for (const version of versions) {
      const lines = version.trim().split('\n');
      const versionNumber = lines[0].trim();
      const date = lines[2].replace('Released on ', '').trim();
      const entry: ChangelogStaticItem = {
        children: {},
        date: date,
        version: this.cleanVersion(versionNumber),
      };
      let currentCategory = '';
      let skipSection = false;
      for (let i = 3; i < lines.length; i++) {
        const line = lines[i].trim();
        if (line === '') continue;
        if (/^\p{Emoji}/u.test(line)) {
          currentCategory = this.formatCategory(line.replace(/^\p{Emoji} /u, ''));
          if (!currentCategory) continue;
          entry.children[currentCategory] = [];
          skipSection = false;
        } else if (line.startsWith('misc:') && !skipSection && currentCategory) {
          entry.children[currentCategory].push(line.replace('misc:', '').trim());
        }
      }
      // Remove empty categories
      for (const category in entry.children) {
        if (entry.children[category].length === 0) {
          delete entry.children[category];
        }
      }
      output.push(entry);
    }
    return output;
  };
  private mergeAndSortVersions = (oldVersions: any, newVersions: any) => {
    const mergedVersions = [...oldVersions];
    for (const newVersion of newVersions) {
      const existingIndex = mergedVersions.findIndex(
        (v) => this.cleanVersion(v.version) === this.cleanVersion(newVersion.version),
      );
      if (existingIndex === -1) {
        const insertIndex = mergedVersions.findIndex(
          (v) =>
            semver.compare(this.cleanVersion(newVersion.version), this.cleanVersion(v.version)) > 0,
        );
        if (insertIndex === -1) {
          mergedVersions.push(newVersion);
        } else {
          mergedVersions.splice(insertIndex, 0, newVersion);
        }
      }
    }
    return mergedVersions;
  };
  run() {
    Object.entries(CHANGELOG_FILE).forEach(([version, path]) => {
      const data = readFileSync(path, 'utf8');
      const newFile = this.formatChangelog(data);
      const filename = resolve(CHANGELOG_DIR, `${version}.json`);
      let mergedFile = newFile;
      if (existsSync(filename)) {
        const oldFile = readJsonSync(filename, 'utf8');
        mergedFile = this.mergeAndSortVersions(oldFile, newFile);
      }
      writeJSONSync(filename, mergedFile, { spaces: 2 });
      consola.success(`Changelog ${version} has been built successfully!`);
    });
  }
 }
 export const buildStaticChangelog = new BuildStaticChangelog();
@@ -0,0 +1,11 @@
 import { resolve } from 'node:path';
 export const ROOT = resolve(__dirname, '../..');
 export const DOCS_DIR = resolve(ROOT, 'docs/changelog');
 export const CHANGELOG_DIR = resolve(ROOT, 'changelog');
 export const CHANGELOG_FILE = {
  v0: resolve(CHANGELOG_DIR, 'CHANGELOG.v0.md'),
  v1: resolve(ROOT, 'CHANGELOG.md'),
 };
 export const STATICS_DIR = resolve(DOCS_DIR, '__statics__');
 export const CHANGELOG_INDEX = resolve(DOCS_DIR, 'index.json');
@@ -0,0 +1,10 @@
 import { consola } from 'consola';
 import { buildStaticChangelog } from './buildStaticChangelog';
 const run = () => {
  consola.start('Building static changelog...');
  buildStaticChangelog.run();
 };
 run();
`@@ -11,4 +11,3 @@ tags:`
	`# Deploy LobeChat with Database on Netlify`	`# Deploy LobeChat with Database on Netlify`

	`TODO`	`TODO`
`@@ -11,4 +11,3 @@ tags:`
	`# Deploy LobeChat with Database on Railway`	`# Deploy LobeChat with Database on Railway`

	`TODO`	`TODO`
`@@ -51,4 +51,4 @@ tags:`

	`服务端数据库方案则适合那些希望简化数据管理流程，享受便捷使用体验的用户。通过服务端数据库与用户身份验证，LobeChat 能够确保数据的安全性与高效性。如果您希望了解如何配置服务端数据库，请参考我们的[详细文档](/zh/docs/self-hosting/advanced/server-database)。`	`服务端数据库方案则适合那些希望简化数据管理流程，享受便捷使用体验的用户。通过服务端数据库与用户身份验证，LobeChat 能够确保数据的安全性与高效性。如果您希望了解如何配置服务端数据库，请参考我们的[详细文档](/zh/docs/self-hosting/advanced/server-database)。`

	`无论选择本地数据库还是服务端数据库，LobeChat 都能为你提供卓越的用户体验。`	`无论选择本地数据库还是服务端数据库，LobeChat 都能为你提供卓越的用户体验。`