設置 Nginx 以實作反向代理

2023年11月18日

前言

為何要在 server 使用 Nginx 呢？ Nginx 是近年蠻多人使用的開源伺服器軟體，可以用作反向代理、負載均衡器和緩存。那以最一開始只是要來架設專案的後端來說，如果不希望打網址還需要打端口（port），就會需要 反向代理。

何為反向代理？

預設情況下，一個網站如果沒有指定端口，瀏覽器會預設使用的 HTTP 端口是 80，而 HTTPS 端口是 443。當你直接輸入網址時，瀏覽器會使用這些預設端口。

如果你的應用程式運行在 port 3000 上，瀏覽器並不會自動使用這個端口。因此，為了讓直接輸入網址時能導向到 port 3000，就可以使用 Nginx 來做反向代理。

Nginx 設置

安裝 Nginx

1. 使用終端的方式先安裝 Nginx

   sudo apt install nginx
2. 檢查 Nginx 服務的狀態

   sudo service nginx status
   那如果 Nginx 正在運行，你應該會看到類似於以下的輸出：

   ● nginx.service - A high performance web server and a reverse proxy server
     Loaded: loaded (/lib/systemd/system/nginx.service; enabled; vendor preset:>
     Active: active (running) ...
3. 至你的網址觀看
   接著就可以在瀏覽器端打網址，如果看到 "Welcome to nginx!" 那就是成功啟用啦

在 Nginx 上實作反向代理

在 AWS EC2 中其實已經有 Nginx 文件在 /etc/nginx，可以修改裡面的 nginx.conf 來設定，那由於 /etc/nginx 裡會是全局的設定，所以為了維護性可以在專案下寫 Nginx 的 config 然後再在全局引入。

1. 在專案中配置專案的 Nginx，以下程式的目的就是能導向到 port 3000 啦～

   # your/path/nginx/xxx.conf
   server {
      listen 80;
   
      location / {
               proxy_pass http://127.0.0.1:3000;
               proxy_set_header HOST $host;
               proxy_set_header X-Real-IP $remote_addr;
         }
   }

2. 接著是修改 /etc/nginx 裡面的 nginx.conf，加入以下程式來引入專案中的 Nginx 檔案

   include /your/path/nginx/xxx.conf

3. 最後重新載入

   sudo service nginx reload

補充：測試 Nginx 的服務狀態

寫專案時難免都會需要 debug，以下是我在實作中有用到的測試

• 檢查 Nginx 是否配置正確
  打 sudo nginx -t，如果能成功顯示 syntax is okay 的話代表配置正確

• 檢查是否監聽 port 80 打 sudo netstat -tulpn | grep 80 或是 sudo ss -tulpn | grep 3000，成功顯示以下代表正在監聽 0.0.0.0:3000 ，意味著接收來自任何 IP

  tcp   LISTEN 0      511                     *:3000             *:*    users:(("node",pid=YOUR_PROCESS_ID,fd=21)