本文從文件上傳的三個階段：「上傳前」、「上傳時」、「上傳後」來說明作者現在已知的所有文件上傳問題，來看看~

好久沒有動筆了，久到都快要忘記文字應該怎麼寫、開頭怎麼寫。最近做完了一個内部系統，趁下一個還在路上，總結一下在這個系統裡遇到的「文件上傳」問題。當我在準備這篇文章的素材的時候，發現自己在做「文件上傳」時仍有部分細節沒有考慮到，産品之路還很長，仍需不斷總結、不斷努力呀。

老規矩，為啥需要上傳文件呢？不上傳行不行得通？

涉及多方溝通的系統，肯定是需要文件往來，此時上傳文件就成了系統不可或缺的功能。不上傳肯定是不行的啊，任務流會斷開，大家都不舒服。

額，既然繞不開，那要怎麼做呢？

我會從「文件上傳」的「上傳前」、「上傳時」、「上傳後」三個階段來說明我現在已知的所有文件上傳問題。

一、上傳前

需要明确什麼文件可以上傳，可以進入「上傳時」的流程，具體包括：

支持什麼樣的文件格式？ 圖片？psd？pdf？word？excel？zip？rar？全部？

1. 支持什麼樣的上傳方式？ 拖拽上傳？點擊上傳？複制粘貼上傳？
2. 支持多大的文件？ 業務有沒有要求？服務器有沒有限制？阿裡雲最大限制 20M。
3. 一次支持上傳多少文件？ 單個上傳？批量上傳？
4. 異常文件怎麼處理？ 已經上傳過的文件是否還能再次上傳？ 空文件是否可以上傳？ 一次性上傳多個同名文件怎麼處理？

二、上傳中

嗯，「上傳前」裡的系統野怪打完了，接下來，該處理「上傳中」的野怪了。

1. 上傳過程中是否要顯示上傳進度？上傳進度怎麼處理？通過浏覽器上傳文件是無法獲取文件上傳進度的。
2. 上傳過程中是否要進行數據校驗？
3. 上傳過程中是否允許取消上傳？
4. 是否支持斷點續傳？
5. 上傳失敗時最大重試次數？一次上傳失敗就算失敗？還是在用戶無感知的情況下上傳 3 次失敗才算失敗？
6. 上傳的文件尤其是圖片是否需要壓縮？壓縮規則是什麼？（什麼時候需要壓縮？怎麼壓縮？期望結果是什麼？）是否需要存儲原圖？

三、上傳後

文件上傳成功了，那後續還要做哪些任務才能完美通過呢？

（1）文件什麼時候上傳到服務器？選擇文件後自動上傳？綁定其他事件觸發上傳？

• 上傳成功之後立即上傳。服務器裡多餘的圖片怎麼處理？是否需要一個專門的清除多餘圖片的方法，檢測文件是否在數據庫裡有記錄，沒有就删除，定時運行該程序。
• 用戶點擊“确定”一起把數據提交到後台？如果用戶此時刷新界面或者關閉界面，文件可能無法保留。

（2）上傳後的文件是否需要預覽？預覽的規則是什麼？直接縮放？顯示中間部分？

（3）上傳後的文件是否需要下載？

（4）上傳後的文件是否支持删除？

（5）上傳後的文件是否需要重命名？重命名的規則是什麼？按照時間随機數？不重命名可能出現什麼問題？

（6）如果允許多次上傳，那麼采用追加還是覆蓋？

以上就是所有我能想到的文件上傳中的野怪，接下來說一下自己遇到的坑吧。

坑1：psd文件變 png

關于 psd 文件在浏覽器中的上傳：chrome 浏覽器會把它當作 image 文件上傳，剪切闆粘貼會轉為 png 圖片上傳；safari 浏覽器會把它當作 file 文件上傳，剪切闆不能粘貼該文件上傳。至于其它浏覽器是怎麼處理的，我們沒做兼容，如果你有興趣，可以研究之後告訴我。

坑2：文件名含空格導緻沒法下載

坑3：文件名含特殊字符導緻預覽出現問題

坑2 和坑3 其實是一個問題，都是因為沒有對用戶上傳的文件進行重命名或特殊字符進行過濾導緻的。踩了坑之後，才去研究了一下，發現釘釘也沒有處理特殊字符的問題，圖片縮略圖顯示有問題，心裡一陣竊喜。

不過，現在再去看的時候，發現釘釘已經把這個問題修複了，大家都是在讓自己的産品越來越好。

坑4：圖片拖拽的拖拽區域太小，導緻用戶體驗很差

支持拖拽這種上傳，一定要設置足夠大的拖拽區域，不然拖拽這個功能就很難用，還不如點擊上傳。上線之後，用戶也不太喜歡用，那麼開發這個功能的意義也就不大。

所以說，做産品還是要做得好一點，這樣晚上才睡得安心。

嗯，該分享的内容分享完了，這次就到這裡啦。我們，下次再見。

—— End ——

本文由 @Q_misky 原創發布于人人都是産品經理。未經許可，禁止轉載

,

更多精彩资讯请关注tft每日頭條，我们将持续为您更新最新资讯!

查看全部