GitHub + jsDelivr + PicGo + Imagine 打造穩定快速、高效免費圖床
- 2019 年 11 月 13 日
- 筆記
GitHub + jsDelivr + PicGo + Imagine 打造穩定快速、高效免費圖床
前言
為什麼要使用圖床呢？
因為在不同平台發布同一篇文章的時候，最一個痛苦的點就是，圖片存儲問題，各個平台的文件存儲方式各不相同，無法直接 Ctrl + C 的方式一鍵搞定，為了解決這個問題，使用 MarkDown + 圖床 的方式進行文章的寫作，將圖片放到一個統一的地方，在文章中引入圖片外鏈。
所謂圖床，就是將圖片儲存到第三方靜態資源庫中，其返回給你一個 URL 進行獲取圖片。MarkDown 支援使用 URL 的方式顯示圖片，我想這也是程式設計師為什麼對其偏愛的原因之一。
作為程式設計師，你會發現，現在很多論壇和社區都開始支援使用 MarkDown，如果你沒使用圖床的情況下，你分享同一篇文章，你要在不同的平台，各自重新編輯排版一遍和上傳圖片一次。
有了圖床，情況就不一樣了，Ctrl+C 的方式就搞定了，根本不用再 Check 文章內容一遍。
圖床的選擇？
微博圖床：以前用的人比較多，從 2019 年 4 月開始開啟了防盜鏈，涼涼SM.MS：運營四年多了，也變得越來越慢了，到了晚上直接打不開圖片，速度堪憂其他小眾圖床：隨時有掛掉的風險Imgur 等國外圖床：中國訪問速度太慢，隨時有被牆的風險大廠儲存服務：例如七牛雲、又拍雲、騰訊雲COS、阿里雲OSS等，操作繁瑣，又是實名認證又是域名備案的，麻煩，而且還要花錢（有錢又不怕麻煩的當我沒說）GitHub 圖床：免費，但是中國訪問速度慢（不過沒關係，利用jsDelivr提供的免費的 CDN 加速 速度足夠了）
使用流程
- 新建 GitHub 倉庫
- 生成一個 Token
- 配置 PicGo 並使用 jsdelivr 作為 CDN 加速
- 使用 Imagine 進行圖片壓縮
- 上傳圖片到 PicGo 並使用圖床
新建 GitHub 倉庫
- 登錄/註冊 GitHub
- 新建一個倉庫，填寫好倉庫名
- 倉庫描述
- 將許可權設置成
public - 根據需求選擇是否為倉庫初始化一個
README.md描述文件
生成一個 Token
- 點擊用戶頭像 -> 選擇
Settings
- 點擊
Developer settings
- 點擊
Personal access tokens
- 點擊
Generate new token
- 填寫
Token描述，勾選repo，然後點擊Generate token生成一個Token
- 獲取
Token密鑰
注意這個 Token 只會顯示一次，自己先保存下來，或者等後面配置好 PicGo 後再關閉此網頁
配置 PicGo 並使用 jsdelivr 作為 CDN 加速
-
設定倉庫名：按照
用戶名/圖床倉庫名的格式填寫 -
設定分支名：
master -
設定 Token：粘貼之前生成的
Token -
指定存儲路徑：填寫想要儲存的路徑，如
img/，這樣就會在倉庫下創建一個名為img的文件夾，圖片將會儲存在此文件夾中 -
設定自定義域名：它的的作用是，在圖片上傳後，PicGo 會按照
自定義域名+上傳的圖片名的方式生成訪問鏈接，放到粘貼板上，因為我們要使用jsDelivr加速訪問，所以可以設置為https://cdn.jsdelivr.net/gh/用戶名/圖床倉庫名
Q：什麼是 jsdelivr ? A：jsDelivr 為開發者提供免費公共 CDN 加速服務使用 Imagine 進行圖片壓縮
通常情況下，圖片大小都是超過 200KB 的，所以網頁載入的時候會特別慢，一般我們會對圖片進行壓縮，這裡我推薦 Imagine（點擊下載） 支援全平台。
Imagine 採用的是有損壓縮，介意的可以忽略這一步
順便推薦一個無損壓縮的網站：https://tinypng.com/
上傳圖片到 PicGo 並使用圖床
配置好 PicGo 後，我們就可以進行高效創作了，將壓縮後的圖片拖拽到上傳區，將會自動上傳並複製訪問鏈接，將鏈接粘貼到博文中就行了，訪問速度杠杠的
此外 PicGo 還有相冊功能，可以對已上傳的圖片進行刪除，修改鏈接等快捷操作，PicGo 還可以生成不同格式的鏈接、支援批量上傳、快捷鍵上傳、自定義鏈接格式、上傳前重命名等，更多功能自己去探索吧！
歡迎訪問我的個人部落格：https://sitoi.cn
