Github + jsDelivr + PicGo 免費打造全球 CDN 分發圖床
文章目錄
Photo by Lisa Fotios from Pexels
終於到了這一天，一切都改變
自從換了靜態部落格後，我一直以來都使用免費的 Imgur 作為圖床，但是去了中國大陸後才發覺原來 Imgur 的訪問速度在中國這麼慢，那時候我開始針對中國的網路環境寫一些教學，也希望我的部落格不管在哪裡都能快速開啟，為了讓中國網友瀏覽本部落格時也有良好的瀏覽體驗，我開始將圖片改上傳至 SMMS 圖床。
棄坑原因
SMMS 在之前文章有說過是中國網路圈裡面的一位大佬 Showfom 所架設，託管於他自家的主機極雲，擁有多線 CDN，對各國使用者連線友好，也是中國知名技術討論區 V2EX 指定用圖床，雖然免費好用，不過我這邊不是在為 SMMS 打廣告，有一天我朋友跟我說他之前上傳於 SMMS 的圖片被刪了，果然一看他的文章好多圖片都 404 了，SMMS 使用者條款也說會刪除不符合國家法律規定的圖片，這時我意識到不能完全將圖片託管到一個平台上，要是哪天平台無法營運或是莫名刪除圖片就得不償失，於是我開始尋找自建圖床的方案。
解決方案選擇
目前我蒐集來的自建方案如下：
- 阿里雲 OSS+CDN(要錢但不貴，CDN 覆蓋全中國)
- 七牛雲/又拍雲(七牛 HTTPS 流量要收費，而且每月免費流量僅 10G)
- Github + jsDelivr(全球分發 CDN，但 Github 個人倉庫僅有 1G 空間)
- Cloudflare+Backblaze B2(Backblaze B2 與 Cloudflare 之間無傳輸費用，並免費提供 10G 空間，但 Cloudflare 中國連線速度貌似不佳)
我的需求是中國連線速度快、請求次數高，但價格不能太高，如果能免費自然最好，還有圖片不能因為政治因素或其他原因被移除，經過綜合考量，我選擇了 Github + jsDelivr 方案，Github 背後有微軟爸爸，穩定性應該不用多說，jsDelivr 也是全球知名的免費 CDN 服務，在中國大陸也有節點可用，同時兼顧連線速度和價格。
更新：jsDelivr 在 2021/12/20 域名備案被吊銷，其中國 CDN 服務商網宿移除了 jsDelivr 帳號，目前在中國使用 Fastly 線路。
建立 Github 倉庫
需要先開一個新的倉庫，記得設成公開 jsDelivr 才能分發。
到 Github 的個人設定點擊「Generate new token」按鈕。
Token description 隨便填，scopes 要把 repo 全選。
產生的令牌僅會顯示一次，請妥善保存。
圖片上傳工具 PicGo
這邊使用眾多文章推薦之開源跨平台的強大圖床上傳工具 PicGo，可以方便將圖片上傳至 Github 並直接複製圖片網址到剪貼簿中。
安裝
Windows 平台使用者直接到 PicGo 的 Github Releases 下載最新版執行即可，Linux 的話有提供 AppImage 的安裝，Arch 系的可以直接安裝 AUR 的 picgo-appimage 包。
安裝完 AUR 裡的 picgo-appimage 後提示我版本要更新，但是經過測試最新測試版 2.3.0 在 Arch Linux 中無法啟動，所以還是使用穩定版。
|
|
開啟後螢幕中間會出現一個 PicGo 的圖示，在上面點擊右鍵按「打開詳細窗口」。
設定
側邊欄 圖床設置 > GitHub 圖床，填入以下資訊：
- 倉庫名稱：
使用者名稱/倉庫名稱 - 分支名：沒有另外建分支的話就填
master - 設定 Token：填之前在個人設定申請到的令牌
- 指定儲存路徑：如果寫
img/，會在倉庫根目錄建立img目錄，並將圖片上傳到裡面，記得結尾一定要加/，否則會變成圖片檔名的一部分 - 自定義域名：上傳後會複製到剪貼簿的域名，PicGo 會按照「域名/檔案名稱」產生連結，我們要用 jsDelivr 分發，所以要改成 jsDelivr 的網址，這裡填
https://cdn.jsdelivr.net/gh/使用者名稱/倉庫名稱，詳細請看 jsDelivr 的請求網址寫法
記得按「確定」存檔，並設為預設圖床。
上傳
側邊欄點擊「上傳區」，記得確保上面顯示 Github 圖床，上傳成功後會將網址複製到剪貼簿中，如果同時上傳多張圖片，則會用空格換行，建議是一次上傳一張。
上傳成功後會出現通知提醒，進度調跑完要等一會才能獲得網址。
使用 jsDelivr 分發之後可以明顯發現文章載入的速度幾乎秒開，圖片也都備份在 Github 不怕丟失。
再也沒有煩惱，一切都是愛
Reference
文章作者 Chun Yu
上次更新 2020-07-29