關於寫做(2)：使用七牛雲做爲圖牀獲取外鏈方式總結（已更換爲使用PicGO+騰訊雲COS）

1、圖牀的選擇

1. 什麼是圖牀？

不少技術人寫做都有在用 Markdown 輕量級標記語言進行博客寫做，這種寫做讓咱們不用像使用 Word 那麼麻煩調整排版和格式，而只需專心寫做照樣完成排版的一種寫做方式。可是，基本全部支持 Markdown 本地寫做工具都只能採用導入本地圖片引用的方式，對於一篇須要大量圖片闡述的文章，或者是文章發佈於網絡後圖片丟失問題，這不得不是常常要面對的問題。

那麼有什麼比較好的解決方式嗎？哈哈，有的。不少人採用的圖片寄存於網絡，用服務廠商做爲圖片存儲的地方，你們稱爲圖牀。好了，那像 CSDN 博客、簡書平臺不是均可以作到圖片存儲嗎？是的，在這些平臺寫文章的時候能夠經過上傳圖片而後獲得一個圖片網絡地址，但當圖片數量多，一張一張上傳，這也是很是麻煩，另外，也是擔憂萬一人家平臺作防盜鏈呢（不瞭解防盜鏈話自行谷歌下~）。其實咱們想要圖牀功能，有不少專業的服務商免費提供必定容量和流量可讓咱們方便幹這些事情，好比七牛雲。

2. 圖牀種類

谷歌搜索下圖牀能搜到不少圖牀網站，列舉一些供參考使用：

• 極簡圖牀 默認公共圖牀使用 sm.ms、微博圖牀，能夠自定義支持七牛，界面簡潔美觀，支持 Chrome 插件，註冊後還能夠同步上傳歷史。
• 路過圖牀
• Qchan圖牀
• 小賤賤圖牀
• SM.MS - SM.MS 由 V2EX @Showfom 自建的，無外鏈限制，無流量限制的圖牀，支持 HTTPS，速度不錯。
• 微博圖牀

(1) 圖牀分類

• 公共圖牀
• 自建圖牀：雲服務（如七牛雲、又拍雲、阿里雲 OSS）
• 自建圖牀：開源方案 （如 Lychee 開源方案、樹洞外鏈）

目前圖牀能夠分爲兩種，一種是公共圖牀，一種是自建圖牀。

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

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

圖牀服務最重要的是穩定性，大廠的雲服務也都比較有保障，你們只要考慮下價格和易用性就能夠了。就我我的而言，我首先推薦七牛，它的價格比較厚道，免費用戶也有必定額度，數據能夠本身掌控，另外各大平臺的圖牀工具也基本都支持，易用性很高。其次推薦微博圖牀，對於不是很重要的圖片，均可以存到微博圖牀，畢竟流量存儲都免費，速度也不錯。至於圖牀工具，就看本身的喜愛了，只要順手就行。可是不論選擇哪個服務或者工具，我以爲首先要本身能夠掌控數據。

總之，適合本身的纔是最好的。

(2) 圖牀工具

雖然圖牀選擇好，可是對普通用戶來講，直接使用圖牀 API 很麻煩，咱們能夠藉助一些工具方便的上傳圖片，下面就根據 macOS、Windows、Web 分別推薦幾款工具。

macOS：

• iPic - Markdown 圖牀、文件上傳工具

• MWeb（Markdown 寫做工具，也支持上傳圖片）

Windows：

• MPic-圖牀神器

Web：

• 好比「極簡圖牀」插件、「微博圖牀」等等

2、七牛雲圖牀使用

關於七牛雲的介紹：七牛是一個雲存儲服務商，註冊並實名認證以後，你將免費享有 10GB 存儲空間，每個月 10GB 下載流量、100 萬次 GET 請求、 10 萬次 PUT/DELETE 請求。七牛的定位不是像百度雲同樣的網盤 ，也不是同堅果雲通常的同步雲 ，而是 CDN，讓你在瀏覽網頁的時候最快的接收到頁面中的圖片、音頻等文件，因此很是適合我的、企業用戶用來儲存站點資源。對於我的博主來講，你能夠把博客中的圖片、音頻、視頻等媒體上傳到七牛，在博客中引用；也能夠將站點須要加載的 CSS、JS 等文件上傳到七牛，以加速網站。

1. 最原始上傳

①到 七牛雲 網站註冊；

②實名認證（實名認證了才能享受 免費 10Gb 存儲空間；實名認證須要「本人手持身份證」的正反面兩張照片，請提早準備好）；

③點擊「管理控制檯」；

④「資源主頁」--> 點擊「對象存儲」，當即添加（即建立存儲空間，七牛雲把這個叫做」Bucket「），其中包括如下三個項：

• 存儲空間名稱：存儲空間名稱做爲惟一的 Bucket 識別符
• 存儲區域：區域選擇本身附近的
• 訪問控制：做爲圖牀的話，訪問控制只能選擇爲「公開空間」

點擊建立，Ok。

⑤而後打開存儲空間，選擇內容管理，點擊上傳文件，上傳你所須要用到的圖片；

⑥上傳完成後，在存儲空間文件列表中點擊某一文件的右側按鈕，能夠看到外鏈地址，複製粘貼便可用。

如今來梳理下一張圖片上傳圖片所經歷的步驟：

1. 登陸打開七牛雲網頁我的存儲空間
2. 上傳圖片
3. 複製外鏈
4. 粘貼到 Markdown
複製代碼

一張圖片用了四步吶，要是圖片不少，那不是做死嘛。有什麼方法解決方便快捷上傳嗎？固然有，方法有三個：

1. 七牛雲插件上傳：簡單

2. 使用 dropzone 上傳：方便

   • 使用Dropzone和七牛優化博客圖牀
   • Mac OS 圖牀運用優化模式 - Microdust

3. 使用命令行上傳：快捷，尤爲適合須要目錄及協做的團隊

   官方有個「開發者工具」頁面，提供一些工具進行上傳，包括後面講的 qshell， 其中有個「QSunSync」的 Windows 版本圖片同步上傳客戶端。

2. 七牛雲插件上傳：簡單

瀏覽器插件 qiniu upload files

七牛雲插件，像使用桌面系統同樣管理你的七牛雲空間；支持拖拽上傳，批量操做，文件處理等功能

如何操做：www.jianshu.com/p/44d818f78…

還能夠利用在線「極簡圖牀」工具，默認使用的爲公共圖牀 sm.ms，可是也能夠自定義的，自定義圖牀爲七牛雲圖牀，方法以下：

在最前面有關七牛雲的註冊等等操做，前面已經講了，不絮叨了，以後：

1. 在「我的面板」->「密鑰管理」中查看 AccessKey/SecretKey；
2. 在儲存空間的「空間概覽」裏，記住這裏的「測試域名」；
3. 在「極簡圖牀」上配置上剛纔七牛儲存的「空間名稱」、「AccessKey」、「SecretKey」、「域名」後，保存。而後就能夠上傳到本身專屬的七牛空間上了。

「AccessKey」、「SecretKey」：在「我的面板」->「密鑰管理」中查看AccessKey/SecretKey；

「域名」：在儲存空間的「空間概覽」裏能夠看到。
複製代碼

3. 使用 dropzone 上傳：方便

參考文章：

• 使用Dropzone和七牛雲存儲來優化博客圖牀
• Mac OS 圖牀運用優化模式 - Microdust

4. 使用命令行上傳

(1) qshell

使命命令行方式，能夠不用手動上傳文件到七牛，它會自動幫你將本地目錄的文件同步到七牛以前設定的存儲空間下。

詳細教程，參考「參考資料」②文章的方法三，可是參考資料②中所說的 qrsync 已經失效，如今使用的 qshell 命令行，操做方式其實相似。

先引用官方的 qshell 介紹：qshell 是利用七牛文檔上公開的 API 實現的一個方便開發者測試和使用七牛 API 服務的命令行工具。該工具設計和開發的主要目的就是幫助開發者快速解決問題。目前該工具融合了七牛存儲，CDN，以及其餘的一些七牛服務中常用到的方法對應的便捷命令，好比 b64decode，就是用來解碼七牛的 URL 安全的 Base 編碼用的，因此這是一個面向開發者的工具，任何新的被認爲適合加到該工具中的命令需求，均可以在 ISSUE列表 裏面提出來，咱們會盡快評估實現，以幫助你們更好地使用七牛服務。

配置教程：官方文檔 | 官方GitHub，同時官方也有視頻教程：視頻教程--命令行工具使用。

(2) hexo-qinqiu-sync

網上看到有經過命令安裝 hexo-qiniu-sync 插件的方式：skyhacks.org/2017/08/02/… yuchen-lea.github.io/2016-01-21-…

GitHub 上也有教程：gyk001/hexo-qiniu-sync

5. 圖片優化

圖片搜身、水印處理、自動旋正解決照片莫名其妙發生旋轉：Hexo博客(19)使用七牛雲圖牀 | masikkk

3、圖片上傳方案選擇

因爲筆者用的 Windows，而且目前對圖片上傳的要求不大，只要能保證方便上傳圖片就行，目前有考慮如下幾種方式。

1. 第一種：使用本文一開始提到的谷歌搜索出來的那些在線圖牀進行上傳就是，好比 SM.MS，不過可能會有某些限制，好比「小賤賤圖牀 」每日上傳圖片限制數：20張。

2. 第二種：使用本文提到 Chrome 瀏覽器插件 qiniu upload files 插件，填寫空間名稱、AK、SK、域名等設置便可從電腦拖拽圖片至瀏覽器便可完成上傳，獲得外鏈地址。

3. 第三種：使用本文提到的 極簡圖牀，設置七牛云爲圖牀，填寫空間名稱、AK、SK、域名、樣式，上傳圖片便可獲得外鏈地址。PS：其中，樣式爲可選設置，其做用是 經過添加七牛樣式後綴，實現水印、縮略圖功能，查看使用說明

4. 第四種：使用上傳工具 MPic 。操做步驟：

   1. 打開文件，啓動程序請點擊 MPic.exe，爲方便啓用可點擊右鍵發送到‘桌面快捷方式’。
   2. 使用前先設置七牛雲存儲帳號，即輸入七牛雲空間名、AK、SK、域名，保存；
   3. 而後就能夠直接拖拽圖片至客戶端就能上傳。
   
   說明：下載的文件中包含的 CSkin.dll 文件，它是程序的核心文件，請與 MPic.exe 文件保持在同一目錄中；須要查看歷史上傳記錄請點擊「個人上傳」便可查看。
   複製代碼

5. 第五種：①使用官網 開發者工具頁面 的「QSunSync」同步上傳 Windows 客戶端，親測了下，沒有成功，還不知道哪的問題；②或者使用官網的開發者工具頁面的 qshell 工具（基於七牛 API 服務的命令行工具），教程都在官網。

考慮到能夠綁定七牛雲，我最後考慮的是第2、第3、第四種方式（這幾種方式均可以綁定七牛云爲圖牀），也都差很少，均可以選擇。固然若只是偶爾上傳圖片而已，能夠考慮公共圖牀，如使用 SM.MS 也 Ok。

參考：

• 利用「極簡圖牀」網站頁面上傳圖片至七牛雲存儲：使用七牛雲存儲markdown用的圖片
• 這篇文章關於把七牛雲做爲圖牀的教程寫的很詳細、全面：如何使用七牛雲作爲圖牀？
• 使用七牛雲做爲博客的圖牀

4、目前使用的方法 [薦]

1. 騰訊雲 COS

一開始我使用的是七牛雲，但七牛雲後來改了規則，測試域名使用 30 天須要綁定本身備案的域名才能繼續使用，我以爲麻煩，後來知道騰訊 COS 有免費存儲，因而乾脆選擇了騰訊 COS 作圖牀。

當時看官方說明，騰訊雲 COS 有 50G 的永久免費存儲空間，不過截止到如今 2019-02-01 登錄了官網查看，才發現了 2019-01-25 騰訊雲對象存儲 COS 免費額度已經發生了變動，變成了這樣：

用戶類型	免費額度	有效期
我的用戶	50GB標準存儲容量	6個月
企業用戶	1TB標準存儲容量	6個月

我的用戶免費額度有效時間 6 個月。不過發現站內信給個人通知，我未受這次變動影響，也就是說我仍是能享受 50G 的永久免費存儲空間，忽然有種「早就是優點」的趕腳。

2. 上傳工具 PicGo

使用 PicGo 工具，配置自定義的快捷鍵，上傳圖片簡直不能太方便了，牆裂推薦。

GitHub 地址：Molunerfinn/PicGo，如何使用 PicGo 能夠參考該文：PicGo：基於 Electron 的圖片上傳工具 - 少數派。該工具支持微博圖牀、七牛圖牀、騰訊雲 COS、GitHub 等等。

使用 PicGo 上傳圖片到騰訊雲 COS，參考：圖牀上傳工具PicGo v1.5更新：支持騰訊雲COSv5版本、支持GitHub圖牀、支持上傳前重命名文件等等 - 少數派

另外 PicGo 還支持微博圖牀、阿里雲OSS、又拍雲等做爲圖牀，甚至 GitHub 圖牀。若是不嫌圖片加載速度可能不那麼快，能夠考慮一下 GitHub 做爲圖牀，記得我在哪裏看到過，GitHub 單個倉庫存儲容量能夠達到 1000G，因此放心用吧，我以爲也考慮把這個做爲文件備份的地方。

具體如何配置參考：傳送門。我有實際操做了一遍，有幾點要說的：

1. 在 github.com/settings/to… 中生成的 token，記得複製如下存放在其餘地方留着備用，由於這個 token 只會顯示一次；

2. PicGo 設置中，域名爲空便可，另外，若是須要把圖片存放在圖牀倉庫 img 文件夾，則先第一步，在倉庫新建 img 文件夾（如何在 GitHub 倉庫新建文件夾相信你有辦法的），而後在 PicGo 的存儲路徑指定爲 img/ 便可，這樣獲得的地址以下格式：

   https://raw.githubusercontent.com/strivebo/backup/master/img/20190218004624.png
   複製代碼

3. 使用 GitHub 做爲圖牀，圖牀倉庫不要去設置爲私有，若是設置爲了私有倉庫，在其餘人瀏覽器不會顯示；