主要內容概要
介紹透過 CloudFlare Worker 搭建免費的圖床的方法，解決 blog 中圖片儲存、管理的問題。配合 PicGo 和 Obsidian 圖片上傳外掛，簡化圖片處理流程。 涉及第三方平台
- CloudFlare：雲端服務平台，使用平台的 worker 能力，實現圖床的能力。
- Github：原始碼託管平台，呼叫 worker 的功能程式碼託管在這裡。有新增的功能，或者 fix bug，需要更新程式碼。
- Telegraph：圖片真正儲存的平台，只提供上傳功能，暫未開發刪除 API。
核心工作流程
自建圖床的基本功能
- 上傳圖片，支援兩種上傳方式：web 頁面上傳 和 PicGo 客戶端上傳
- 圖片管理，包括刪除、屏蔽、圖片審核等。
- 支援 picGo 客戶端，配合 picGo 外掛，可以對圖片進行壓縮，降低圖片大小。
圖床的限制
- 圖片大小，最大 5M
- 免費額度限制
- 上傳/刪除次數 < 1000 次/天。可以理解為每天最多寫入 1000 次。
- 圖片展示 < 100000 次/天。可以理解為每天最多請求 10 萬張圖片。如果開啟了 CloudFlare 快取，命中快取的請求不佔用額度。
- 如果免費額度使用完成，建議開通 CloudFlare Worker 付費計劃，每月 5$。
自建圖床流程
自建圖床的流程，有兩個版本，基礎版和 pro 版。基礎版可以保證可用，搭建簡單，10 分鐘可以搞定；pro 版本搭建過程相對複雜，需要 2 小時 左右，如果中間有卡點，時間會膨脹得很厲害，pro 功能更加豐富，可自訂程度高。
| feature | basic | pro |
|---|---|---|
| 圖片上傳 | ✅ | ✅ |
| 圖片 url 複製 | ✅ | ✅ |
| 圖片檢視 | ✅ | ✅ |
| 管理後台 | [x] | ✅ |
| 自訂域名 | [x] | ✅ |
| 圖片管理 | [x] | ✅ |
| 圖片上傳客戶端 | [x] | ✅ |
| 圖片壓縮 | [x] | ✅ |
| 批次上傳 | [x] | ✅ |
| 圖片重新命名 | [x] | ✅ |
| 圖片審核 | [x] | ✅ |
| Obsidian 自動上傳 | [x] | ✅ |
大家可以按需選擇不同的版本。
Basic 版本搭建流程
Fork 程式碼
- fork 倉庫 telegraph-image 也可以選擇原作者維護的版本 origin telegraph-image
連接 CloudFlare
登入到 cloudflare 平台，選擇 Workers 和 Pages 功能。在右側頁面點擊 建立應用程式
- 選中 Pages
- 連接到 Git
- 選擇剛才 fork 的倉庫
- 開始設定
- 儲存並部署（deploy）
完成之後，等待部署。部署成功之後，會有一個地址，如果部署成功，這個地址就是上傳的頁面。
測試上傳
測試上傳功能的方法很簡單，隨便找一張大小不超過 5M 的圖片，上傳後能夠看到可以存取的 url 地址。
Pro 版本搭建流程
pro 版本流程相對於 basic 版本，主要增加了設定項以及和 PicGo 客戶端的聯動。流程圖中主要體現新增的功能，基礎功能可以參考 basic 版本流程圖。
設定管理功能
支援的管理功能主要包括三項
- 開啟管理後台
- 支援圖片管理功能
開啟管理後台
在 CloudFlare 部署後台，進入 Settings -> Functions -> KV。我們需要在這裡設定一對 KV
- img_url：變數名。
- image：在 KV 目錄下的命名空間，沒有可用的，可以新建一個。
完成後，在部署的 URL 後面加上 /admin，就可以進入管理後台了。如 https://img.imesong.com/admin
管理後台增加登入驗證
如果管理後台沒有權限管控，基本的登入驗證都沒有，好比家裡後堂敞開大門，心裡還是有點不放心。開啟登入驗證的功能很簡單，新增兩個設定即可。 在 CloudFlare 部署後台，進入 Settings -> Environment variables
新增的兩個變數名
- BASIC_PASS：密碼
- BASIC_USER：使用者名稱 後面的 value 就是登入時需要輸入的內容。管理後台設定完成後，內容大致如此
自訂域名
CloudFlare 部署完成後，會自動分配一個可用的域名。如果有需要使用自己定義的域名，可以設定 DNS 到自己的域名上。自訂域名的設定和普通網站解析相同，不再贅述具體的規則。
- CNAME：新增一個二級域名，指向 CloudFlare 部署後生成的地址。大約 5 分鐘生效。
PicGo 客戶端
[PicGo](https://github.com/Molunerfinn/PicGo 是一款圖片上傳客戶端，有豐富的第三方外掛。這裡介紹如何在 PicGo 中設定自訂圖床，將圖片上傳到我們剛設定完成的平台上。
安裝 PicGo 客戶端
PicGo 客戶端可以在 github 上 下載最新的版本，直接雙擊安裝包，完成安裝流程。
**安裝 telegraph-image 外掛
picGo 預設支援很多圖床，比如阿里雲、騰訊雲、七牛雲等，但我們搭建的圖床需要不同於這些已有的，需要安裝第三方外掛，設定自訂圖床。 外掛安裝後，設定很簡單，只需要把上傳圖片的 URL 填進去就可以。
picGo 還有很多實用的外掛，可以參考這裡更多 picGo 外掛推薦
Obsidian 中自動上傳圖片到圖床
如果日常習慣使用 Obsidian 編輯文字、記筆記，可以使用 Image auto upload plugin 外掛，配合 PicGo，將文件中的圖片自動上傳到圖床上，讓我們的寫作流程更加流暢。
- 安裝 Obsidian 外掛市場，搜尋關鍵字 Image auto upload
- 安裝外掛並開啟外掛
- 設定外掛：使用預設設定即可，picGo server 端口號 36677
測試上傳
- 單個上傳
- 剪貼簿上傳
- 批次上傳/資料夾上傳
- Obsidian 外掛自動化上傳
驗證上述三種上傳方式後，關於圖床的搭建、設定及使用工作流程基本完成。
AI Summary
以下內容是 AI 對本文的總結，供大家參考
本文介紹了如何使用 CloudFlare Worker 搭建一個免費的圖床，並透過與 PicGo 和 Obsidian 外掛的配合，實現圖片的簡化管理和自動化上傳，解決了部落格圖片儲存和管理的問題。
關注微信公眾號 技術後花園 獲取更多資訊
