fly.io 使用心得,從註冊、佈署 NodeJS 專案到網域設定

Eason Lin
8 min readSep 7, 2022
Photo by Florian Olivo on Unsplash

幾天前,聽說了 Heroku 即將終止免費計畫的消息,身為免費仔的我自然非常失落,畢竟少了一個一直以來很依賴的伺服器佈署平台。但相對地,也給了我一個機會去摸索其他有類似服務的平台。

這篇文主要記錄後來參考的替代方案 fly.io 的使用,其中會概括註冊、佈署一個簡單的 NodeJS 服務到從 GoDaddy 註冊網域及設定的過程。在完成後,應該可以成功在一個自己註冊的網域中顯示由 fly.io 代管伺服器渲染的網頁。

fly.io 的用途是?

作為前端開發者,將我們的網頁放到 github pages、codepen 等地方供其他人參閱應該是再平常不過的事情。然而,當我們需要將一個需要執行的服務,例如基於 NodeJS 的伺服器放到平台上,就無法使用上述的服務達成。fly.io 就是一個可以解決此問題的伺服器佈署平台。

fly.io 提供了 flyctl,一個非常簡便的 command-line tool,在 Windows、Mac 及 Linux 都有非常簡單的安裝方式,開啟終端機(Windows 平台可使用 PowerShell)並根據對應平台執行以下指令進行安裝:

# Mac
brew install flyctl
# 若沒有 brew,也可用此指令
curl -L https://fly.io/install.sh | sh
# Linux
curl -L https://fly.io/install.sh | sh
# Windows
iwr https://fly.io/install.ps1 -useb | iex

完成安裝後,可以輸入 flyctl --help 確認是否安裝成功:

當出現了一系列的指令介紹就代表安裝成功

下一步是進行註冊,在終端機中輸入:

flyctl auth signup

終端機會直接為我們開啟瀏覽器並呈現無註冊的畫面,在這裡我直接使用了 Github 帳號進行註冊:

註冊完畢後,我們就可以來佈署一個簡易的 NodeJS 服務。

將 NodeJS 服務佈署至 fly.io

首先,我們可以準備一個空的資料夾。在資料夾中新增 server.js 檔案,並輸入以下內容:

const express = require("express");
const app = express();
const port = process.env.PORT || 3000;
app.get("/", (req, res) => {
res.send("hello world!");
});
app.listen(port, () => {
console.log(`app running on ${port}`);
});

輸入 npm init -ynpm install express,便可以藉由 node server.jslocalhost:3000 啟用這個非常簡易的服務。

接著我們便可以開始著手進行佈署。輸入 flyctl launch

這邊會詢問 App Name 並會將其作為 subdomain,例如若取名為 abc,佈署上去的網址就會是 abs.fly.dev。若輸入 Enter,fly.io 會直接幫我們決定一個:

接著會讓我們選擇區域,預設會幫忙選擇最近的,因此直接 Enter 即可:

這裡會詢問你要不要設定一個 DB,因為我們的目的是佈署一個單純的服務上去,就直接輸入 N:

最後詢問是否要直接佈署,則輸入 y。

接著就會開始進行佈署,等待的時間似乎不一定,我最長有等超過十五分鐘過,還請耐心等待它完成佈署。

完成佈署後,我們可以直接輸入 flyctl open,應該就可以看到瀏覽器直接開啟對應的網頁:

如果到 fly.io 網站中的 dashboard,應該也能看到自己的服務出現在其中:

若需要更新 NodeJS 服務,例如想修改 res.send 的內容,只要在完成調整後輸入 flyctl deploy,就可以直接將新的版本更新至 fly.io 上:

那麼,如果我有一個註冊的網域,要怎麼將其設定到這個服務上呢?

網域設定(以 GoDaddy 為例)

GoDaddy 是一個可以註冊網域並提供網站代管服務的公司。如果不曾購買過網域,我自己是覺得可以試著買一個,購買一個網域可能沒有想像中的那麼貴(至少第一年非常便宜):

省下一天咖啡的錢,就能租到一年的網域喔!

我自己是購買後就把續約關閉,這樣就不用擔心因為忘記關閉而被續約。購買的流程這邊就不贅述,只要有信用卡,照著購買流程完成購買,應該就能獲得一個至少有一年期限的網域。接下來,我們就來設定網域的 A 記錄。

A 記錄

A 記錄就我自己的理解,它其實就是告訴 DNS 說這個網址對應網頁伺服器的 IP 是什麼,只要將其設定為我們在 fly.io 佈署伺服器的 IP,輸入該網址就能通向我們架在 fly.io 的伺服器。如果要看比較清楚的 A 記錄定義,可以參考這篇文章

在設定前,我們可以先在專案中增加網域。在專案終端機中輸入:

flyctl certs create -a [Repo名稱] [已註冊的網域]

專案名稱應該會對應到目前在線上的子網域,若不確定 Repo 名稱,也可從 Dashboard 中看到:

若增加成功,它會直接回傳主機的 IP 提供我們設定:

可以先把黃色及藍色遮擋住的地方記下來,待會就會使用到。

要設定 A 記錄,可以在 GoDaddy 任一頁面中點選右上角自己的名字,並點選我的產品:

在服務中點選網域中的「DNS」:

到這個頁面後,點選「新增」:

首先可以選擇 A,名稱輸入「@」。內容值的部分則輸入上面終端機中取得黃色遮蔽的部分。若不慎遺失了,可以回到專案開啟終端機,並輸入 flyctl ips list

首先將 v4 的 IP 輸入至「內容值」的輸入框中,並按下「新增記錄」。

接著再新增一個記錄,類型選擇 AAAA,名稱一樣輸入「@」,內容則輸入藍色遮蔽,或說 v6 的內容,最後按下新增記錄。

完成後,可以輸入 flyctl certs list 確定 Host Name 上已經有自己註冊的網域。

最後則是等待,因為 A 記錄的生效似乎要一段時間,我自己當時是一小時左右就生效了。生效後就能藉由註冊的網域連結到 fly.io 的頁面:

在撰寫這篇文的期間,站台被我拿來試了一些功能,所以已經和上面範例的 hello world 不太一樣了

結語

fly.io 從註冊到網域設定,我自己覺得是一段蠻有趣的歷程,因為 fly.io 類似於 heroku,不必經過很多繁瑣的設定,能在非常短的時間內就將服務成功佈署上去,成就感蠻高的,不過其實買了這個網域,我到現在都還沒有打算要拿來做什麼網站就是了。

--

--