VPS 雲端部署 ui2code

以下是如何在 Nginx 網頁伺服器上部署 OpenAI ui2code 的指南：

---

1. 準備環境

更新系統套件：

$sudo apt update && sudo apt upgrade -y

安裝 Python 和 Pip： 如果尚未安裝 Python 和 Pip，執行以下指令：

$sudo apt install python3 python3-pip -y

安裝 Virtualenv（可選但建議）：

$pip3 install virtualenv

---

2. 設定 Streamlit 應用

取得你的 Streamlit 應用程式碼： 如果程式碼存放於 Git 倉庫：

$git clone https://github.com/aitwg/openai-ui2code.git
$cd openai-ui2code

建立虛擬環境：

$virtualenv venv
$source venv/bin/activate

安裝依賴套件：

$pip install -r requirements.txt

本地測試應用： 確保應用程式可以正常運行：

$streamlit run app.py

---

3. 配置 Streamlit 為生產環境

修改 Streamlit 的設定檔： 建立或編輯 ~/.streamlit/config.toml：

$mkdir -p ~/.streamlit/
$nano ~/.streamlit/config.toml

在檔案中新增以下內容：

[server]
headless = true
enableCORS = false
port = 8501

設定 Systemd 服務（可選，但推薦）： 建立一個 Systemd 服務檔案：

$sudo nano /etc/systemd/system/streamlit.service

新增以下內容：

[Unit]

Description=Streamlit App
After=network.target
[Service]
User=你的用戶名
WorkingDirectory=/path/to/your/app
ExecStart=/path/to/your/venv/bin/streamlit run app.py
Restart=always
[Install]
WantedBy=multi-user.target

將 /path/to/your/app 和 /path/to/your/venv 替換為應用的實際路徑。
啟用並啟動服務：

$sudo systemctl enable streamlit.service
$sudo systemctl start streamlit.service

---

4. 安裝並配置 Nginx

新增 Nginx 配置檔：

$sudo nano /etc/nginx/sites-available/streamlit

在檔案中新增以下內容：

server {
listen 80;

    server_name yourdomain.com;

    location / {

        proxy_pass http://localhost:8501;

        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;

    }

}

啟用站點並重新啟動 Nginx：

$sudo ln -s /etc/nginx/sites-available/streamlit /etc/nginx/sites-enabled/
$sudo nginx -t
$sudo systemctl restart nginx

---

5. （可選）為應用設定 HTTPS