【github】利用PicGo免費部署Github圖牀

今天在csdn上看到了一個新的概念“圖牀”,百度了一下,發現和筆者最近關注的markdown有些關係,就順便總結學習一下。

1.圖牀

2.建立Github圖牀倉庫

3.圖牀管理工具

3.1 PicGo下載安裝

3.2 PicGo的配置 

3.3 PicGo的使用

3.3.1 圖片上傳

3.3.2 刪除圖片

3.3.3 複製圖片的URL

3.4 PicGo插件使用


1.圖牀

圖牀,是專門儲存圖片的空間,同時允許你爲圖片創建鏈接的網上空間。

這裏給新手舉個簡單的例子,當我們用csdn提供的富文本編輯器編輯博客時,我們上傳文件只需要Ctrl+C,再Ctrl+V就行了,但是大家有沒有想過,你的本地圖片肯定要上傳到服務器纔行,同時,右鍵你上傳的圖片,選擇圖像屬性,你可以看到URL裏面的鏈接。其實,這個鏈接我們可以在任意的地方使用,我們甚至可以在本地新建一個網頁,然後在網頁中加入一個a標籤,標籤的href屬性設置爲該URL,就可以看到這個圖片了,這個過程其實和圖牀很類似。

當下流行使用markdown寫博客,在寫作的過程中,就會遇到需要在博文中插入在線圖片鏈接的問題,這個時候就需要一個人圖片倉庫。

圖牀通過對外提供該圖片的網絡鏈接地址,使得我們可以像訪問博客網站一樣訪問圖片,我們只需要在markdown博客中插入對應的圖片鏈接即可。目前圖牀可以分爲如下兩種:

  • 公共圖牀
  • 自建圖牀:雲服務和開源方案

公共圖牀也就是利用公共服務的圖片上傳接口,來提供圖片外鏈的服務,比如「微博圖牀」。自建圖牀,也就是利用各大雲服務商提供的存儲空間或者自己在 VPS 上使用開源軟件來搭建圖牀,存儲圖片,生成外鏈提供訪問,比如七牛雲、Lychee 開源自建圖牀方案。

自建圖牀方案有兩種,一種是利用雲服務商提供的存儲服務來作爲圖牀,通過 API 來管理圖片,另一種是在 VPS 上安裝開源的圖片或文件管理程序,只要能提供外鏈,基本都可以作爲圖牀來用。

值得注意的是,圖牀服務的一個最重要的特性是穩定性,因此,對於筆者這種沒有購買雲服務器的普通玩家,當然選擇我們的Github作爲圖牀工具啦。

有一點需要大家牢記的是,Github真的是一個好工具,它不僅可以搭建靜態網站,同時,也能夠提供給我們一個免費的巨大存儲空間,因爲一個倉庫容量是巨大的,所以用它去創建一個圖牀將是一個非常明智的選擇。

2.建立Github圖牀倉庫

首先,我們需要建立一個公有的Github倉庫,用來存放我們上傳的圖片。

創建完成後,點擊右上角的個人頭像出現下拉菜單,然後點擊Setting,然後點左側菜單的最後一個 Developer setting,然後再點左側菜單的最後一個 Personal access tokens,然後在右側有一個 Generate new token 的按鈕,點擊它,然後選擇 repo,然後直接拉到最下面點擊綠色的按鈕 Generate token。之後會生成一個 token碼,需要注意的是這個token只顯示一次!所以可以先把他複製保存的其他地方。

 

3.圖牀管理工具

3.1 PicGo下載安裝

這裏推薦使用PicGo這個軟件,它可以很方便的把我們想要保存到圖牀的圖片直接上傳到我們的圖牀(這裏我們指的是github倉庫),併產生一個鏈接供我們在文章中使用,而不需要我們自己打開瀏覽器再打開github再一步步的上傳圖片然後再找鏈接地址。這是一款圖片上傳的工具,目前支持微博圖牀七牛圖牀騰訊雲又拍雲GitHub等圖牀,未來將支持更多圖牀。

所以解決問題的思路就是,將本地的文件,或者剪切板上面的截圖發送圖牀,然後生成在線圖片的鏈接,這樣就可以讓Markdown文檔飛起來了,走到哪就可以用到哪。這裏給出其相關地址:

如果下載速度太慢,您也可以直接在西西軟件園下載:下載地址

3.2 PicGo的配置 

  • 倉庫名:按照“賬戶名/倉庫名”的格式填寫;
  • 分支名:統一填寫爲“master”;
  • Tocken:將之前的Github的Token黏貼在這裏;
  • 存儲路徑:若設置爲img/,則會在repository下創建一個“img”文件夾;
  • 自定義域名:在上傳圖片後成功後,PicGo會將“自定義域名+上傳的圖片名”生成的訪問鏈接,放到剪切板。這裏約定遵循如下的格式:域名/用戶名/倉庫名/分支名。

3.3 PicGo的使用

3.3.1 圖片上傳

直接拖拽即可實現文件上傳。

這裏需要注意的是,如果您沒有啓用使用時間戳命名,上傳同一個文件會報錯。

啓用後,不再報錯,可以上傳相同的圖片。 

 

3.3.2 刪除圖片

刪除圖片的方式也非常簡單,只需要點擊垃圾桶按鈕,就可以直接查看或者刪除圖片了。

注意,這裏的刪除並非是直接刪除,實際上github中任然存在。

3.3.3 複製圖片的URL

點擊複製按鈕可以直接複製Markdown鏈接地址:

![](https://raw.githubusercontent.com/jack13163/GithubPicBed/master/img/fbb2d0781b3dd9a318c01b00f51c560e.jpg)

點擊編輯可以顯示圖片的URL信息: 

3.4 PicGo插件使用

PicGo的2.X版本支持插件功能,插件地址可以通過點擊下圖中的插件設置中的購物籃按鈕找到。

現在具有的插件如下: 

這裏主要介紹:自動複製插件,它用於上傳後自動複製url到剪貼板,插件github示例地址

講到這裏,就結束了,其實相當於我們利用github作爲存儲的地方,做了一個在線的圖片倉庫。歡迎大家在遇到問題時,在評論區留言討論。最後看一下github,確實上傳成功了。

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章