Fit項目圖片上傳和雲存儲的調通

項目中關於動做的說明須要相應的配圖，這樣能夠更直觀的說明動做要點。本篇主要爲項目中動做的新增和編輯作準備，肯定適合場景的上傳操做邏輯以及圖片的存儲和加載的方法。

一 上傳方案

a) 原本所用的模板中是有一款挺好的上傳控件的，支持多選、拖拽、並行上傳。

 

 

但探索了半天后才意識到這個並不適合當前的場景。無論是動做的新增仍是編輯，上傳圖片後最好能即時地看到所添加的圖片。這個控件無疑帶來了功能上的冗餘。

 

b) 最後採用了基於html file類型的輸入框作成的按鈕。

 

 

查看代碼，能夠發現這種按鈕是在label中包含了一個input，並且input屬性爲hide。

 

 

c) input放在表單中，通常須要點擊提交按鈕才能上傳，但對項目來講，這個提交按鈕是多餘的，改爲選中圖片後自動上傳。須要註冊圖片選擇按鈕的change事件，並在事件中自動提交表單。

 

 

d) 上傳表單提交到服務器後，讀取文件並作後續的處理，可多選上傳。SaveImgInCloud是與保存到第三方存儲服務相關的方法。

 

 

---

 

二 雲存儲

a) 如今使用的雲存儲要先建立存儲空間，並設置空間的訪問權限，爲了方便上傳後的讀取操做，設置爲公開空間，後面再想別的辦法增長訪問保護。

 

 

而後，根據開發者文檔操做，這個雖然以前已經用過了，但仍然遇到很多麻煩。

 

 

b) 密鑰測試時臨時保存在常量中。第一次試驗時上傳失敗，是由於沒有設置區域，最後設置爲自動識別區域Config.AutoZone()。

 

c) 另外還有同名文件覆蓋的問題，按照文檔要設置putPolicy.Scope = bucket + ":" + saveKey，不然會保留第一次上傳的。

 

d) 文檔提供了簡單上傳、字節上傳、流式上傳幾種方式，本次使用流式上傳。將file.InputStream做爲上傳對象便可。