feat: add Traditional Chinese documentations

This commit is contained in:
Hintay 2023-05-07 04:39:43 +08:00
parent 7deaef920d
commit 18ed5deaee
No known key found for this signature in database
GPG key ID: 120FC7FF121F2F2D
20 changed files with 819 additions and 9 deletions

View file

@ -2,11 +2,13 @@ import { defineConfig } from 'vitepress'
import { sharedConfig } from './shared' import { sharedConfig } from './shared'
import { enConfig } from "./en" import { enConfig } from "./en"
import { zhCNConfig } from "./zh_CN" import { zhCNConfig } from "./zh_CN"
import { zhTWConfig } from "./zh_TW";
export default defineConfig({ export default defineConfig({
...sharedConfig, ...sharedConfig,
locales: { locales: {
root: { label: 'English', lang: 'en', ...enConfig }, root: { label: 'English', lang: 'en', ...enConfig },
zh_CN: { label: '简体中文', lang: 'zh-CN', ...zhCNConfig } zh_CN: { label: '简体中文', lang: 'zh-CN', ...zhCNConfig },
zh_TW: { label: '繁體中文', lang: 'zh-TW', ...zhTWConfig }
} }
}) })

View file

@ -30,7 +30,7 @@ export const zhCNConfig: LocaleSpecificConfig<DefaultTheme.Config> = {
collapsed: false, collapsed: false,
items: [ items: [
{text: '构建', link: '/zh_CN/guide/build'}, {text: '构建', link: '/zh_CN/guide/build'},
{text: '结构', link: '/zh_CN/guide/project-structure'}, {text: '目结构', link: '/zh_CN/guide/project-structure'},
{text: '贡献代码', link: '/zh_CN/guide/contributing'} {text: '贡献代码', link: '/zh_CN/guide/contributing'}
] ]
}, },

View file

@ -0,0 +1,92 @@
import {LocaleSpecificConfig, DefaultTheme} from "vitepress"
import {demoUrl, editLinkPattern} from './common'
export const zhTWConfig: LocaleSpecificConfig<DefaultTheme.Config> = {
themeConfig: {
nav: [
{text: '首頁', link: '/zh_TW/'},
{text: '手冊', link: '/zh_TW/guide/about'},
{text: '演示', link: demoUrl}
],
editLink: {
text: '編輯此頁',
pattern: editLinkPattern
},
sidebar: {
'/zh_TW/guide/': [
{
text: '介紹',
collapsed: false,
items: [
{text: '何為 Nginx UI?', link: '/zh_TW/guide/about'},
{text: '即刻開始', link: '/zh_TW/guide/getting-started'},
{text: '安裝指令碼', link: '/zh_TW/guide/install-script-linux'}
]
},
{
text: '開發',
collapsed: false,
items: [
{text: '構建', link: '/zh_TW/guide/build'},
{text: '專案結構', link: '/zh_TW/guide/project-structure'},
{text: '貢獻程式碼', link: '/zh_TW/guide/contributing'}
]
},
{
text: '配置',
collapsed: false,
items: [
{text: '服務端', link: '/zh_TW/guide/config-server'},
{text: 'Nginx 日誌', link: '/zh_TW/guide/config-nginx-log'},
{text: 'Open AI', link: '/zh_TW/guide/config-openai'}
]
},
{
text: '附錄',
collapsed: false,
items: [
{text: 'Nginx 代理示例', link: '/zh_TW/guide/nginx-proxy-example'},
{text: '開源協議', link: '/zh_TW/guide/license'}
]
}
]
},
docFooter: {
prev: '上一頁',
next: '下一頁',
},
returnToTopLabel: '返回頂部',
outlineTitle: '導航欄',
darkModeSwitchLabel: '外觀',
sidebarMenuLabel: '歸檔',
lastUpdatedText: '更新於',
search: {
provider: 'local',
options: {
locales: {
zh_CN: {
translations: {
button: {
buttonText: '搜尋文件',
buttonAriaLabel: '搜尋文件'
},
modal: {
noResultsText: '無法找到相關結果',
resetButtonTitle: '清除查詢條件',
footer: {
selectText: '選擇',
navigateText: '切換',
closeText: '關閉'
}
}
}
}
}
}
}
}
}

View file

@ -1,7 +1,6 @@
# 构建 # 构建
构建指南仅适用于开发人员或高级用户。 构建指南仅适用于开发人员或高级用户。普通用户应遵循 [快速入门](./getting-started) 指南。
普通用户应遵循 [快速入门](./getting-started) 指南。
## 依赖 ## 依赖

View file

@ -7,7 +7,7 @@ Nginx 日志对于监控、排查问题和维护您的 Web 服务器至关重要
在 Nginx-UI 容器中,`/var/log/nginx/access.log` 是一个指向 `/dev/stdout` 的符号链接,而 `/var/log/nginx/error.log` 在 Nginx-UI 容器中,`/var/log/nginx/access.log` 是一个指向 `/dev/stdout` 的符号链接,而 `/var/log/nginx/error.log`
是一个指向 `/dev/stderr` 的符号链接。这种设置允许您使用 `docker logs nginx-ui` 命令查看 Nginx 和 Nginx-UI 日志。然而,这两个设备不支持 是一个指向 `/dev/stderr` 的符号链接。这种设置允许您使用 `docker logs nginx-ui` 命令查看 Nginx 和 Nginx-UI 日志。然而,这两个设备不支持
tail 命令,因此有必要使用额外的日志文件来记录 Nginx 日志。 `tail` 命令,因此有必要使用额外的日志文件来记录 Nginx 日志。
示例: 示例:

View file

@ -75,8 +75,8 @@ docker run -dit \
## 通过执行文件运行 ## 通过执行文件运行
不建议直接运行Nginx UI可执行文件用于非测试目的。 不建议直接运行 Nginx UI 可执行文件用于非测试目的。
我们建议在Linux上将其配置为守护进程或使用[安装脚本](./install-script-linux)。 我们建议在 Linux 上将其配置为守护进程或使用 [安装脚本](./install-script-linux)。
### 配置 ### 配置

View file

@ -30,7 +30,7 @@ bash <(curl -L -s https://raw.githubusercontent.com/0xJacky/nginx-ui/master/inst
``` ```
一键安装脚本默认设置的监听端口为 `9000`HTTP Challenge 端口默认为 `9180`。如果有端口冲突,请手动修改 `/usr/local/etc/nginx-ui/app.ini` 一键安装脚本默认设置的监听端口为 `9000`HTTP Challenge 端口默认为 `9180`。如果有端口冲突,请手动修改 `/usr/local/etc/nginx-ui/app.ini`
并使用 `systemctl restart nginx-ui` 重启 Nginx UI 服务。有关更多信息,请查看 [配置参考](./config-server)。 并使用 `systemctl restart nginx-ui` 重启 Nginx UI 服务。更多有关信息,请查看 [配置参考](./config-server)。
## 卸载 ## 卸载

View file

@ -64,7 +64,7 @@
│ │ └─ ... │ │ └─ ...
│ ├─ api # 向前端提供的 API │ ├─ api # 向前端提供的 API
│ ├─ model # 自动生成的模型 │ ├─ model # 自动生成的模型
│ ├─ query # gen 自动生成的请求文件 │ ├─ query # gen 自动生成的数据库请求文件
│ ├─ router # 路由和中间件 │ ├─ router # 路由和中间件
│ ├─ service # 服务文件 │ ├─ service # 服务文件
│ ├─ settings # 配置接口 │ ├─ settings # 配置接口

91
docs/zh_TW/guide/about.md Normal file
View file

@ -0,0 +1,91 @@
<script setup>
import { VPTeamMembers } from 'vitepress/theme';
const blogIcon = '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" xml:space="preserve"><title>Blog</title><path d="M5 23c-2.2 0-4-1.8-4-4v-8h2v4.5c.6-.3 1.3-.5 2-.5 2.2 0 4 1.8 4 4s-1.8 4-4 4zm0-6c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2zm19 2h-2C22 9.6 14.4 2 5 2V0c10.5 0 19 8.5 19 19zm-5 0h-2c0-6.6-5.4-12-12-12V5c7.7 0 14 6.3 14 14zm-5 0h-2c0-3.9-3.1-7-7-7v-2c5 0 9 4 9 9z"/></svg>';
const members = [
{
avatar: 'https://www.github.com/0xJacky.png',
name: '0xJacky',
title: '創始人',
links: [
{ icon: 'github', link: 'https://github.com/0xJacky' },
{ icon: { svg: blogIcon }, link: 'https://jackyu.cn' }
]
},
{
avatar: 'https://www.github.com/Hintay.png',
name: 'Hintay',
title: '開發者',
links: [
{ icon: 'github', link: 'https://github.com/Hintay' },
{ icon: { svg: blogIcon }, link: 'https://blog.kugeek.com' }
]
},
]
</script>
# 何為 Nginx UI?
![Dashboard](/assets/dashboard_zh_CN.png)
<div class="tip custom-block" style="padding-top: 8px">
想快速試試嗎?跳轉到 [即刻開始](./getting-started)。
</div>
Nginx UI 是一個全新的 Nginx 網路管理介面,旨在簡化 Nginx 伺服器的管理和配置。它提供實時伺服器統計資料、ChatGPT
助手、一鍵部署、Let's Encrypt 證書的自動續簽以及使用者友好的網站配置編輯工具。此外Nginx UI 還提供了線上訪問 Nginx
日誌、配置檔案的自動測試和過載、網路終端、深色模式和自適應網頁設計等功能。Nginx UI 採用 Go 和 Vue 構建,確保在管理 Nginx
伺服器時提供無縫高效的體驗。
## 我們的團隊
<VPTeamMembers size="small" :members="members" />
## 特色
- 線上檢視伺服器 CPU、記憶體、系統負載、磁碟使用率等指標
- 線上 ChatGPT 助理
- 一鍵申請和自動續簽 Let's encrypt 憑證
- 線上編輯 Nginx 配置檔案,編輯器支援 Nginx 配置語法突顯
- 線上檢視 Nginx 日誌
- 使用 Go 和 Vue 開發,發行版本為單個可執行檔案
- 儲存配置後自動測試配置檔案並重載 Nginx
- 基於網頁瀏覽器的高階命令列終端
- 支援暗黑模式
- 自適應網頁設計
## 可用作業系統
Nginx UI 可在以下作業系統中使用:
- Mac OS X 10.10 Yosemite 及之後版本amd64 / arm64
- Linux 2.6.23 及之後版本x86 / amd64 / arm64 / armv5 / armv6 / armv7
- 包括但不限於 Debian 7 / 8、Ubuntu 12.04 / 14.04 及後續版本、CentOS 6 / 7、Arch Linux
- FreeBSD
- OpenBSD
- Dragonfly BSD
- Openwrt
## 國際化
- 英語
- 簡體中文
- 繁體中文
我們歡迎您將專案翻譯成任何語言。
## 構建基於
- [The Go Programming Language](https://go.dev)
- [Gin Web Framework](https://gin-gonic.com)
- [GORM](http://gorm.io)
- [Vue 3](https://v3.vuejs.org)
- [Vite](https://vitejs.dev)
- [TypeScript](https://www.typescriptlang.org/)
- [Ant Design Vue](https://antdv.com)
- [vue3-gettext](https://github.com/jshmrtn/vue3-gettext)
- [vue3-ace-editor](https://github.com/CarterLi/vue3-ace-editor)
- [Gonginx](https://github.com/tufanbarisyildirim/gonginx)

36
docs/zh_TW/guide/build.md Normal file
View file

@ -0,0 +1,36 @@
# 構建
構建指南僅適用於開發人員或高階使用者。普通使用者應遵循 [快速入門](./getting-started) 指南。
## 依賴
- Make
- Golang 版本 1.20 或更高
- node.js 版本 18 或更高
你需要在構建專案之前執行以下命令更新瀏覽器列表資料庫。
```shell
npx browserslist@latest --update-db
```
## 構建前端
請在 `frontend` 資料夾中執行以下命令。
```shell
yarn install
make translations
yarn build
```
## 構建後端
::: warning 警告
在構建後端之前應先構建前端,因為後端將嵌入前端構建的檔案。
:::
請在專案的根資料夾執行以下命令。
```shell
go build -o nginx-ui -v main.go
```

View file

@ -0,0 +1,46 @@
# Nginx 日誌
Nginx 日誌對於監控、排查問題和維護您的 Web 伺服器至關重要。它們提供了有關伺服器效能、使用者行為和潛在問題的寶貴見解。在本節中,我們將討論兩種主要型別的日誌:訪問日誌和錯誤日誌。
對於從 v1.5.2 或更早版本升級的 Nginx-UI Docker 使用者,在配置 `app.ini` 之前,至關重要的是在您的 `nginx.conf`
中新增單獨的 `access_log``error_log` 指令。
在 Nginx-UI 容器中,`/var/log/nginx/access.log` 是一個指向 `/dev/stdout` 的符號連結,而 `/var/log/nginx/error.log`
是一個指向 `/dev/stderr` 的符號連結。這種設定允許您使用 `docker logs nginx-ui` 命令檢視 Nginx 和 Nginx-UI 日誌。然而,這兩個裝置不支援
`tail` 命令,因此有必要使用額外的日誌檔案來記錄 Nginx 日誌。
示例:
```nginx
error_log /var/log/nginx/error.log notice;
error_log /var/log/nginx/error.local.log notice;
http {
...
access_log /var/log/nginx/access.log main;
access_log /var/log/nginx/access.local.log main;
...
}
```
此外,在 `app.ini` 中設定 nginx 訪問日誌和錯誤日誌路徑,然後重新啟動 nginx-ui。
示例:
```ini
[nginx_log]
AccessLogPath = /var/log/nginx/access.local.log
ErrorLogPath = /var/log/nginx/error.local.log
```
## AccessLogPath
- 型別:`string`
此選項用於為 Nginx UI 設定 Nginx 訪問日誌的路徑,以便我們線上檢視日誌內容。
## ErrorLogPath
- 型別:`string`
此選項用於為 Nginx UI 設定 Nginx 錯誤日誌的路徑,以便我們線上檢視日誌內容。

View file

@ -0,0 +1,30 @@
# Open AI
本節用於設定 ChatGPT 配置。請注意,我們不會檢查您提供的資訊的準確性。如果配置錯誤,可能會導致 API 請求失敗,導致 ChatGPT
助手無法使用。
## BaseUrl
- 型別:`string`
此選項用於設定 Open AI API 的基本 URL如果不需要更改 URL則將其保留為空。
## Token
- 型別:`string`
此選項用於設定 Open AI API 的令牌。
## Proxy
- 型別:`string`
此選項用於為 OpenAI 的 API 配置代理。如果您在國家或地區無法訪問 OpenAI 的 API可以使用 HTTP 代理並將此選項設定為相應的
URL。
## Model
- 型別:`string`
- 預設值:`gpt-3.5-turbo`
此選項用於設定 ChatGPT 模型。如果您的帳戶有許可權訪問 `gpt-4` 模型,可以相應地配置此選項。

View file

@ -0,0 +1,71 @@
# 服務端
Nginx UI 配置的服務端部分涉及控制 Nginx UI 服務的各種設定。在本節中,我們將討論可用的選項、它們的預設值以及它們的目的。
## HttpPort
- 型別:`int`
- 預設值:`9000`
Nginx UI 監聽埠。此選項用於配置 Nginx UI 伺服器監聽傳入 HTTP 請求的埠。更改預設埠對於避免埠衝突或增強安全性可能很有用。
## RunMode
- 型別:`string`
- 支援的值:`release``debug`
::: tip 提示
目前,此選項尚無影響。在使用方面,`release``debug` 之間不會有顯著差異。
:::
## HTTPChallengePort
- 型別:`int`
- 預設值:`9180`
在獲取 Let's Encrypt 憑證時,此選項用於在 HTTP01 挑戰模式中設定後端監聽埠。HTTP01 挑戰是 Let's Encrypt
用於驗證您控制請求憑證的域的域驗證方法。
## Database
- 型別:`string`
- 預設值:`database`
此選項用於設定 Nginx UI 用於儲存其資料的 sqlite 資料庫的名稱。
## StartCmd
- 型別:`string`
- 預設值:`login`
此選項用於設定 Web 終端的啟動命令。
::: warning 警告
出於安全原因,我們將啟動命令設定為 `login`,因此您必須透過 Linux 的預設身份驗證方法登入。如果您不想每次訪問 Web
終端時都輸入使用者名稱和密碼進行驗證,請將其設定為 `bash``zsh`(如果已安裝)。
:::
## PageSize
- 型別:`int`
- 預設值10
此選項用於設定 Nginx UI 中列表分頁的頁面大小。調整頁面大小有助於更有效地管理大量資料,但是過大的數量可能會增加伺服器的壓力。
## CADir
- 型別:`string`
在申請 Let's Encrypt 憑證時,我們使用 Let's Encrypt 的預設 CA 位址。如果您需要除錯或從其他提供商獲取憑證,您可以將 CADir
設定為他們的位址。
::: tip 提示
請注意CADir 提供的位址需要符合 `RFC 8555` 標準。
:::
## GithubProxy
- 型別:`string`
- 建議:`https://ghproxy.com/`
對於可能在從 Github 下載資源時遇到困難的使用者(如在中國大陸),此選項允許他們為 github.com 設定代理,以提高可訪問性。

View file

@ -0,0 +1,11 @@
# 貢獻
貢獻使開源社群成為學習、啟發和創造的絕佳場所。我們**非常感謝**您所做的任何貢獻。
如果您有讓這個專案變得更強的建議,歡迎 fork 這個程式庫 (repository) 並建立一個 Pull Request。您也可以建立一個帶有 `enhancement` (加強)標籤的 Issue。最後不要忘記給我們的專案點個 Star再次感謝
1. Fork 專案
2. 建立您的分支 (`git checkout -b feature/AmazingFeature`)
3. 提交您的修改 (`git commit -m 'Add some AmazingFeature'`)
4. 推送到您的分支 (`git push origin feature/AmazingFeature`)
5. 建立一個 Pull Request

View file

@ -0,0 +1,120 @@
# 即刻開始
## 嘗試一下
您可以透過 [演示](https://demo.nginxui.com) 直接試用 Nginx UI。
- 使用者名稱admin
- 密碼admin
## 使用前注意
Nginx UI 遵循 Debian 的網頁伺服器配置檔案標準。建立的網站配置檔案將會放置於 Nginx
配置資料夾(自動檢測)下的 `sites-available` 中,啟用後的網站將會建立一份配置檔案軟連結檔到 `sites-enabled`
資料夾。您可能需要提前調整配置檔案的組織方式。
對於非 Debian (及 Ubuntu) 作業系統,您可能需要將 `nginx.conf` 配置檔案中的內容修改為如下所示的 Debian 風格。
```nginx
http {
# ...
include /etc/nginx/conf.d/*.conf;
include /etc/nginx/sites-enabled/*;
}
```
更多資訊請參閱:[debian/conf/nginx.conf](https://salsa.debian.org/nginx-team/nginx/-/blob/master/debian/conf/nginx.conf#L59-L60)
## 安裝
我們建議Linux使用者使用 [安裝指令碼](./install-script-linux),這樣您可以直接控制主機上的 Nginx。您也可以透過 [Docker 安裝](#使用-docker)
我們提供的映象包含 Nginx 並可以直接使用。對於高階使用者,您也可以在 [最新發行 (latest release)](https://github.com/0xJacky/nginx-ui/releases/latest)
中下載最新版本並 [透過執行檔案執行](#透過執行檔案執行),或者 [手動構建](./build)。
第一次執行 Nginx UI 時,請在瀏覽器中訪問 `http://<your_server_ip>:<listen_port>/install` 完成後續配置。
此外,我們提供了一個使用 Nginx 反向代理 Nginx UI 的 [示例](./nginx-proxy-example),您可在安裝完成後使用。
## 使用 Docker
您可以在 docker 中使用我們提供的 `uozi/nginx-ui:latest` [映像檔](https://hub.docker.com/r/uozi/nginx-ui)
,此映像檔基於 `nginx:latest` 構建。您可以直接將其監聽到 80 和 443 埠以取代宿主機上的 Nginx。
::: tip 提示
預設情況下Nginx UI 會被反向代理到容器的 `8080` 埠。
首次使用時,對映到 `/etc/nginx` 的目錄必須為空資料夾。
如果你想要託管靜態檔案,可以直接將資料夾對映入容器中。
:::
::: warning 警告
如果您想要管理主機上的 Nginx請選擇其他安裝方式。
如果您在使用 Linux我們建議使用 [安裝指令碼](./install-script-linux) 安裝。
:::
### Docker 部署示例
```bash
docker run -dit \
--name=nginx-ui \
--restart=always \
-e TZ=Asia/Shanghai \
-v /mnt/user/appdata/nginx:/etc/nginx \
-v /mnt/user/appdata/nginx-ui:/etc/nginx-ui \
-v /var/www:/var/www \
-p 8080:80 -p 8443:443 \
uozi/nginx-ui:latest
```
在這個示例中,容器的`8080`埠和`8443`埠分別映射到主機的`80`埠和`443`埠。
您需要訪問`http://<your_server_ip>`來訪問 Nginx UI。
## 透過執行檔案執行
不建議直接執行 Nginx UI 可執行檔案用於非測試目的。
我們建議在 Linux 上將其配置為守護程序或使用 [安裝指令碼](./install-script-linux)。
### 配置
```shell
echo '[server]\nHttpPort = 9000' > app.ini
```
::: tip 提示
在沒有 `app.ini` 時 Nginx UI 仍然可以啟動,它將使用預設偵聽埠 `9000`
:::
### 執行
::: code-group
```shell [終端]
nginx-ui -config app.ini
```
```shell [背景]
nohup ./nginx-ui -config app.ini &
```
:::
### 停止
::: code-group
```shell [終端]
^C # 按住 Ctrl+C
```
```shell [背景]
kill -9 $(ps -aux | grep nginx-ui | grep -v grep | awk '{print $2}')
```
:::

View file

@ -0,0 +1,109 @@
# 安裝指令碼
此 shell 指令碼僅適用於 Linux 作業系統。如果您使用的是其他作業系統,請參考 [快速入門](./getting-started) 指南進行手動安裝或使用 Docker。
## 安裝或升級
### `install.sh install`
安裝或更新 Nginx UI。
### 用法
```shell
install.sh install [OPTIONS]
```
### 選項
| 選項 | |
|-----------------------|---------------------------------------------------------------------------------------|
| `-l, --local <file>` | 從本地檔案安裝 Nginx UI (`string`) |
| `-p, --proxy <url>` | 透過代理伺服器下載 (`string`)<br/>例如:`-p http://127.0.0.1:8118``-p socks5://127.0.0.1:1080` |
| `-r, --reverse-proxy` | 透過反向代理伺服器下載 (`string`)<br/>例如:`-r https://ghproxy.com/` |
### 快速使用
```shell
bash <(curl -L -s https://raw.githubusercontent.com/0xJacky/nginx-ui/master/install.sh) install
```
安裝指令碼預設的監聽埠為 `9000`HTTP Challenge 埠預設為 `9180`。如果出現埠衝突請修改 `/usr/local/etc/nginx-ui/app.ini`
並使用 `systemctl restart nginx-ui` 重啟 Nginx UI 守護行程。更多有關資訊,請檢視 [配置參考](./config-server)。
## 解除安裝
### `install.sh remove`
解除安裝 Nginx UI。
### 用法
```shell
install.sh remove [OPTIONS]
```
### 選項
| 選項 | |
|-----------|---------------------------------------|
| `--purge` | 刪除所有 Nginx UI 檔案,包括日誌、配置等 (`boolean`) |
### 快速使用
::: code-group
```shell [移除]
# 解除安裝 Nginx UI 但保留配置和資料庫檔案
bash <(curl -L -s https://raw.githubusercontent.com/0xJacky/nginx-ui/master/install.sh) remove
```
```shell [清除]
# 解除安裝並刪除所有 Nginx UI 檔案,包括配置和資料庫檔案
bash <(curl -L -s https://raw.githubusercontent.com/0xJacky/nginx-ui/master/install.sh) remove --purge
```
:::
## 幫助
### `install.sh help`
顯示可用選項。
### 用法
```shell
install.sh help
```
### 快速使用
```shell
bash <(curl -L -s https://raw.githubusercontent.com/0xJacky/nginx-ui/master/install.sh) help
```
## 控制服務
透過此指令碼Nginx UI 將作為 `nginx-ui` 守護行程安裝在 systemd 中。請使用以下 `systemctl` 指令控制。
::: code-group
```shell [啟動]
systemctl start nginx-ui
```
```shell [停止]
systemctl stop nginx-ui
```
```shell [重啟]
systemctl restart nginx-ui
```
```shell [顯示狀態]
systemctl status nginx-ui
```
:::

View file

@ -0,0 +1,4 @@
# 開源許可
此專案基於 GNU Affero Public License v3.0 (AGPLv3)
許可,請參閱 [LICENSE](https://github.com/0xJacky/nginx-ui/blob/master/LICENSE) 檔案。透過使用、分發或對本專案做出貢獻,表明您已同意本許可證的條款和條件。

View file

@ -0,0 +1,57 @@
# Nginx 反向代理示例
在本指南中,我們將引導您配置 Nginx 伺服器以將 HTTP 流量重定向到 HTTPS併為監聽在 `http://127.0.0.1:9000/` 上的 Nginx UI
設定反向代理。
```nginx
server {
listen 80;
listen [::]:80;
server_name <your_server_name>;
rewrite ^(.*)$ https://$host$1 permanent;
}
map $http_upgrade $connection_upgrade {
default upgrade;
'' close;
}
server {
listen 443 ssl http2;
listen [::]:443 ssl http2;
server_name <your_server_name>;
ssl_certificate /path/to/ssl_cert;
ssl_certificate_key /path/to/ssl_cert_key;
location / {
proxy_set_header Host $host;
proxy_set_header X-Real-IP $remote_addr;
proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
proxy_set_header X-Forwarded-Proto $scheme;
proxy_http_version 1.1;
proxy_set_header Upgrade $http_upgrade;
proxy_set_header Connection $connection_upgrade;
proxy_pass http://127.0.0.1:9000/;
}
}
```
配置檔案包括兩個 Nginx 伺服器塊。第一個伺服器塊偵聽 80 埠HTTP並將所有傳入的 HTTP 請求重定向到 HTTPS。它還監聽 IPv6
地址。將 `<your_server_name>` 替換為您的伺服器名稱。
第二個伺服器塊監聽 443 埠HTTPS以及 HTTP/2 協議。同樣,它也監聽 IPv6 地址。將 `<your_server_name>` 替換為您的伺服器名稱,並將
SSL 證書和金鑰的路徑替換為 `/path/to/ssl_cert``/path/to/ssl_cert_key`
::: warning 警告
為了避免在 Nginx v1.24+ 版本中出現警告,我們需要刪除 `listen 443 ssl http2;``listen [::]:443 ssl http2;`
中的 `http2` 指令,因為 `ssl` 指令預設支援 `http2`
:::
此外,配置包括一個 `map` 指令,用於根據 `$http_upgrade` 變數設定 `$connection_upgrade` 變數的值,該變數用於 WebSocket 連線。
在第二個伺服器塊中,`location /` 部分包含代理設定,將請求轉發到本地埠 `9000`
。代理設定還包括一些用於正確處理轉發請求的信頭,如 `Host``X-Real-IP``X-Forwarded-For``X-Forwarded-Proto``Upgrade`
`Connection`

View file

@ -0,0 +1,86 @@
# 專案結構
## 根目錄
```
.
├─ docs # 手冊資料夾
├─ cmd # 命令列工具
├─ frontend # 使用 Vue 3 構建的前端
├─ server # 使用 Golang 構建的後端
├─ resources # 其他資源,不參與構建
├─ template # 用於 Nginx 的模板檔案
├─ app.example.ini # 配置檔案的示例
├─ main.go # 伺服器入口
└─ ...
```
## 手冊資料夾
```
.
├─ docs
│ ├─ .vitepress # 配置資料夾
│ │ ├─ config
│ │ └─ theme
│ ├─ public # 資源
│ ├─ [language code] # 翻譯,資料夾名為語言程式碼,例如 zh_CN, zh_TW
│ ├─ guide
│ │ └─ *.md # 手冊 markdown 檔案
│ └─ index.md # 首頁 markdown 檔案
└─ ...
```
## 前端
```
.
├─ frontend
│ ├─ public # 公共資源
│ ├─ src # 原始碼
│ │ ├─ api # 向後端發起請求的 API
│ │ ├─ assets # 公共資源
│ │ ├─ components # Vue 元件
│ │ ├─ language # 翻譯,使用 vue3-gettext
│ │ ├─ layouts # Vue 佈局
│ │ ├─ lib # 庫檔案,如幫助函式
│ │ ├─ pinia # 狀態管理
│ │ ├─ routes # Vue 路由
│ │ ├─ views # Vue 檢視
│ │ ├─ gettext.ts # 定義翻譯
│ │ ├─ style.less # 全域性樣式,使用 less 語法
│ │ ├─ dark.less # 暗黑主題樣式,使用 less 語法
│ │ └─ ...
│ └─ ...
└─ ...
```
## 後端
```
.
├─ server
│ ├─ internal # 內部包
│ │ └─ ...
│ ├─ api # 向前端提供的 API
│ ├─ model # 自動生成的模型
│ ├─ query # gen 自動生成的資料庫請求檔案
│ ├─ router # 路由和中介軟體
│ ├─ service # 服務檔案
│ ├─ settings # 配置介面
│ ├─ test # 單元測試
│ └─ ...
├─ main.go # 後端入口
└─ ...
```
## 模板
```
.
├─ template
│ ├─ block # Nginx 塊配置模板
│ ├─ conf # Nginx 配置模板
│ └─ template.go # 嵌入模板檔案至後端
└─ ...
```

56
docs/zh_TW/index.md Normal file
View file

@ -0,0 +1,56 @@
---
# https://vitepress.dev/reference/default-theme-home-page
layout: home
title: Nginx UI
titleTemplate: Yet another Nginx Web UI
hero:
name: "Nginx UI"
text: "Nginx 管理介面新選擇"
tagline: 簡單、強大、高速
image:
src: /assets/icon.svg
alt: Nginx UI
actions:
- theme: brand
text: 即刻開始
link: /zh_CN/guide/about
- theme: alt
text: 在 Github 上檢視
link: https://github.com/0xJacky/nginx-ui
features:
- icon: 📊
title: 線上檢視伺服器指標
details: 實時監控伺服器 CPU、記憶體、系統負載、磁碟使用率等指標。
- icon: 💬
title: 線上 ChatGPT 助理
details: 在介面內直接使用 AI 強化的 ChatGPT 助手。
- icon: 🖱️
title: 一鍵部署和自動續簽
details: 一鍵輕鬆部署並自動續簽 Let's Encrypt 證書。
- icon: 🛠️
title: 線上編輯網站配置
details: 使用 NgxConfigEditor 區塊編輯器或支援 Nginx 配置語法高亮的 Ace Code 編輯器編輯配置。
- icon: 📜
title: 線上檢視 Nginx 日誌
details: 線上直接訪問和檢視 Nginx 日誌。
- icon: 💻
title: 使用 Go 和 Vue 編寫
details: 使用 Go 和 Vue 構建,發行版本為單個可執行的二進位制檔案。
- icon: 🔄
title: 自動測試和過載配置
details: 儲存更改後自動測試配置檔案並重載 Nginx。
- icon: 🖥️
title: 網路終端
details: 輕鬆管理的基於網路瀏覽器的高階命令列終端。
- icon: 🌙
title: 深色模式
details: 開啟深色模式,享受舒適的使用者體驗。
- icon: 📱
title: 自適應網頁設計
details: 透過自適應網頁設計在任何裝置上享受無縫體驗。
---