使用騰訊雲的圖片縮略圖服務

在業務開發過程中，我們有時候會遇到這樣的業務場景--展示一個圖集/相冊。當大量圖片加載時，我們一方面希望圖片懶加載；另一方面，希望在列表中展示的是縮略圖，然後點開時再展示大圖。感謝現在雲服務的發展，這些煩人的需求都被大佬們做成了第三方的服務，我們只要付費就行了。本文介紹調用騰訊雲的圖片處理服務。在往下看之前，首先請看完官方文檔。 https://cloud.tencent.com/document/product/460/6929

開通圖片處理服務

首先你應該使用了騰訊的對象存儲服務，否則是使用不了圖片處理服務的。一下是開通圖片處理服務的步驟：

1. 進入數據萬象控制檯,如果沒有開啓，需先開啓
2. 從左側菜單欄進入【Bucket管理】
3. 如果你已經使用了對象存儲圖片，點擊綁定bucket
   
4. 綁定完成後，在bucket右側點擊管理
5. 進入管理後的域名管理可以看到「圖片處理域名」，當你希望生成縮略圖，進行圖片處理時，需要讓圖片走這個域名
6. 通過請求這個域名+文檔中的查詢參數即可對圖片進行壓縮。

下面舉個例子：假設你在對象存儲上有一張圖片，地址爲：

https://xxxx.254101407.cos.ap-shanghai.myqcloud.com/banner/planet/box.png (2M)

然後你希望得到這張圖片的縮略圖，那麼你需要設置圖片的src爲：

# 格式：圖片處理域名 + 圖片路徑 < bucketname >-[APPID].picsh.myqcloud.com

https://xxxx-254101407.picsh.myqcloud.com/banner/planet/box.png?imageView2/1/w/600/h/300

總之，處理服務是通過查詢字符串傳遞參數來實現圖片處理的，更多查詢參數的含義可以參考官方文檔: https://cloud.tencent.com/document/product/460/6929

管道操作符“|”

其他圖片處理服務如加圖片水印，文字水印的文檔可以參考官網，這裏再提一下管道操作符。“|” 在shell中有大作用，圖片處理服務的api也借鑑了這一點。這個符號可以讓我們按順序調用多個服務，比如你想先壓縮再加水印，或者圖片自動旋轉正後再壓縮，就可以使用這個符號，下面是官網的一個demo

http://examples-1251000004.picsh.myqcloud.com/sample.jpeg

?imageMogr2/thumbnail/!50p

<b>|<b>

watermark/2/text/5pWw5o2u5LiH6LGh/fill/I0ZGRkZGRg==/fontsize/30/dx/20/dy/20