[LayerStack] 完整Linux VPS使用PM2與Nginx架設Node.js站台設定中文教學

大家有想要使用 Node.js 架設網站嗎？

這篇文章應 LayerStack 的邀約，撰寫一篇使用 Node.js 從零開始，架設網站的圖文教學。

不過因為看這篇文章的人應該是新手居多，所以我們先介紹一下 VPS 與 LayerStack。

 

(直接到 Node.js 架站步驟請點我！)

 

 

 

首先網站必須要架設在電腦上面，跟我們開發一樣。所以無論如何，你都需要一台 24小時運轉，而且流量要夠大的電腦供大家訪問。當然，這台電腦通常你不會拿來日常使用，畢竟如果突然有大量的訪客訪問網站的話，你的電腦使用會受到影響，而你使用電腦的同時也會影響到訪客的效能。所以一般我們都會找一台"專用"的電腦，適合 24 小時運作的電腦，"專門"來架設網站。我們稱這樣的電腦為伺服器或主機，英文為 Server 。

 

 

而目前主流的做法是跟專業的雲端伺服器公司“租用”主機，每個月付點小錢，就不需要處理「電」、「網路線路」、「電腦故障」、「貓踢到電線」等問題，也不會發生「打掃阿姨誤拔電源關機」等意外。

 

 

LayerStack 就是提供這樣專業雲端主機租用服務的公司。其中，不跟別人共用、主機只有自己使用的類型就是 VPS = Virtual private server，虛擬專用伺服器，也是 LayerStack 的主要業務。VPS 使用上屬於維護需要更多程式知識，但是可以完整發揮主機的效能、控制主機的行為，是「後端工程師」必需要會的技能之一。

 

 

當然，提供穩定的 VPS 私人專屬虛擬主機是這個行業最基本的，LayerStack 絕對沒問題。所以接下來就要說明一下 LayerStack 特別的優勢。

 

 

首先，LayerStack 的主機位置(數據中心) 可以選在「香港」、「日本」、「新加坡」等，對台灣來說相當近的位置。主機位置離訪客越近，網站速度越快，這是物理上的因素，所以 LayerStack 對服務亞洲的網站速度上是沒問題的。 

 (LayerStack 也有美國洛杉磯的數據中心可選，如果你的訪客多是美國、歐洲訪客，那也可以選那邊。)

 

 

再來就是副標題提到的中國大陸連線的優勢，網路連線到中國大陸有所謂的骨幹線路(WIKI)。如果沒有特別租用專屬的線路的話，會走 163 骨幹，也就是最基本、跟著大家一起塞車的線路。所以大部分架設在中國大陸以外的網站，中國大陸訪客連過去都會相當慢，甚至文字圖片跑不出來的情形，慢到讓人不想使用的等級。

 

如果你的或你負責的公司的網站，有做中國大陸生意，那最好不要跟著別人一起走基本線路。那要怎麼解決呢？其實就是走 LayerStack 有提供的 CN2 GIA 線路。這是大部分的 VPS 主機商都沒有提供的服務。在 LayerStack，只要在一定等級以上的主機，都可以每月付點小錢，開啟 CN2 GIA 的服務。額外的高速主幹道，讓你的訪客可以正常的訪問網站。

 

 

這邊可能大家會在意說，所謂的小錢，到底是多少呢？因為不同數據中心的「服務計畫」大同小異，所以我這邊顯示最多方案選擇的香港數據中心。

以 2022/01/31 官網的截圖如下：

 

 

上圖可以看到，如果要使用 CN2 線路服務的話，最少必須要到 R108 這樣的等級，後面的 HK 指的是數據中心位置所以可以忽略。R108 的規格是 2vCPU + 4GB RAM 只要 17.76 美元/月，比大部分的 VPS 主機商要花費 20 美元/月 便宜許多。當然，如果不需要 CN2 線路的話， 10.00 美元/月 的 S008 計畫是非常有吸引力的選擇，大家也可以參考。

 

 

不過跟一般的習慣可能不一樣的是，LayerStack 是預繳制的，所以在一開始就必須要付一個時間區間的費用，其中包含一年、三個月、一個月，租用越長越便宜。但是因為是預繳制的，所以在購買之前必須要確實確認自己的需求喔！

 

 

 

======

 

那我們接下來就開始註冊吧！

 

 

首先進到 LayerStack 網站，點選 建立「免費帳戶」或「立即申請」，會進到註冊頁面。

 

 

接著就是常見的填入 Email 與 密碼

 

 

註冊完，會收到 Email 確認信，所以 Email 不能亂填，沒收到的話可以找一下垃圾郵件。總之要點選裡面的按鈕確認。

 

 

 

沒什麼問題的話，就會跳進 Dashboard 控制面板，但真正的帳號資料還沒有填，所以我們要先點擊 Create Account 去建立帳號。

 

 

 

點擊後就進到填些帳號資料的畫面了，照著真實資料去填寫，不過基本上 LayerStack 也不會寄信給你。其中 City / State 會是大家不知道該怎麼填的欄位。

我自己通常是「市鄉政區」會在 City, 「縣市」會填在 State。

例如圖中「信義區」我就填在 City, 「台北市」我填載 State。英文地址是反過來寫的，不見得真的要對應到英文的意思，順序對最後真的有寄信，地址順序也會是對的。

英文地址可以用郵局 中文地址英譯 來查

 

 

寫完就按下 Create Account

 

 

建立好第一個使用者帳號後， Dashboard 就會長得不太一樣了，這時才是要選擇方案的時候。選擇下方的 Create ，或是右邊的 Deploy 都可以。

 

 

 

點下去後就進入下圖，因為我們這邊要使用的是最基本的主機

所以就這樣選即可，其中右邊有幣別，如果你想換成用港幣或是新加坡幣計價也可以。

 

 

 

往下會有作業系統 OS 可以選，進度條的文章當然是選 Ubuntu，畢竟我們有完整的教學。

其他系統當然也推薦，主要還是看你哪個比較會用就選哪個。別人說哪個比較好，一般確實是有它的道理。但在好的工具你不會用，反而更危險。所以選自己熟悉的比較好。

 

要選 Windows 必須額外加錢。

 

 

 

接下來選數據中心

 

我這邊選新加坡，當然你們也可以選喜歡的，個人覺得以台灣訪客為主的話亞洲各大城市差異不大。

 

 

 

再來就是選方案了

我這邊選的是 R108-SG

選 12 個月的方案會比較便宜，有一些組合他預設就是不能選的。

 

 

 

接下來是問要不要打開 CN2 功能，這需要加錢，價錢寫在旁邊 $3.2 美金/月，差不多每月 100 台幣，感覺還好。

記得點一下變紅色才是開啟，如果方案選的是不能開啟的等級，那這邊就沒辦法開啟，一切都在結帳之前，所以不用怕方案買了才說不能用 CN2。

 

 

再來是自動備份，如果是正式站台，這功能滿重要的，是安全防護最後一道關卡，整台還原。不過練習機的話可以不需要開啟。一樣紅色是開啟。

 

 

 

Password 設定後要記得，這個密碼不是LayerStack 使用者的密碼，是你新建的主機的登入密碼。也可以使用 SSH Key 和客製化開啟 Script，但這比較進階，我們這邊就不講了。 

這密碼一定要記起來！！

 

 

 

都設定好了以後，右下角有 Add to cart，按下去就是加入購物車了。

我們這邊只開一台，所以 Quantity 維持 1 就可以了，除非你想要一次開多台。

 

 

 

接下來就是跳到結帳頁面

確定沒問題的話，首先有 Enter Coupon Code 的欄位，如果 LayerStack 有做活動的話就會有，需要先填入後按下 Apply。

 

 

 

接下來是 Add Credit Card 

 

點下去會跳出來輸入框，LayerStack 用的是 Stripe 國際知名付款公司，為了續約，輸入了信用卡資料後，該資料會放在 Stripe 裡面做自動扣款。像 Stripe 這樣的公司，金流資安都是要有認證的，所以不需要擔心。

＊注意 Stripe 只接受 VISA / Master Card / 美國運通，如果你是 JCB 信用卡的話不會過喔！

 

 

 

加成功後按 Place order 就完成訂單了！

 

 

 

按下 Go to Dashboard 回到 Dashboard 主控台，下面就可以看到主機出現了，也包含 public ip，點擊主機名稱(LS-xxxxxx) 就可以進到細節頁面。

 

 

 

進來可以看到，我的 Private Network 沒有打開，但因為我現在沒打算拆架構，所以就還不需要。自動備份也是，練習機還不需要打開。CN2 如果要使用的話就要打開。

 

 

======

 

直到這邊，Ubuntu Linux 主機就準備好了，接下來就開始用 Node.js 架站吧！

 

接下來 Windows 會需要用到 putty，MacOS 則是 SSH。不過無論是哪個作業系統，只要你有用 VSCode 的話，在 VSCode 的 Terminal(終端機) 底下都可以直接使用 SSH。

 

所以我接下來用 VSCode 的終端機使用 SSH 繼續進行。你真的找不到該如何使用，也可以用 LayerStack 提供的網頁終端機。

 

 

1. VSCode 

 

2. LayerStack 終端機

 

 

因為我偏好一般的終端機，使用上比較有彈性。如果用 ssh 的話，必須要下 

$ ssh root@<ip address> 

 

例如

$ ssh [email protected]

你可以在 IP Address 欄位找到數值

 

 

連上去以後，會先有 ECDSA Key fingerprint 要同意，選 yes。

之後 root 需要 password，這就是你前面在開主機的時候填的密碼。

正確填入，就會有 ubuntu 的歡迎文字，就可以開始使用了。

 

 

 

 

接下來會需要 Linux 的基本常識，所以你不會的話是沒有辦法繼續進行接下來的動作的，至少要有 Vim 和 路徑的概念。完全不會的人建議先看我們 Linux 基礎課程影片(或是直接參加完整課程)

01. 使用者目錄概念、切換路徑(cd)與現在路徑(pwd)

02. 絕對路徑

03. 相對路徑

文字編輯器的基本編輯(vim.tiny vim)

 

 

======

 

進來的第一件事就是更新系統資源

所以逐步執行

$ apt update

$ apt upgrade

 

 

然後我們就可以安裝 Node.js 的環境，我這個時間點是 Node.js 16 為主要版本

所以可以依照官方指示使用 curl 下載 node.js 16.x 的設定檔，並且下載完會直接執行，包含再一次的 apt update。

 

$  curl -fsSL https://deb.nodesource.com/setup_16.x | sudo -E bash -

 

 

執行完了以後，就可以用 apt 下載 v16版 的 node.js，沒執行的話，很大的機會是舊版本的 node.js

 

$ apt install nodejs

 

 

結束後，可以看到是 v16.13.2，你們的應該會更新。

 

======

 

接下來就是建立一個 index.js 檔案

我自己擅長的是 vim，你們也可以用任何的終端機編輯器達成。

 

先回到家目錄，這樣比較不會忘記檔案放在哪

$ cd ~

 

建立一個新檔案，我取名叫 index.js

$ vim index.js

 

 

裡面的內容如下：

 

 

這樣他就會監聽 80 port，也就是我們常說的 HTTP Port，並且每次有人訪問的時候回應 "Progress Bar !!"

 

利用 Node 去執行他

$ node index.js

 

 

你就可以利用任何的瀏覽器去訪問這個頁面，因為我們沒有 Domain 網域，所以直接使用 IP 訪問，IP 就是與你 ssh 連線相同的 IP。

 

 

======

 

雖然一直到這邊，Hello World 等級的內容就完成了，但是實際上這樣會有滿多問題的。以下粗列幾點：

 

1. 直接這樣的運行，Process 等於是沒有特別去管理，如果 Process 掛掉網站就登不進去了。

2. 另一個是我們讓應用程式直接以 root 去執行，這樣如果系統有漏洞，駭客很容易就會取得 Root 權限。

3. 所有的 Request 都會導向同一個 node.js 程式，所以做不到多站台的 Hosting，除非你自己寫出該內容的 index.js。

 

好在，上面的幾點我們可以透過 PM2 這個 Node.js Process 管理程式與 Nginx (或 Apache，擇一)完成。所以接下來我們就安裝他們吧！

 

 

首先安裝 PM2 ，他是 Node.js 的套件，所以用 npm 安裝，並且安裝成 Global 變成 cmd 指令。

$ sudo npm install -g pm2

 

安裝完了以後，我們可以執行

$ pm2 start index.js

 

會看到類似下圖：

 

其中可以看到

name, pid, user，這幾個本文想提的的重點。

 

使用 pm2 的話，在 process 死掉的同時，他會幫你重新生成一個 process。

所以我們可以嘗試 kill -15 <pid> ，結果會是在重新生成一個 process，網站一樣活著。

 

 

要看當下的 pm2 執行情況。

$ pm2 status

 

這邊要注意的是，pm2 的使用是註冊任務型式的。

像如果我們想要關掉網站 (index.js)

可以使用它顯示的 name

 

$ pm2 stop index

其中 index 為 name，如果你顯示的是不一樣的 name，那就使用你看到的。

 

這樣做完，網站就連不上了。不過不代表這個任務已經自 pm2 移除了。

要再打開只要執行

$ pm2 start <name>

即可

 

如果要完全的移除，需要執行

$ pm2 kill

 

一般來說 <name> 是用檔名幫你註冊的，如果想改註冊的<name>，在一開始的時候使用 --name，例如：

 

$ pm2 start index.js --name server

 

 

當然，pm2 還有很多設定可以做，不過我們這篇還是先點到為止。

pm2 官網文件

 

======

 

接下來我們就來安裝 Nginx，不過整個開始之前，先關掉 pm2 打開的 index.js 網站。因為我們要讓 Nginx 來接管 80 port。並且在安裝 Nginx 後，會自動產生出 www-data 使用者，它的權限就小很多，所以之後網站要改用他當使用者。

 

 

安裝 nginx

$ apt install nginx -y

 

 

一切順利的話，這時候用瀏覽器訪問 ip，會改看到 Nginx 的歡迎頁面，就表示 80 port 被 Nginx 接管了。

 

 

======

 

接下來既然 80 port 不能使用，哪我們就要把內容掛在其他的 port 上，透過 Nginx reverse proxy 反向代理功能顯示。簡單來說，就是控制權在 Nginx 上。Nginx 的操作細節我們的「Linux雲端伺服器，用AWS暸解Apache與Nginx」課程一樣有包含，這邊就直接簡單的設定讓他運作。

 

首先改 index.js 內容

我改選 8800
 

 

再來一樣執行 pm2

$ pm2 start index.js

 

 

接下來設定 /etc/nginx/sites-available/default，修改成如下

$ vim /etc/nginx/sites-available/default

 

 

改完後重啟 Nginx

$ service nginx restart

 

再去訪問網頁就又會連回去一樣的內容了！

 

 

======

 

接著再解決一個問題，就是讓 pm2 改以 www-data 運行 

 

首先 PM2 被裝在 global，所以 www-data 確實是可以使用 PM2 的。

但是執行的時候會有問題，因為它的家目錄是 /var/www，其 owner 為 root，會導致 www-data 無法產生一些暫存檔而發生執行錯誤。

 

其中一種解決方式為「改變權限」

$ chown -R www-data:www-data /var/www/

 

改變權限後，再把 index.js 搬過去

$ cp ~/index.js /var/www/index.js

 

接著切換使用者到 www-data 

$ sudo -u www-data bash

 

切成 ww-data 後，進去 /var/www

$ cd /var/www/

 

執行 pm2 與 index.js

$ pm2 start index.js

 

如下圖般顯示，就成功了

 

======

 

最後再加上重開機也會自動開啟的指令，在 www-data 的登入狀態下，執行。

$ pm2 startup systemd

 

它會要求我們執行一個指令，但是因為 www-data 沒有 sudo 的能力，所以要先跳回 root

 

$ exit

 

接著執行它說的指令，這段看它顯示什麼，如果跟我寫的不一樣，執行它給你的即可。

$ sudo env PATH=$PATH:/usr/bin /usr/lib/node_modules/pm2/bin/pm2 startup systemd -u www-data --hp /var/www

 

 

最後再切回 www-data 執行:

$ pm2 save

 

這樣就完成了，最後一個動作 pm2 save 會記錄當下你執行的內容，重開的時候會包含進去。

不然只會開一個空的 pm2 背景程式，不過每個使用者對應的 pm2 process 是不一樣的，所以以我們來說必須要切回 www-data 再 save。用 root 執行 pm2 save 是不會讓 www-data 底下的 pm2 儲存的。

 

 

 

如果要解除開機執行註冊

$ pm2 unstartup systemd

 

執行最後一個指令集即可。

 

如果想測試一下的話，可以回到 LayerStack 後台，按下重新開機鍵，如果重開機完網站還活著就成功了！

(重開機會導致網站關掉幾秒)

 

 

 

最後，如果你喜歡我們的文章，別忘了到我們的FB粉絲團按讚喔!!