零成本搭建個人博客之圖床和cdn加速
本文屬於零成本搭建個人博客指南系列
為什麼要使用圖床
- 博客文章中的圖片資源文件一般採用本地相對/絕對路徑引用，或者使用圖床通過外鏈進行引用展示。本地引用的弊端我認為在於：
- 圖片和博客放在同一個代碼託管倉庫，會導致頁面加載和構建速度隨着圖片數量和體積變大導致緩慢。
- 本地寫作圖片路徑和靜態頁面生成後的圖片路徑實際上是不一樣的。例如我在編寫時引用的是
/static/images/1.png，靜態構建後，該圖片實際路徑變成了/images/1.png，如果手動修改，那麼本地預覽效果則大打折扣。（每個博客框架有一些解決方案，不太通用就不提了）。 - 不易於分享：當分享本地文章時，由於圖片是基於本地的，所以無法分享。
- 使用圖床優點：
- 圖床缺點：各類廠商圖床可能存在的問題包括但不限於：存儲空間和流量免費付費問題。穩定性、安全性。我會在下文圖床選擇中根據不同廠商情況簡單提及，有需求的用戶可以順着思路去了解。
圖床選擇
- 國內大廠的對象存儲服務：騰訊雲阿里雲七牛雲都有自己的對象存儲服務。用戶可以創建自己的存儲桶，上傳文件後自動生成外鏈訪問。
- 優點：存儲費十分便宜，0.01元/GB左右。當作圖床基本無需擔憂費用。
- 缺點（風險）：流量費用很高，這裡流量指的是用戶通過外鏈訪問或者下載資源時會生成流量。以騰訊云為例，0.5元/GB流量費用，如果是個人當博客圖床小範圍使用還好。當訪問量上升，或者外鏈被他人分享使用，就有可能導致費用暴漲，更不用提如果被惡意下載刷流量。目前個人已知的存儲桶只能設置上限預警，在欠費幾小時後被動關閉。（七牛雲各種免費額度很高，不過需要備案域名）
- 解決：使用cdn加速來大幅度減少流量費，同時cdn設置上限閾值。隱藏文件原鏈接，設置防盜鏈等方法。這樣已經能很大程度降低天價賬單的可能性，同時正常使用也不容易碰到惡意攻擊的情況。
- 使用現成圖床：例如SMMS圖床服務。優點是有免費額度，也有付費選項，無需擔心上述費用過高問題。缺點：需自行選擇穩定圖床廠商，因為有跑路風險。
- 白嫖(不推薦) ：使用github、gitee、甚至是csdn、新浪微博等。優點：完全免費，可以把圖片上傳到任意能上傳的位置。缺點：首先個人是不推薦，例如github、gitee被當作圖床有可能遭到封禁。同時一旦白嫖網站加入了防盜鏈規則，那麼博客圖片直接全部報廢，例子有gitee和微博。
- 使用國外大廠的對象存儲服務：本質上和國內對象存儲服務類似，只不過有些優惠力度很大。例如backblaze，又稱B2(我個人推薦同時也是本篇博客圖床最終使用的對象)。好處有：
- 它的免費計劃包括：存儲桶前10GB免費、每天1GB下載流量、2500次B、C下載請求次數。並且它的存儲費用在幾個大廠對比是最便宜的。
- 存儲桶無需擔心天價流量費：結合cloudflare免費的cdn加速，以及cloudflare迴流到backblaze的流量免費（迴流：當請求到cdn結點發現該資源不存在或者需要更新，cdn會去backblaze獲取最新文件），對於白嫖黨來說應該算很香了。同時我諮詢客服惡意下載問題，客服回應當超過自己設置的上限，會暫停下載，直到用戶支付了正常的上限金額後正常開放（免費則是等待第二天免費額度恢復即可）。最後一點我還沒有親自測試過。
- 缺點：免費版cf在國內沒有結點，可能加速變成減速，不過cf還是較穩定。後期如果想加入付費計劃，可能需要準備一張全幣種信用卡。
- 它的免費計劃包括：存儲桶前10GB免費、每天1GB下載流量、2500次B、C下載請求次數。並且它的存儲費用在幾個大廠對比是最便宜的。
圖床搭建
-
首先進入backblaze, 創建一個賬號，點擊右上角 My Account，然後創建一個桶。
設置public可以用外鏈訪問（如果設置Private，結合cdn使用訪問授權只有七天，需要不斷更新）。
-
點擊upload嘗試上傳一張圖片，然後在桶文件列表裡查看。
通過url即可訪問。
-
設置緩存。打開Bucket Settings。輸入參數
{"cache-control":"max-age=172800"}，意味着下文設置的cdn讀取一次資源後，會緩存並且隔172800s後才過期重新讀取。如果在cdn中設置了資源緩存時長，這個bucket時長相當於無效，但還是當作一個備用方案使用。
需要注意，時間設置過長，相同路徑的資源如果發生修改，會在緩存時間到期後才能更新，過短則回源次數變多，自行考慮即可（我當作圖床，理論上大一點沒事）。
cdn加速
在圖床選擇時說過，存儲桶流量費很貴，所以我們要通過cdn緩存內容，減少流量費。我這裡選擇的是Cloudflare，自帶https支持，免費流量，免費次數，迴流B2免費。
-
進入CF指定域名的控制台
-
點擊DNS，添加CNAME(Target 是 B2存儲桶的Friendly 域名)
-
我們也可以自行設置相關資源的緩存規則。
-
為了不暴露源桶域名，我們需要對域名進行重寫。網上教程有很多使用Workers，如今CF推出了Transform Rules，更快更方便。進入URL Rwrite。
然後輸入即可。
concat("/file/桶名",http.request.uri.path)，意思是在域名後添加括號里的兩個參數。
-
可以打開桶內圖片，然後試着修改前面的域名，訪問成功即可。
圖床結合PicGo使用
我不想每次上傳圖片都得打開網站，所以使用PicGo上傳圖片。
- 傻瓜式下載安裝PicGo。
- 因為B2支持S3，所以PicGo通過插件列表安裝S3插件。
- B2生成App Key，點擊左側鏈接，然後點擊 Add a New Application Key 。
注意Allow listing一定要選中，Duration不填代表永久有效。 - 生成的key只會出現一次，可以自行保存，也可以重新創建。
- 點擊PicGo軟件左側圖床設置，選中Amazon S3（裝了插件才有），將對應key信息填入即可。配置完畢即可自行上傳。如遇報錯大概率是某行信息複製粘貼時多了空格，或者是EndPoint忘填，自行檢查。
注意Allow listing一定要選中，Duration不填代表永久有效。
至此，博客站點的基礎功能已經實現完畢，剩下的可以根據自己需求隨意DIY了。
