Cloudflare

基於 Cloudflare Worker 的監控服務 - UptimeFlare

前言

在很早以前，我曾經介紹過 Uptime Kuma 這個監控服務，但是它基本上還是需要在一台機器上運作。所以過去一段時間，我就在思考有沒有一個更便宜的做法。

直到最近在看 Telegram 的群組時，看到有人在討論今天要介紹的這款：UptimeFlare。他是基於 Cloudflare Worker 運作的，你只需要有 Cloudflare 及 Github 帳號即可使用。不過他似乎只能使用 HTTP 或是 TCP Ping 這種監控方式，如果你需要 ICMP 可能就需要再找其他解決方案了。

前置作業

在我們開始之前，有些必要的東西你必須先有， 不然就可以別玩了 。你必須先要有一個 Cloudflare 帳號以及一個 Github 帳號，這樣就足夠了。

設定步驟

申請 Cloudflare API 金鑰

前往 Cloudflare API 權杖 建立 Token，選擇 編輯 Cloudflare Workers 這個範本。

001.jpg

拉到下面的帳號資源並選擇你的帳號，區域資源則是選擇所有區域，就可以按下 繼續至摘要 囉。

002.jpg

確定一下摘要，沒問題就可以點選 建立 Token。

003.jpg

他將會產生一個 API 權杖，請先複製起來，稍後會用到。

004.jpg

設定 Github 專案

前往 UptimeFlare 的 Github 頁面，在右上角點選 Use this template 並選擇 Create a new repository。

005.jpg

接著依據你的需求為這個 Repo 命名，並選擇是否公開，就可以建立專案了。

006.jpg

接著我們需要設定變數，到 Settings 頁面中的 Secrets and variables 點選 Actions，我們要設定專案的 secret，所以點選 New repository secret。

007.jpg

在名稱的區域填入 CLOUDFLARE_API_TOKEN，而下面的 Secret 則貼上剛剛請你先複製下來的金鑰，完成後確定就好。

008.jpg

編輯 uptime.config.ts

在專案的目錄底下，有一個檔案叫做 uptime.config.ts，他就是用來設定這個網頁及監控目標的設定檔案。

在變數 pageConfig 範圍中，這是設定網頁上要顯示的畫面及連結，你可以改成你自己的形狀。

const pageConfig = {
  title: "CRE0809's Status Page",
  links: [
    { link: 'https://github.com/cre0809', label: 'GitHub' },
    { link: 'https://blog.cre0809.com', label: 'Blog' },
    { link: 'mailto:[email protected]', label: 'Email Me', highlight: true },
  ],
}

在變數 workerConfig 中的 Monitors 就是我們要監控的目標，以下提供 TCP 及 HTTP 兩個範本作為參考。

HTTP：

{
    id: 'cloudflare_http',
    name: 'Cloudflare 首頁',
    method: 'GET',
    target: 'https://www.cloudflare.com',
    tooltip: '這是 Cloudflare 首頁的監控。',
    statusPageLink: 'https://www.cloudflare.com',
    expectedCodes: [200],
    timeout: 5000,
    headers: {
        'User-Agent': 'Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/131.0.0.0 Safari/537.36',
    },
}

TCP Ping：

{
    id: 'cloudflare_dns_tcp_ping',
    name: 'Cloudflare DNS TCP Ping',
    method: 'TCP_PING',
    target: '1.1.1.1:853',
    tooltip: '這是 Cloudflare DNS 的 TCP 監控。',
    statusPageLink: 'https://one.one.one.one',
    timeout: 3000,
}

設定完成就可以推上去囉。

檢查 Github Actions

到 Actions 分頁檢查一下有沒有 Run 失敗的，這很有可能是因為我們還沒設定變數時，他就先跑過一次所以發生錯誤，我們只需要點他讓他 Re-run 就可以了。

009.jpg

綁定網域

事實上現在這個網站已經準備好了，他會使用 Cloudflare 的 pages.dev 網域，你可以在 Cloudflare 的 Workers 和 Pages 裡面找到他。

010.jpg

選擇上面的自訂網域，新增你自己的網域名稱，等待一段時間就完成囉！

011.jpg

檢視成果

現在前往我們剛剛綁定的網域，你應該可以看到監控服務正在正常運作囉！

012.jpg

© 2025 CRE0809's Blog