This content is generated by the Shiro API and may have formatting issues. For the best experience, please visit:https://n1cat.xyz/posts/linux/radmin

127.0.0.1:25565:25565/tcp

environment:
  USER_PORTS: "7148,25565"

ports:
  - 127.0.0.1:25565:25565/tcp
  - 127.0.0.1:47270:8006
  - 127.0.0.1:47280:7148
  - 127.0.0.1:47290:7149
  - 127.0.0.1:47300:3389/tcp
  - 127.0.0.1:47310:3389/udp

restart: unless-stopped

Set-Service iphlpsvc -StartupType Automatic
Start-Service iphlpsvc

netsh interface portproxy delete v4tov4 listenaddress=0.0.0.0 listenport=25565
netsh interface portproxy add v4tov4 listenaddress=0.0.0.0 listenport=25565 connectaddress=26.46.97.252 connectport=14514
netsh interface portproxy show all

Test-NetConnection 26.46.97.252 -Port 14514

ComputerName     : 26.46.97.252
RemoteAddress    : 26.46.97.252
RemotePort       : 14514
InterfaceAlias   : Radmin VPN
SourceAddress    : 26.39.180.254 <- 這是你自己的
TcpTestSucceeded : True

Finished reading? Leave a comment

This content is generated by the Shiro API and may have formatting issues. For the best experience, please visit:https://n1cat.xyz/posts/default/osu

Finished reading? Leave a comment

前言

你是否也遇過這種令人抓狂的場景？在 Arch Linux + Wayland 的新潮環境下，你的 Fcitx5 輸入法在 Chrome、Kitty、系統 UI 中都運作得完美無瑕，但唯獨在打開 Discord、VSCode 或是 Obsidian 這些軟體時，它卻像罷工一樣，無論怎麼切換都毫無反應。

如果你已經在網路上爬文許久，試過了修改 .desktop 啟動器、檢查了無數次的環境變數 (GTK_IM_MODULE, XMODIFIERS)，甚至開始懷疑人生，那麼這篇文章就是為你準備的。

::: warning 前情提要： 這篇文章假設你已經在 Wayland 環境下正確設定了 Fcitx5 的基本環境變數，並且它在大多數 GTK/Qt 應用中是可以正常運作的。我們的目標是解決那些特例軟體。 :::

核心概念：問題不在你的設定，在於 Wayland 的「原生模式」

在深入解決方案之前，我們必須先理解問題的根源。過去在 X11 環境下，輸入法的問題通常圍繞在 XMODIFIERS 這個環境變數上。但到了 Wayland，事情變得有些不同。

應用程式在 Wayland 環境下有兩種執行模式：

1. 原生 Wayland 模式：應用程式直接使用 Wayland 協定進行繪圖和輸入，這是最理想的模式。
2. XWayland 模式：這是一個相容性層，讓那些尚未支援 Wayland 的傳統 X11 應用程式也能在 Wayland 環境下執行。

問題就出在，Discord、VSCode 這些軟體背後的框架 Electron，在新版本中會預設以「原生 Wayland 模式」啟動。然而，Electron 對 Wayland 原生輸入法協定的支援一直以來都非常糟糕，導致它根本無法和 Fcitx5 正常溝通。

這也解釋了為什麼你之前嘗試的所有方法都失敗了：

• 修改 XMODIFIERS：這個變數是 X11/XWayland 的產物。當 Discord 以原生 Wayland 模式執行時，它會完全忽略這個變數。
• 設定 GTK_IM_MODULE：Electron 並非標準的 GTK 應用，它有自己的一套邏輯，因此這些變數對它的影響有限。

最終解決方案：強制使用 XWayland

既然問題的根源是不完善的「原生 Wayland 模式」，那麼最直接、最有效的解決方法就是——強制這些 Electron 應用退回使用相容性更好的 XWayland 模式來執行。

只要回到 XWayland 的世界，我們熟悉的規則就會再次生效，Fcitx5 也能夠順利接管輸入。而實現這一點的關鍵，就是透過一個全域設定檔。

操作步驟：一勞永逸的 electron-flags.conf

相比於去修改每一個應用程式的 .desktop 啟動器（這種方式不僅繁瑣，還可能在軟體更新後被覆蓋），直接建立一個 Electron 的全域設定檔是更優雅、更徹底的做法。

1. 開啟你的終端機： 沒錯，一切的起點。

2. 建立並編輯設定檔： 使用你喜歡的編輯器，建立或打開 ~/.config/electron-flags.conf 這個檔案。

   nano ~/.config/electron-flags.conf
   

3. 加入關鍵參數： 在檔案中，只需要加入下面這一行文字。這個參數會告訴所有讀取此設定檔的 Electron 應用：「請使用 X11 後端來啟動」，在 Wayland 環境下，這就等同於強制使用 XWayland。

   --ozone-platform=x11
   

4. 儲存並重啟應用： 儲存檔案後，完全退出你的 Discord、VSCode 或其他有問題的 Electron 應用（記得檢查系統匣，確保它們徹底關閉）。

   現在，重新打開它們，你會驚喜地發現，消失已久的 Fcitx5 輸入法視窗終於回來了！

WARNING

這個設定是全域性的。它會影響到你系統上所有會讀取此設定檔的 Electron 應用。不過在絕大多數情況下，這正是我們想要的效果，因為它解決的是一類問題，而不是單一一個軟體的問題。

總結

讓我們快速回顧一下這個「終極療法」的流程：

1. 問題分析：Electron 應用預設使用不完善的「原生 Wayland 模式」，導致輸入法失效。
2. 解決思路：建立一個全域設定檔，強制所有 Electron 應用退回相容性更好的「XWayland 模式」。
3. 核心操作：在 ~/.config/electron-flags.conf 檔案中加入 --ozone-platform=x11。
4. 享受成果：重新啟動應用，享受在所有軟體中都能流暢輸入的便利！

這是一個非常簡單卻極其有效的技巧，希望能幫助你在 Wayland 的道路上走得更順暢。

::: error 本文有些許錯誤尚未修改 :::

前言

想在 Windows 上學習 C++，卻被複雜的環境設定搞得頭昏腦脹嗎？相較於 Visual Studio 整個大型 IDE，許多人更偏好使用輕量、高彈性的 Visual Studio Code (VS Code) 來打造自己的開發環境。

本文件旨在引導你完成在 Windows 系統上，從零開始，一步步建立一個現代化的 C++ 開發環境。我們將使用目前最主流的組合：VS Code 作為程式碼編輯器，搭配 MinGW-w64 作為編譯器工具鏈。

::: warning 前情提要： 這篇文章假設你的電腦是 Windows 10 或 Windows 11 作業系統，並且你已準備好跟著步驟從頭開始。我們將會安裝所有需要的軟體，無需任何先前經驗。 :::

核心概念：我們到底在做什麼？

在開始動手前，先花一分鐘了解我們要安裝的三個核心元件，這會讓整個流程變得更清晰：

1. 程式碼編輯器 (Code Editor) - Visual Studio Code

   • 這就是我們寫程式碼的地方。它本身只是個聰明的記事本，提供了語法高亮、自動補全等功能，但它並不知道如何將你的 C++ 程式碼變成可執行的 .exe 檔案。

2. 編譯器 (Compiler) - MinGW-w64 (g++)

   • 這是最重要的工具。編譯器的工作就是把你寫的 C++ 原始碼（人類看得懂的文字）翻譯成電腦看得懂的機器碼，並打包成一個 .exe 執行檔。我們選擇 MinGW-w64，它讓我們可以在 Windows 上使用強大的 GCC (GNU Compiler Collection) 工具集。

3. 偵錯器 (Debugger) - GDB

   • 當你的程式碼出錯時，偵錯器是你最好的朋友。它能讓你一行一行地執行程式，觀察變數的變化，揪出躲在細節裡的魔鬼。GDB 會跟著 MinGW-w64 一起被安裝。

簡單來說，我們就是要安裝並設定好這三樣工具，並讓它們在 VS Code 裡完美協作。

操作步驟：

Part 1: 安裝 Visual Studio Code

這是最簡單的一步。

1. 前往 VS Code 的官方網站。
2. 點擊大大的下載按鈕，下載適用於 Windows 的穩定版。
3. 執行安裝檔。在安裝過程中，請確保勾選了「新增到 PATH (需要重新啟動後生效)」這個選項，這會讓你之後在終端機操作更方便。其他選項保持預設即可。

Part 2: 安裝 MinGW-w64 編譯器與設定環境變數

這是最關鍵也最容易出錯的一步，請務必仔細操作。

1. 下載 MinGW-w64：

   • 為了避免從複雜的官方頁面中尋找，我們推薦從 WinLibs 這個網站下載獨立的 MinGW-w64 發行版。它打包完整且無需安裝。
   • 前往 WinLibs 網站，找到最新的 UCRT runtime 版本的 "Win64" 發行版，並下載 ZIP 壓縮檔。

2. 解壓縮檔案：

   • 將下載下來的 ZIP 檔解壓縮。為了方便管理，建議你將解壓縮後的 mingw64 資料夾，直接放到一個路徑單純且不包含中文或空格的地方，例如 C:\mingw64。

3. 設定 PATH 環境變數：

   • 這是為了讓系統在任何地方都能找到 g++.exe 這個編譯器指令。
   • 在 Windows 搜尋列中輸入「編輯系統環境變數」並開啟它。
   • 在跳出的視窗中，點擊「環境變數」。
   • 在下方的「系統變數」區塊中，找到名為 Path 的變數，點選它，然後按「編輯」。
   • 點擊「新增」，然後將你剛剛解壓縮的 MinGW-w64 資料夾中的 bin 資料夾路徑貼上去。例如，如果你是放在 C:\mingw64，那這裡就要新增 C:\mingw64\bin。
   • 一路點擊「確定」關閉所有設定視窗。

4. 驗證安裝：

   • 完全關閉所有已開啟的終端機或 PowerShell 視窗，然後重新開啟一個新的。
   • 在終端機中，分別輸入以下兩個指令並按下 Enter： bash g++ --version gdb --version
   • 如果你能看到類似下圖的版本號碼訊息，而沒有出現「不是內部或外部命令」的錯誤，那就代表編譯器和偵錯器已經成功安裝並設定好了！

Part 3: 設定 VS Code 延伸模組

讓 VS Code 變身為強大 C++ IDE 的最後一步。

1. 打開 VS Code。
2. 點擊左側邊欄的延伸模組圖示 (像四個方塊的那個)。
3. 在搜尋框中輸入 C/C++，並安裝由 Microsoft 官方提供的「C/C++ Extension Pack」。它會幫我們裝好智慧提示 (IntelliSense)、偵錯等所有需要的功能。

你的第一個 C++ 程式：Hello, World!

環境都準備好了，讓我們來實際跑一個程式，並完成最後的編譯設定。

1. 建立專案資料夾： 在電腦上找個喜歡的地方，建立一個新的資料夾，例如 CppProjects，然後在裡面再建立一個名為 HelloWorld 的資料夾。

2. 用 VS Code 開啟資料夾： 在 VS Code 中，選擇「檔案」>「開啟資料夾...」，然後選擇你剛剛建立的 HelloWorld 資料夾。

3. 建立原始碼檔案： 在 VS Code 左側的檔案總管中，點擊新增檔案的圖示，並將檔案命名為 main.cpp。

4. 撰寫程式碼： 將以下經典的 "Hello, World!" 程式碼貼到 main.cpp 中。

   #include <iostream>
   
   int main() {
       std::cout << "Hello, C++ World!" << std::endl;
       return 0;
   }
   

5. 設定編譯與偵錯任務 (關鍵步驟)：

   • 按下 F5 鍵，這會觸發 VS Code 的偵錯功能。
   • 此時，VS Code 會在上方跳出一個選單，詢問你使用哪個環境。請選擇「C++ (GDB/LLDB)」。
   • 接著，它會再問你要使用哪個編譯器設定。選擇「g++.exe ... build and debug active file」。
   • 完成後，VS Code 會自動在你的資料夾中建立一個 .vscode 資料夾，並在裡面產生 tasks.json 和 launch.json 兩個設定檔。同時，你會看到下方的終端機開始執行編譯，並成功輸出 "Hello, C++ World!"。

WARNING

VS Code 自動產生的這兩個 JSON 檔案，就是告訴它如何呼叫 g++ 來編譯你的程式 (tasks.json)，以及如何啟動 gdb 來偵錯編譯好的程式 (launch.json)。對於初學者來說，通常不需要手動修改它們。

總結

讓我們快速回顧一次整個流程：

1. 安裝 VS Code，並記得勾選加入 PATH。
2. 下載並解壓縮 MinGW-w64 到一個簡單的路徑 (如 C:\mingw64)。
3. 設定系統環境變數 Path，將 MinGW-w64 的 bin 資料夾路徑加進去，並在終端機用 g++ --version 驗證。
4. 在 VS Code 中安裝 Microsoft 官方的 C/C++ 延伸模組包。
5. 建立你的第一個 .cpp 檔案，按下 F5，讓 VS Code 自動產生編譯與偵錯設定。

恭喜你！你已經成功在 Windows 上搭建了一個輕量、高效且功能完整的 C++ 開發環境。現在，開始你的 C++ 學習之旅吧！

前言

本文件旨在說明如何透過 ssh-copy-id 這個方便的指令，將你的 SSH 公鑰快速且安全地部署到遠端的 VPS 或伺服器上。從此以後，你就可以擺脫每次登入都要輸入密碼的繁瑣步驟，實現更安全、更有效率的免密碼登入。

::: warning 前情提要： 這篇文章假設你已經在你的本機（例如你的筆電或桌機）上產生了 SSH 金鑰對（id_rsa 和 id_rsa.pub）。如果還沒有，可以先透過 ssh-keygen -t rsa 指令來產生。 :::

核心概念

ssh-copy-id 的核心工作非常單純：它會讀取你本機的公鑰檔案（預設是 ~/.ssh/id_rsa.pub），然後透過 SSH 連線到遠端主機，並將公鑰內容自動附加到遠端主機使用者家目錄下的 ~/.ssh/authorized_keys 檔案中。

這個指令最大的好處是，它會自動處理好遠端 .ssh 目錄和 authorized_keys 檔案的權限設定，避免了手動複製貼上時，因為權限錯誤（例如 777 或 644）而導致金鑰驗證失敗的問題。

操作步驟：

1. 準備環境： 你需要一台網路正常的遠端 VPS 或主機，並且你目前能夠透過密碼的方式以 SSH 登入。

2. 開啟你的終端機： 在你的本機上打開終端機（Terminal、iTerm、Windows Terminal 等）。

3. 執行 ssh-copy-id 指令： 這是最關鍵的一步。指令的格式非常簡單：

   # 基本語法
   # ssh-copy-id [遠端使用者名稱]@[遠端主機IP或網域]
   
   # 實際範例
   ssh-copy-id root@123.123.123.123
   

4. 輸入密碼並完成驗證： 執行指令後，系統會提示你輸入遠端主機的登入密碼。

   /usr/bin/ssh-copy-id: INFO: attempting to log in with the new key(s), to filter out any that are already installed
   /usr/bin/ssh-copy-id: INFO: 1 key(s) remain to be installed -- if you are prompted now it is to install the new keys
   root@123.123.123.123's password:
   

   請在這裡輸入密碼。這將是你最後一次需要為這台主機輸入密碼。成功後，你會看到類似以下的訊息：

   Number of key(s) added: 1
   
   Now try logging into the machine, with:   "ssh 'root@123.123.123.123'"
   and check for:
   
     .ssh/authorized_keys
   
   to make sure we haven't added extra keys that you weren't expecting.
   

   這就代表你的公鑰已經成功安裝上去了！

5. 測試免密碼登入： 現在，嘗試直接登入你的遠端主機，看看是否還需要密碼。

   ssh root@123.123.123.123
   

   如果一切順利，你應該會直接登入成功，不會再被要求輸入密碼。

進階技巧與注意事項

WARNING

如果你的公鑰檔案不是預設的路徑（~/.ssh/id_rsa.pub），或是你想要指定使用某個特定的公鑰，你可以使用 -i 參數來指定公鑰檔案的路徑。

# 範例：使用名為 my_vps_key.pub 的公鑰
ssh-copy-id -i ~/.ssh/my_vps_key.pub user@your_server_ip

總結

使用 ssh-copy-id 的流程如下：

1. 確保本機已有 SSH 金鑰對。
2. 在本機終端機執行 ssh-copy-id [使用者]@[主機IP]。
3. 輸入最後一次的登入密碼。
4. 享受無密碼登入的便利！

這是一個非常簡單卻極其有用的指令，強烈建議所有管理伺服器的人都學會使用它。

前言

本文件旨在詳細說明如何使用 Discord.js v14 中引入的新版訊息元件 (Components V2)。這些新元件提供了比以往更豐富、更具結構性的訊息排版能力。

核心概念

新版元件的核心是 容器 (Container)，所有其他元件都必須被包裹在一個頂層容器中。這與傳統的 ActionRow 有所不同，提供了更大的排版自由度。

1. 啟用 V2 Components

要使用新版元件，最關鍵的一步是在 interaction.reply 中設定 flags 屬性。如果沒有這個旗標，Discord 將會回退到舊版的 Components，導致顯示錯誤或完全不顯示。

import { MessageFlags } from "discord.js";

await interaction.reply({
  // ... 其他選項
  flags: MessageFlags.IsComponentsV2,
});

組合多個旗標

如果您需要同時使用多個旗標（例如，同時啟用 V2 Components 並將訊息設為臨時訊息），您可以使用位元「或」運算子 (|) 來組合它們。

import { MessageFlags } from "discord.js";

await interaction.reply({
  // ... 其他選項
  flags: MessageFlags.IsComponentsV2 | MessageFlags.Ephemeral,
});

這樣，回覆的訊息將只對發送該指令的使用者可見。

2. 元件建構器 (Builders)

以下是 Components V2 中常用的各種建構器。

主容器 ContainerBuilder

所有 V2 元件都必須放在一個 ContainerBuilder 實例中。您可以把它想像成一個包裹所有內容的頂層容器。

ContainerBuilder 也可以設定一些排版屬性，例如使用 .setAccentColor() 方法來設定左側的強調色。

方法一：手動加入元件 (如範例所示)

import { ContainerBuilder, TextDisplayBuilder } from "discord.js";

const container = new ContainerBuilder();
const title = new TextDisplayBuilder().setContent("# 這是標題");

// 將元件實例按順序 push 到 container.components 陣列中
container.components.push(title);

方法二：使用鏈式方法 (官方文件風格)

ContainerBuilder 提供了一系列 .add...Components() 的方法，讓您可以用鏈式呼叫的方式加入元件，程式碼更簡潔。

import { ContainerBuilder, UserSelectMenuBuilder } from 'discord.js';

const exampleContainer = new ContainerBuilder()
    .setAccentColor(0x0099FF)
    .addTextDisplayComponents(
        textDisplay => textDisplay
            .setContent('這是一個文字元件！')
    )
    .addActionRowComponents(
        actionRow => actionRow
            .setComponents(
                new UserSelectMenuBuilder()
                    .setCustomId('exampleSelect')
                    .setPlaceholder('選擇使用者'),
            ),
    );

基礎內容元件

• TextDisplayBuilder: 用於顯示文字內容，支援 Markdown 語法。您可以把它當作一個文字區塊。
• MediaGalleryBuilder: 用於顯示圖片或媒體。您可以加入多個媒體項目來建立一個畫廊。
• SeparatorBuilder: 用於在元件之間加入一條分隔線或間距，讓排版更清晰。
• ActionRowBuilder: 與舊版相似，用於放置按鈕 (ButtonBuilder)、選單 (StringSelectMenuBuilder) 等互動元件。

進階內容元件

SectionBuilder (區塊元件)

SectionBuilder 是一個強大的元件，它本身可以容納最多三個 TextDisplay 元件，並且可以在右側附加一個「配件 (Accessory)」。

配件 (Accessory) 可以是：

• 一個按鈕 (ButtonBuilder)
• 一個縮圖 (ThumbnailBuilder)

範例：帶有按鈕配件的 Section

import { SectionBuilder, ButtonStyle, MessageFlags } from 'discord.js';

const exampleSection = new SectionBuilder()
    .addTextDisplayComponents(
        textDisplay => textDisplay.setContent('這是一個 Section 元件。'),
        textDisplay => textDisplay.setContent('它可以包含多個文字區塊。')
    )
    .setButtonAccessory(
        button => button
            .setCustomId('exampleButton')
            .setLabel('Section 裡的按鈕')
            .setStyle(ButtonStyle.Primary),
    );

await channel.send({
    components: [exampleSection],
    flags: MessageFlags.IsComponentsV2,
});

FileBuilder (檔案元件)

用於在訊息中直接嵌入一個上傳的檔案。

import { AttachmentBuilder, FileBuilder, MessageFlags } from 'discord.js';

// 先建立一個附件
const file = new AttachmentBuilder('./assets/guide.pdf');

const exampleFile = new FileBuilder()
    // 這裡的 URL 必須對應到附件的名稱
    .setURL('attachment://guide.pdf');

await channel.send({
    components: [exampleFile],
    files: [file], // 同時發送檔案
    flags: MessageFlags.IsComponentsV2,
});

完整程式碼範例

這個範例改編自 src/commands/coyote.ts，展示了如何結合使用上述多種元件來建立一個複雜的訊息。

import {
  ActionRowBuilder,
  ButtonBuilder,
  ButtonStyle,
  CommandInteraction,
  ContainerBuilder,
  SeparatorBuilder,
  TextDisplayBuilder,
  MediaGalleryBuilder,
} from "discord.js";
import { MessageFlags } from "discord.js";
import { Discord, Slash } from "discordx";

@Discord()
export class Coyote {
  @Slash({
    description: "Shows a wild coyote.",
    name: "coyote",
    integrationTypes: [0, 1],
    contexts: [0, 1, 2],
  })
  async coyote(interaction: CommandInteraction): Promise<void> {
    // 1. 建立主容器並設定顏色
    const container = new ContainerBuilder().setAccentColor(703487);

    // 2. 建立各種內容元件
    const separator = new SeparatorBuilder();
    const title = new TextDisplayBuilder().setContent("# 小男娘鑑定工作！");
    const text = new TextDisplayBuilder().setContent("你是小男娘嗎?");
    const image = new MediaGalleryBuilder().addItems({
      media: { url: "https://db.nlcat.dpdns.org/GrD8cqtbwAI2DNN.jpg" },
    });

    // 按鈕列
    const row = new ActionRowBuilder<ButtonBuilder>().addComponents(
      new ButtonBuilder()
        .setCustomId("pet_coyote")
        .setLabel("對")
        .setStyle(ButtonStyle.Primary),
      new ButtonBuilder()
        .setCustomId("feed_coyote")
        .setLabel("沒錯")
        .setStyle(ButtonStyle.Secondary),
      new ButtonBuilder()
        .setCustomId("run_away")
        .setLabel("是")
        .setStyle(ButtonStyle.Danger)
    );

    // 3. 將所有元件按照期望的順序加入容器中
    container.components.push(title, separator, image, separator, text, row);

    // 4. 回覆互動，並啟用 V2 Components
    await interaction.reply({
      components: [container], // 將主容器傳入 components
      flags: MessageFlags.IsComponentsV2 | MessageFlags.Ephemeral,
    });
  }
}

進階技巧

修改已接收的元件

從 API 收到的元件是不可變的。若要修改它（例如，在使用者點擊按鈕後禁用該按鈕），您必須使用 ComponentBuilder.from() 靜態方法來建立一個可變的建構器實例。

- const editedButton = receivedButton
-   .setDisabled(true);

+ import { ButtonBuilder } from 'discord.js';
+ const editedButton = ButtonBuilder.from(receivedButton)
+   .setDisabled(true);

總結

使用新版 Components V2 的流程如下：

1. 建立一個 ContainerBuilder 或其他頂層元件 (如 SectionBuilder)。
2. 建立所有你需要的內容元件 (TextDisplayBuilder, ActionRowBuilder 等)。
3. 將這些元件實例按順序加入到容器中 (可使用 .push() 或鏈式方法)。
4. 在 interaction.reply 中，將元件陣列作為 components 的值，並務必加上 flags: MessageFlags.IsComponentsV2。

::: warning 本文尚在更新 未完成 ::: ::: warning 前情提要:
這裡使用的是 Docker + cloudflared tunnel，採取前後端分離的方式，因此有很多不同的使用方法。
你可以選擇：

• 自架後端（使用 Docker）+ 前端部署於 Vercel（這部分會在文末說明）
• 自架後端（使用 Docker）+ 前端也放同台機器裡面 （使用 Docker） :::

Docker 部署

英文版本可參考：
https://github.com/956zs/Shiro
如果有未翻譯的部分，歡迎發 PR ><
中文版本可以參考：
https://github.com/Innei/Shiro

前端shiro 主題部署步驟：

1. 準備環境：
   你需要一台網路正常的 VPS 或是一台酷酷的主機，並確保其能夠正常運行 Docker 。

2. 安裝 Docker：
   首先，必須安裝 Docker。需要注意的是，即使你的 Docker 版本已經是較新的（例如 20.x 或更高版本），docker-compose 可能並未隨 Docker 一起安裝。
   從 Docker 1.27.0 版本開始，docker compose 被集成到了 Docker CLI 中，作為子命令來使用。但如果你的 Docker 版本未自動包含這個更新，則需要額外安裝 docker compose。
   確保 Docker 版本為 1.27.0 或以上，並安裝對應版本的 docker compose，以便順利使用此工具。
   hint： docker compose ≠ docker-compose

------------------------------------------------------------------------------------------------------------------------

• 4/25更: 前天剛轉移完資料 對於docker compose 安裝頗有心得 之後會寫一篇來講安裝會遇到的事

------------------------------------------------------------------------------------------------------------------------

4. 建置 Docker 容器：
   環境安裝完成後，就可以開始建置 Docker 容器了。以下是具體步驟：

   mkdir shiro
   cd shiro
   wget https://raw.githubusercontent.com/956zs/Shiro/main/docker-compose.yml
   wget https://raw.githubusercontent.com/956zs/Shiro/main/.env.template
   
   vim .env # 修改環境變數
   docker compose up -d # 啟動並在背景運行Docker
   
   # 更新操作
   docker compose pull # 用於更新（包括 env 配置或 Docker image）
   

   先來講講.env要改什麼內容
   這是原本的

NEXT_PUBLIC_API_URL=http://127.0.0.1:2333/api/v2
NEXT_PUBLIC_GATEWAY_URL=http://127.0.0.1:2333
NEXT_PUBLIC_API_URL=https://innei.ren/api/v2
NEXT_PUBLIC_GATEWAY_URL=https://api.innei.ren

TMDB_API_KEY=
GH_TOKEN=

NEXT_PUBLIC_API_URL : 這個是後端網址加上/api/v2
NEXT_PUBLIC_GATEWAY_URL: 這個是後端網址就好
然後如果兩個都部屬在同一台機器上的話 可以使用localhost 但我自己是遇到了像是
https://github.com/Innei/Shiro/issues/523
圖一的問題

WARNING

這裡要注意的是 這邊所有網址的結尾都不要加/不然websocket或著是其他的API很有可能會壞掉