一、準備工作

1、連接服務器

通過 SSH 工具（如 Putty、Xshell 或終端命令）連接到 Ubuntu 服務器：

ssh username@服務器IP地址

2、更新系統

確保系統軟件包為最新版本：

sudo apt update && sudo apt upgrade -y

二、安裝 Node.js 環境

1、安裝 Node.js 官方 PPA（用于獲取最新穩定版）：

curl -sL https://deb.nodesource.com/setup_lts.x | sudo -E bash -

2、安裝 Node.js 和 npm（LTS 長期支持版本）：

sudo apt install -y nodejs

3、驗證安裝：

node -v    # 查看 Node.js 版本（如 v16.xx.x）
npm -v     # 查看 npm 版本

三、部署 Node.js 應用

1. 準備應用代碼

創建項目目錄（如 /var/www/node-app）：

sudo mkdir -p /var/www/node-app
sudo chown -R $USER:$USER /var/www/node-app  # 賦予當前用戶權限

將本地代碼上傳至服務器（可通過 scp 或 FTP 工具）：

scp -r 本地項目路徑 username@服務器IP:/var/www/node-app

2. 安裝依賴并啟動應用

進入項目目錄，安裝依賴：

cd /var/www/node-app
npm install

開發環境啟動（用于調試）：

node app.js  # 假設入口文件為 app.js，端口默認 3000

安裝 pm2 守護進程管理器：

npm install pm2 -g

生產環境啟動（推薦使用pm2進程管理工具）

pm2 start app.js --name "node-app"  # 啟動應用并命名
pm2 save  # 保存進程列表，避免服務器重啟后應用停止

四、安裝并配置 Nginx

1. 安裝 Nginx

sudo apt install -y nginx
sudo systemctl start nginx  # 啟動 Nginx
sudo systemctl enable nginx  # 設置開機自啟

此時訪問服務器 IP 應看到 Nginx 默認歡迎頁面。

2. 配置 Nginx 代理 Node.js 應用

創建 Nginx 配置文件（替換默認站點）：

sudo nano /etc/nginx/sites-available/node-app

寫入以下內容（根據實際情況修改端口、路徑等參數）：

server {listen 80;server_name your-domain.com;  # 替換為你的域名或服務器 IP# 靜態資源代理（如 HTML、CSS、JS）location / {root /var/www/node-app/public;  # 網頁靜態資源目錄index index.html index.htm;try_files $uri $uri/ =404;}# Node.js 應用代理（假設 Node.js 運行在 3000 端口）location /api/ {  # 代理路徑可自定義，如 /api/proxy_pass http://localhost:3000/;  # 指向 Node.js 應用地址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;}# 跨域資源共享（CORS）配置location / {if ($request_method = 'OPTIONS') {add_header 'Access-Control-Allow-Origin' '*';add_header 'Access-Control-Allow-Methods' 'GET, POST, OPTIONS';# 允許自定義請求頭（如 Authorization）add_header 'Access-Control-Allow-Headers' 'DNT,User-Agent,X-Requested-With,If-Modified-Since,Cache-Control,Content-Type,Range,Authorization';add_header 'Access-Control-Max-Age' 1728000;add_header 'Content-Type' 'text/plain; charset=utf-8';add_header 'Content-Length' 0;return 204;}if ($request_method = 'POST') {add_header 'Access-Control-Allow-Origin' '*';add_header 'Access-Control-Allow-Methods' 'GET, POST, OPTIONS';add_header 'Access-Control-Allow-Headers' 'DNT,User-Agent,X-Requested-With,If-Modified-Since,Cache-Control,Content-Type,Range,Authorization';}if ($request_method = 'GET') {add_header 'Access-Control-Allow-Origin' '*';add_header 'Access-Control-Allow-Methods' 'GET, POST, OPTIONS';add_header 'Access-Control-Allow-Headers' 'DNT,User-Agent,X-Requested-With,If-Modified-Since,Cache-Control,Content-Type,Range,Authorization';}}
}

3. 啟用配置并測試

激活站點配置：

sudo ln -s /etc/nginx/sites-available/node-app /etc/nginx/sites-enabled/

檢查 Nginx 配置語法是否正確：

sudo nginx -t

重啟 Nginx 使配置生效：

sudo systemctl restart nginx

五、跨域配置驗證

前端請求示例（以 JavaScript 為例）
在前端代碼中發送跨域請求時，Nginx 會自動添加響應頭：

fetch('http://your-domain.com/api/data', {method: 'GET',headers: {'Content-Type': 'application/json','Authorization': 'Bearer your-token'  // 若有自定義頭需與 Nginx 配置一致}
})
.then(response => response.json())
.then(data => console.log(data));

測試跨域是否生效
使用瀏覽器開發者工具（F12）查看響應頭，確保包含：

Access-Control-Allow-Origin: *
Access-Control-Allow-Methods: GET, POST, OPTIONS
Access-Control-Allow-Headers: ...

若出現跨域錯誤，檢查 Nginx 配置中的路徑、端口是否與 Node.js 應用匹配，以及防火墻是否放行端口（如 Ubuntu 的 UFW 需開放 80/443 端口）。

六、補充優化（可選）

1、HTTPS 配置（推薦）

使用 Certbot 生成免費 SSL 證書：

sudo apt install -y certbot python3-certbot-nginx
sudo certbot --nginx -d your-domain.com  # 按提示完成配置

2、防火墻設置

sudo ufw allow 'Nginx Full'  # 允許 HTTP/HTTPS 流量
sudo ufw allow ssh  # 保留 SSH 訪問
sudo ufw enable  # 啟用防火墻

3、日志管理

Nginx 日志路徑：
訪問日志：/var/log/nginx/access.log
錯誤日志：/var/log/nginx/error.log
可通過 tail -f 命令實時查看日志調試問題。

最后：總結流程

環境安裝：Node.js + Nginx

應用部署：上傳代碼 + 啟動服務（推薦用 pm2）

Nginx 代理：配置反向代理和跨域響應頭

安全優化：HTTPS + 防火墻

調試驗證：檢查服務狀態和跨域請求是否正常

通過以上步驟，即可在 Ubuntu 20.04 中完成網頁、Node.js 應用和 Nginx 跨域配置的部署