專案分享

IT @ Jason Tools：自主開發的 IT 實用工具箱（一）

Jason Cheng 發布 2026.10.24 瀏覽 4 次

IT @ Jason Tools Proxmox VE 系統管理網路裝置管理

本文目錄

純前端架構
七個分類與 72 支工具
日常常用工具
郵件：標頭與退信
Proxmox VE Ceph：容量與網路
網路維運工具
WebAuthn 測試器
其他推薦工具
站台設計原則
使用方式
結論
參考資料

三年前我寫過一篇 IT-Tools 的自建教學，也把 it.jason.tools 這個站台架起來給大家用。這幾年下來它確實省了我不少時間，但用著用著就發現，真正卡住我的那些事情，通用型的工具箱其實幫不上忙。

一份 Weathermap 設定檔改到眼花、客戶把退信截圖丟過來問「這是什麼意思」、規劃 Ceph 要算幾顆硬碟幾 Gbps，這些都不是「Base64 轉一下」就能解決的。既然如此，那就自己寫吧。

現在 it.jason.tools 已經全部換成我自己開發的版本，站名叫做「IT @ Jason Tools」，目前收了 72 支工具。一樣免費、免註冊，而且完全純前端：所有運算都在你自己的瀏覽器裡完成，沒有後端伺服器，你貼進去的東西不會離開你的電腦。

純前端架構

這件事我想放在最前面講，因為它是整個站台的地基，不是附加的賣點。

純前端的意思是：沒有後端伺服器。整個站台就是一堆 HTML 與 JavaScript，你打開頁面之後，所有解析、計算、繪圖都在你的瀏覽器裡跑完。你貼進去的郵件標頭、防火牆設定檔、記錄檔、設備清單，一個位元組都不會送到我這裡，因為根本沒有「我這裡」可以接收。

為什麼這件事重要：

客戶的資料不會外流
維運工作上要分析的東西幾乎都是敏感的。用線上工具最怕的就是「這份 config 貼上去之後跑去哪了」，純前端從架構上就沒有這個問題。
不需要帳號，也不會留下你的紀錄
沒有後端就沒有資料庫，沒有資料庫就沒有使用紀錄。不用註冊、不用登入，關掉分頁就什麼都不剩。
你可以自己驗證
不信的話，開瀏覽器的開發者工具看 Network 分頁，或者把網路斷掉再操作一次。真的有在偷傳東西，這兩招馬上就看得出來。
內網也能用
頁面載入完成之後不需要連外，所以在上網管制嚴格的機房、客戶端內網都用得起來。

代價當然也有：瀏覽器不能替你連線到設備、不能查 DNS、不能寄信，所以站上的工具一律是「你把東西拿給它看，它告訴你看到什麼」，不會有「輸入 IP 幫你掃描」這種功能。我覺得這個交換很划算。

七個分類與 72 支工具

工具數量一多，怎麼分類就變成一件要想的事。我的分法是依「你想做什麼」分，不是依「這支工具用什麼技術做的」分。

文字與編碼（11 支）

Base64、URL 編碼、文字編碼與換行格式轉換、UUID 產生器、密碼產生器、QR Code 與 Barcode 掃描、全形符號表、色碼轉換、SSL 憑證工具箱、SAML 訊息檢視器。

檔案與格式（11 支）

Diff 比較、JSON / XML / CSV / SQL / YAML 格式化檢視、測試檔案產生器、HTML 編輯器、SSH 公鑰檢查器、Markdown 編輯器、JWT 檢視器。

郵件與通訊（9 支）

Email Subject 編碼、Email Header 分析、EML 郵件檢視器、郵件退信分析器、通訊錄 vCard 整理器、通訊錄整理與轉換器、行事曆 ICS 檢查與產生器、Zimbra 搜尋語法產生器、Zimbra 目錄分析器。

網路與診斷（13 支）

SNMP 結果分析、Weathermap 設定檔編輯器、網路連線品質測試、IP 子網路計算機、LDAP 篩選條件設計器、robots.txt 規則測試器、Amass 視覺化工具、iperf3 結果分析器、Jitsi Meet 頻寬計算機、安全標頭檢查器、CSP 規則設計器、WebAuthn 測試器、OPNsense 設定分析器。

系統與儲存（16 支）

這是目前最大的一類，幾乎都是維運現場長出來的：PVE Ceph 網路與容量計算機、PVE ZFS 容量計算機、PVE 系統報告檢視器、PVE 資源計算機、PVE CLI 匯入工具、PVE 防火牆規則檢視器、Graylog 內容套件編輯器、Graylog 容量與歸檔規劃、Graylog 設定工作台、LibreNMS 容量計算機、Oxidized 組態工作台、Vector 與 NXLog CE 設定工作台、FIO 效能結果分析器、執行檔效能檢視器。

時間與計算（5 支）

日期時間格式轉換、Cron 排程產生器、網路傳輸時間計算機、工作日計算器、倒數計時與公告看板。

設備與瀏覽器（7 支）

喇叭與聲道、麥克風、攝影機、螢幕與投影、鍵盤、滑鼠測試器，以及瀏覽器環境診斷卡。

這一組有個共同的設計立場：不自動判定。喇叭測試會播左右聲道測試音，但由你自己確認實際聽到什麼；攝影機測試把「要求的解析度」與「實際拿到的解析度」分開顯示。上台簡報前、視訊會議前跑一輪，比現場才發現沒聲音好。

日常常用工具

先從最不起眼、但我開得最頻繁的兩支講起。這兩支的共同點是拿到的檔案常常是客戶的，所以純前端在這裡特別有感。

CSV 格式化檢視器

客戶丟一份匯出的 CSV 過來，用 Excel 打開跳一堆亂碼，用文字編輯器打開又看不出結構。這支就是為了這個情境做的。

編碼支援 UTF-8、Big5、GBK、Shift-JIS、EUC-KR、ISO-8859-1，可以即時切換重新載入，Big5 的舊系統匯出檔終於不用再猜。分隔符號能自動識別，也能手動指定逗號、分號、冒號、Tab 或管線。標題列的判斷也可以自己挑，包括「註解欄之後第一行」這種奇怪但真的會遇到的格式。

載入之後就是一張可以操作的表：全文搜尋、多欄排序、欄位篩選、隱藏欄位、拖曳調整欄序、點兩下編輯儲存格。還有一個我很常用的功能是欄位統計排行，點欄位標題就能看那一欄的值分布與比例，要快速回答「這批資料裡哪種狀態最多」很方便。

顯示上限可以拉到無限制，大檔案也撐得住。整理完可以匯出成 CSV、JSON、TSV、TXT，匯出編碼還能指定要不要帶 BOM，省得回傳給客戶又是一次亂碼。

Diff 比較工具

比對兩份設定檔改了什麼，是維運的日常。手上沒有終端機、或者檔案是從對方信箱裡挖出來的時候，開這一頁最快。

並排顯示、同步捲動、綠紅黃三色標示新增刪除修改，改過的那一行還會做字元級標示，精準指出是哪幾個字變了。右邊有雙軌 minimap 縮圖，長檔案一眼看得出差異集中在哪一段，點一下就跳過去。

比較完可以匯出標準的 unified diff（.patch），A 到 B 或 B 到 A 兩個方向都行，下載回去直接用 patch 套用。兩檔合計超過兩萬行會提示並改用簡化演算法，避免瀏覽器當掉。

一樣要強調：兩份檔案都只在你的瀏覽器裡比對，不會上傳。拿客戶的 nginx 設定、防火牆規則來比也不用擔心。

郵件：標頭與退信

郵件是我花最多時間處理的題目。這兩支一支給 IT 用，一支刻意做給一般使用者用。

Email Header 分析

把郵件標頭整段貼進去，它會把 SPF、DKIM、DMARC、ARC 四項的驗證狀態與網域對齊結果分開列出來，並且畫出完整的傳遞路徑：每一站的伺服器、IP、加密方式與停留時間。

報告裡也會標出常見的風險訊號：顯示名稱偽裝、punycode 網域、回覆位址與寄件位址不一致。頁面下半部還放了一段說明，講 SPF 驗的是信封寄件者而不是你看到的 From、以及為什麼轉寄之後需要 ARC，教育訓練時可以直接開這一頁講。

標頭裡有寄件者、收件者、內部主機名稱與 IP，這些東西貼到別人的線上服務其實不太妥當。這一頁全程在瀏覽器內解析，不查 DNS、不連任何伺服器，所以拿客戶的信來看也沒問題。

郵件退信分析器

這支是我最想推薦給非 IT 人員的一支。

信寄不出去、退信通知跳出來一堆英文和數字，一般使用者的標準動作就是截圖丟給 IT 問「這是什麼意思」。我的想法是：這件事其實可以自己判斷，不用每次都來煩 IT。

把那封退信通知存成 .eml 丟進去，或者直接把郵件原文貼上，它會逐位收件者告訴你：這一位到底送到了沒有、是什麼狀態碼、原因分類是什麼、下一步該做什麼。而且講的是人話，例如「這個收件位址不存在（對方的郵件系統找不到這個信箱）」、「對方的信箱滿了，暫時收不下（多半過一陣子會好）」。

看懂之後多半就知道怎麼處理了：位址打錯就改一下重寄，對方信箱滿了就等等再寄，真的是被政策擋掉才需要找 IT。

它在判讀上的克制程度也值得一提：

「已轉交」不算投遞成功
Action: relayed 只代表交給了下一個系統，之後怎麼處理不在這份通知裡，所以不會被併進「已投遞」那一格。
「延遲中」是通知當時的狀態
通知可能是三天前產生的，畫面上寫的是「通知當時為延遲中」，不會寫成「目前」。
證據程度分三種，沒有百分比
明確欄位、文字線索、資料不足。不會給你「95% 可能是黑名單」這種沒有校準依據的數字。

要交給 IT 的時候也很方便，報告分「客戶摘要」與「技術報告」兩種，可以匯出成 Markdown、HTML、CSV、JSON，還能選擇省略收件位址與診斷原文。當然，整封信從頭到尾都沒有離開那個分頁：不連 DNS、不連 SMTP、不查封鎖名單、不寄信也不重送。

Proxmox VE Ceph：容量與網路

規劃 Ceph 叢集最現實的兩個問題：要買幾顆硬碟、網路要拉多粗。這兩支就是專門回答這兩題，而且是接著用的。

兩支都附了免責聲明，寫得很清楚：計算依據是我的實務經驗與公開文件的整理，不是 Proxmox 或 Ceph 的官方容量規劃建議。這種東西一定要講在前面。

PVE Ceph 容量計算機

填入需要的可用容量、副本策略與 SSD 規格，節點數與每節點 SSD 數量可以留 AUTO 讓它自動配置，也可以自己指定。LZ4 壓縮的節省量也算得進去。

這支我花最多力氣的地方是把容錯講清楚。很多人以為三副本就是「可以倒掉三分之一的硬碟」，其實不是：真正保證撐得住的是「size 減 min_size」個故障網域，三副本就是 1 個。而故障網域一般設在 host，所以預設情況下保證的是「倒 1 台節點」。

如果把節點分成三個機櫃、故障網域設成 rack，那倒掉一整櫃同樣不會中斷。同時倒兩台以上是否安全，要看 PG 剛好落在哪些節點，不保證。要停用特定 OSD 之前，建議直接問叢集比較準：

ceph osd ok-to-stop osd.3 osd.7

算完的配置可以下載成 SVG 或 PNG，直接貼進評估報告或報價單。

PVE Ceph 網路計算機

硬碟都選好了，網路呢？這支從 OSD 的效能反推網路需求：選 OSD 硬碟類型（SATA SSD、SAS SSD，或 NVMe 的 Gen3 x2 到 Gen5 x4）、每節點幾顆、虛擬機的 I/O 負載屬於輕中重哪一級、副本策略，以及網路架構要不要把 Public 與 Cluster 分開。

算法其實不複雜：聚合吞吐除以負載係數就是 Public 流量；用戶端寫進 1 份，主 OSD 還要再送 R 減 1 份給其他節點，那段走 Cluster 網路。但把這幾個數字擺在一起看，很多人會第一次意識到「原來 10 Gbps 根本不夠」。

工具裡也直接寫了一段 corosync 併用的風險：corosync 要的是穩定的低延遲，不是頻寬。跟 Ceph 併在同一組網路上，Ceph 一忙（備份、復原、重新平衡）就可能讓 corosync 逾時，節點被踢出叢集、HA 誤觸發。所以選項裡雖然有「連 corosync 也併用同一組」，但標的是不建議。

務必注意，這裡算的是理論上限。交換器與網路卡規格應該高於計算結果，復原與重新平衡時的流量遠高於平時，正式環境一定要保留尖峰餘裕。

PVE Ceph 網路計算機：Public 與 Cluster 兩段頻寬分開估算

網路維運工具

這三支都是給網管用的，而且都不連你的設備，只讀你拿給它的檔案。

Weathermap 設定檔編輯器

這支是整站最重的一支，沒有之一。

用過 LibreNMS 版 PHP Weathermap 的人都知道，那個 .conf 設定檔要手刻，節點座標、連線、色階、圖例位置全部用文字寫，改完還要回到伺服器上重新產生圖才看得到結果，來回一次好幾分鐘。

這支把整個流程搬進瀏覽器：

即時預覽
載入 .conf 之後直接在頁面上重繪出 Weathermap 的樣子，改一個屬性馬上看得到。這是純前端模擬重繪，不是後端渲染引擎，所以會有些許視覺差異，但拿來調版面完全夠用。
視覺編輯
節點可以直接用拖曳的移動，還有對齊格線（1 到 50px）與自動對齊格點。新增節點、拉連線都用點的。
物件編輯
全域設定、節點、連線、節點與連線的預設值、字型、顏色、色階、圖例位置，全部拆成表單來改，不用再記屬性名稱。
圖示一起帶
可以把 ICON 用的圖片或整包 .zip 拖進來，它會忽略路徑只比對檔名，預覽就能看到真正的設備圖示。
內建文件
附了 PHP Weathermap 0.98a 的完整文件與屬性查詢工具，不用再開另一個分頁翻。

改完匯出 .conf 丟回伺服器就好，也可以匯出 AST 的 JSON。整份設定檔從頭到尾都在你的瀏覽器裡，裡面的內部網段、設備名稱、RRD 路徑都不會外流。

網路連線品質測試

使用者說「網路好慢」，到底是慢在哪？這支挑了一批常用站台，量你這台電腦連過去的延遲。

可以挑分類、勾站台，也有「僅選台灣」的快捷鍵。測試模式分快速（1 次）、標準（3 次）、詳細（5 次），取平均降低網路波動的影響。結果依延遲排序列出來，可以匯出 JSON、CSV，或直接下載 SVG、PNG 附在報告裡。歷史紀錄存在這台瀏覽器裡，可以跟上次比。

量測方式寫得很明白：用瀏覽器原生的 Fetch API 加 performance.now() 量 TTFB（首位元組時間），請求走 no-cors 模式，優先抓 favicon.ico。不經過任何第三方伺服器，量到的就是你這個網路環境到那些站台的實際狀況。

頁面上放了一段安全提醒我覺得很負責：間隔請設 500ms 以上、完整測完等兩分鐘再測，因為短時間重複打人家的站台可能被當成攻擊而封 IP。

Oxidized 組態工作台

Oxidized 拿來備份網路設備組態非常好用，但它的 config 有個惱人的地方：同一個欄位可以寫在五個地方，全域、機型、群組、群組內的機型、設備本身，上層蓋下層，出問題的時候很難講清楚「這台設備最後到底用了哪一組帳密」。

這支就是來回答這個問題的。把 config 拖進來之後，它會照你自己的區塊與階層排出整份設定，每一列附上官方文件寫的預設值與說明。然後有一張「欄位是哪一層決定的」的表：實際會用的值 擺在一邊，各層各寫了什麼 擺在另一邊，一眼就看得出是被誰蓋掉的。而且它把「寫了空字串」跟「沒有這個欄位」分開處理，因為那真的是兩件不同的事。

另外一個細節做得很細：改欄位的時候只換掉那個值本身的那幾個位元組，註解、鍵的順序、引號寫法、!ruby/ 標記全部留在原地，不會整份重排。

帳號密碼類的欄位預設遮起來，因為這個畫面常常會被截圖。要提醒的是「原始設定」那一區是原文，帳密在那裡看得到，要給別人看之前先想一下。當然，這份 config 一樣只在你的瀏覽器裡處理，不會寫進瀏覽器儲存、網址或任何記錄，站台也不會連你的設備、Git 或 API。

WebAuthn 測試器

Passkey 要推了，但推之前得先確定「使用者那台機器到底走不走得完流程」。這支就是拿來當場驗證的。

它先做一輪環境檢查，列出這個瀏覽器與作業系統提供了哪些 WebAuthn 能力，接著讓你建立測試憑證：認證方式可以選系統自動、外接安全金鑰（USB、NFC）或此裝置（Windows Hello、Touch ID），residentKey 與 userVerification 政策也都能指定。建完再跑一次認證，並且在瀏覽器內驗證簽章。

我特別欣賞它把話講得很死的那幾條：

建立成功不等於驗證通過
系統視窗走完只代表流程沒中斷。challenge 是不是本站發的、origin 對不對、rpIdHash 對不對，全部要自己算，所以它的措辭是「註冊資料檢查完成」，不是「金鑰真偽驗證通過」。
UV 通過不代表用了指紋
authenticatorData 裡只有一個「使用者驗證已完成」的位元，沒有任何欄位說得出用的是指紋、臉部辨識還是 PIN。所以它只寫「使用者驗證已確認」。
能力可用不代表實測通過
環境檢查那一區只回答「這個環境提供了哪些 API」，不代表裝置上已經有 Passkey。

測試記錄只存在這個分頁的記憶體裡，重新整理就清空；下載的報告預設去識別化，不含完整的 credential ID 與 userHandle。測完記得到系統或密碼管理器把名稱是 JT WebAuthn Test 的憑證移除。

其他推薦工具

篇幅有限，剩下這幾支只能快速帶過，但都是實際用得上的：

PVE 系統報告檢視器
把 pvereport 拖進來整理成表格，每一個數字都能按「查看來源」跳回原始報告的那幾行，也能直接帶進 PVE 資源計算機做移轉評估。
Graylog 容量與歸檔規劃
從來源採樣一路算到歸檔容量，估算依據會標明是實測還是待校準，容量單位也一律標明是十進位還是二進位。
LibreNMS 容量計算機
估 RRD 會吃多少空間、能留多久。它會提醒你各層 RRA 的保存跨度不可以相加，那是很多人算錯的地方。
OPNsense 設定分析器
讀 config.xml 盤點設定、整理 Alias、離線靜態檢查防火牆規則，也能載入第二份備份做逐項比對。
Zimbra 目錄分析器
讀 zmslapcat 匯出的 LDIF，盤點網域與帳號、反查誰在哪些群組裡，並產生 zmprov 指令草稿讓你自己拿去跑。
SNMP 結果分析
貼 snmpwalk 的輸出，逐筆解析並保留原始行號與型別，還能檢查有沒有 LibreNMS 要的關鍵欄位。
安全標頭檢查器與 CSP 規則設計器
貼 curl -D 的輸出檢查 HSTS、CSP、Cookie 與跨來源設定。它不給 A+ 分數，因為把「待確認」壓進一個數字，等於把不知道的事說成通過。

站台設計原則

寫這些工具的時候，有幾件事是從頭貫徹到尾的，也是我覺得比工具數量更值得講的部分。

資料只在瀏覽器內處理
再講一次，因為這是最重要的一條：完全純前端，沒有後端伺服器接收你貼進去的內容。客戶的郵件標頭、系統報告、防火牆設定檔、Oxidized 的帳密，貼進來都不會外流。
不給假精準的數字
算不出來的就標示「待校準」或「資料未取得」，不會用預設值湊一個好看的結果出來，也不會給沒有校準依據的百分比。
認不得的東西不會靜默丟掉
解析不了的行、認不出的條件，一律另外列出來讓你看到，而不是當作沒發生過。
整理過的數字要指得回原文
PVE 系統報告檢視器與 Zimbra 目錄分析器都做到這件事，每一筆都指得回原文的哪一行。
明說做不到什麼
每支工具都有一段使用說明，寫清楚它刻意不做的事，避免使用者誤以為已經檢查過了。