如何上架網站（Nodejs/proxy/Certbot/Nginx）

Samuel Huang

5 min readJul 27, 2020

這幾天在架設一個縮網址服務的小網站，在這邊記錄一下網站搭建的過程。

假設網站在 local 都已經測試完成準備上架，那接下來的工作就會是：

選擇網域（domain）
選擇代理伺服器
利用代理伺服器做反向代理（proxy）將所選網域導到本地 ip 的特定端口（port）
幫網站免費加上 https

自己因爲是第一次建立網站，對於以上4個點，網路上的參考文章可以說非常凌亂，因此自己也花了不少時間進行整理、蒐集

1. 選擇網域

本文選擇使用免費的網域服務 NCTU.me Domain 關於如何申請，這邊寫的很詳細，值得參考一下。最後的申請結果應如下所示：

其中，140.114.53.192 是本地 ip ，而 short-link.nctu.me 則爲所申請的 domain。現在，我們已經將域名申請好，並連結上本地 ip 了，接下來準備利用代理伺服器將自己本地網頁的端口（port）對上該 domain。

2. 選擇代理伺服器

目前有很多 http 的代理伺服器可以選擇，舉凡 Apache / Varnish / Nginx 等都是可選的選項；關於這些代理伺服器的差異有興趣的人可以依照關鍵字搜尋，而本文選擇使用最後一項 Nginx 作爲網站的代理伺服器。

安裝 Nginx （以Ubuntu 18.04 爲例）

若在 AWS 機臺上安裝，爲了確保安裝後不會遇到啊裡啊雜的問題，在安裝前，需要確認在服務器上配置了 sudo 特權的非 root 使用者。關於此，這篇教學非常詳盡，可以參考一下。
若使用者已經可以使用 sudo 指令，則可以忽略第一點。
安裝步驟：參考這邊，包括防火牆的設定等都需要注意哦！

測試 Nginx 是否安裝完成：

以本人的機器爲例，在 terminal 中輸入 ifconfig 後，找到 eno1 tag，其中的 140.114.53.192 就是本地 ip。

在任意一個 browser 中輸入自己的 ip 應該會得到 Nginx 的歡迎頁面：

這裡需要注意，若 ip 後面沒有加上任何的 port （如140.114.53.192:3000 ，port 就是 3000），則預設對外端口爲 80 port。

既然安裝好 Nginx，那我們的問題就剩下反向代理（proxy）以及加上https，ok 準備好了 GO！

3. 反向代理（proxy）

Nginx 的安裝目錄預設爲 /etc/nginx
要部署的網站的設定檔則放在 /etc/nginx/sites-available/
進入該目錄並建立一個專案專屬的設定檔 cd /etc/nginx/sites-available/ && vim example

server {    
    server_name example.com;     
    location / {
        proxy_pass http://127.0.0.1:3000;        # 把 IP、Protocol 等 header 都一起送給反向代理的 server
        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 $http_x_forwarded_proto;
    }
}

其中 server_name 就是搭配我們的網域，而 location / 則是告訴 Nginx 在有 client 對 example.com 發出請求時，該回應的內容。這裡，假設後端的 port 設爲 3000，則/ 代表example.com/ 需要回應本地後端所做的邏輯處理的內容。

設定完成後 sudo nginx -t ，若回應 ok，則
sudo ln example ../sites-enable/example
sudo nginx -s reload

這樣，網站基本上已經在 DNS 指向主機的 3000 port 了。

4. 加上 https（SSL 安全性連線設定）

https 安裝上推薦使用憑證機器人 Certbot

允許HTTPS通過防火牆

獲取 SSL 證書 sudo certbot — nginx -d example.com -d www.example.com
成功畫面

IMPORTANT NOTES:
 - Congratulations! Your certificate and ...
   ...
 ...
 ...

看到 Congratulations! 代表大功告成啦！
記得驗證 Certbot 自動續訂哦 sudo certbot renew — dry-run

最後提醒一下記得備份 config 哦，不然哪天電腦出事情就不好了ヾ(;ﾟ;Д;ﾟ;)ﾉﾞ