你所知道 &不知道的「文件上傳」

9 評(píng)論 11903 瀏覽 159 收藏 7 分鐘

本文從文件上傳的三個(gè)階段:「上傳前」、「上傳時(shí)」、「上傳后」來(lái)說(shuō)明作者現(xiàn)在已知的所有文件上傳問(wèn)題,來(lái)看看~

好久沒(méi)有動(dòng)筆了,久到都快要忘記文字應(yīng)該怎么寫、開頭怎么寫。最近做完了一個(gè)內(nèi)部系統(tǒng),趁下一個(gè)還在路上,總結(jié)一下在這個(gè)系統(tǒng)里遇到的「文件上傳」問(wèn)題。當(dāng)我在準(zhǔn)備這篇文章的素材的時(shí)候,發(fā)現(xiàn)自己在做「文件上傳」時(shí)仍有部分細(xì)節(jié)沒(méi)有考慮到,產(chǎn)品之路還很長(zhǎng),仍需不斷總結(jié)、不斷努力呀。

老規(guī)矩,為啥需要上傳文件呢?不上傳行不行得通?

涉及多方溝通的系統(tǒng),肯定是需要文件往來(lái),此時(shí)上傳文件就成了系統(tǒng)不可或缺的功能。不上傳肯定是不行的啊,任務(wù)流會(huì)斷開,大家都不舒服。

額,既然繞不開,那要怎么做呢?

我會(huì)從「文件上傳」的「上傳前」、「上傳時(shí)」、「上傳后」三個(gè)階段來(lái)說(shuō)明我現(xiàn)在已知的所有文件上傳問(wèn)題。

一、上傳前

需要明確什么文件可以上傳,可以進(jìn)入「上傳時(shí)」的流程,具體包括:

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

  1. 支持什么樣的上傳方式? 拖拽上傳?點(diǎn)擊上傳?復(fù)制粘貼上傳?
  2. 支持多大的文件? 業(yè)務(wù)有沒(méi)有要求?服務(wù)器有沒(méi)有限制?阿里云最大限制 20M。
  3. 一次支持上傳多少文件? 單個(gè)上傳?批量上傳?
  4. 異常文件怎么處理? 已經(jīng)上傳過(guò)的文件是否還能再次上傳? 空文件是否可以上傳? 一次性上傳多個(gè)同名文件怎么處理?

二、上傳中

嗯,「上傳前」里的系統(tǒng)野怪打完了,接下來(lái),該處理「上傳中」的野怪了。

  1. 上傳過(guò)程中是否要顯示上傳進(jìn)度?上傳進(jìn)度怎么處理?通過(guò)瀏覽器上傳文件是無(wú)法獲取文件上傳進(jìn)度的。
  2. 上傳過(guò)程中是否要進(jìn)行數(shù)據(jù)校驗(yàn)?
  3. 上傳過(guò)程中是否允許取消上傳?
  4. 是否支持?jǐn)帱c(diǎn)續(xù)傳?
  5. 上傳失敗時(shí)最大重試次數(shù)?一次上傳失敗就算失???還是在用戶無(wú)感知的情況下上傳 3 次失敗才算失???
  6. 上傳的文件尤其是圖片是否需要壓縮?壓縮規(guī)則是什么?(什么時(shí)候需要壓縮?怎么壓縮?期望結(jié)果是什么?)是否需要存儲(chǔ)原圖?

三、上傳后

文件上傳成功了,那后續(xù)還要做哪些任務(wù)才能完美通過(guò)呢?

(1)文件什么時(shí)候上傳到服務(wù)器?選擇文件后自動(dòng)上傳?綁定其他事件觸發(fā)上傳?

  • 上傳成功之后立即上傳。服務(wù)器里多余的圖片怎么處理?是否需要一個(gè)專門的清除多余圖片的方法,檢測(cè)文件是否在數(shù)據(jù)庫(kù)里有記錄,沒(méi)有就刪除,定時(shí)運(yùn)行該程序。
  • 用戶點(diǎn)擊“確定”一起把數(shù)據(jù)提交到后臺(tái)?如果用戶此時(shí)刷新界面或者關(guān)閉界面,文件可能無(wú)法保留。

(2)上傳后的文件是否需要預(yù)覽?預(yù)覽的規(guī)則是什么?直接縮放?顯示中間部分?

(3)上傳后的文件是否需要下載?

(4)上傳后的文件是否支持刪除?

(5)上傳后的文件是否需要重命名?重命名的規(guī)則是什么?按照時(shí)間隨機(jī)數(shù)?不重命名可能出現(xiàn)什么問(wèn)題?

(6)如果允許多次上傳,那么采用追加還是覆蓋?

以上就是所有我能想到的文件上傳中的野怪,接下來(lái)說(shuō)一下自己遇到的坑吧。

坑1:psd文件變 png

關(guān)于 psd 文件在瀏覽器中的上傳:chrome 瀏覽器會(huì)把它當(dāng)作 image 文件上傳,剪切板粘貼會(huì)轉(zhuǎn)為 png 圖片上傳;safari 瀏覽器會(huì)把它當(dāng)作 file 文件上傳,剪切板不能粘貼該文件上傳。至于其它瀏覽器是怎么處理的,我們沒(méi)做兼容,如果你有興趣,可以研究之后告訴我。

坑2:文件名含空格導(dǎo)致沒(méi)法下載

坑3:文件名含特殊字符導(dǎo)致預(yù)覽出現(xiàn)問(wèn)題

坑2 和坑3 其實(shí)是一個(gè)問(wèn)題,都是因?yàn)闆](méi)有對(duì)用戶上傳的文件進(jìn)行重命名或特殊字符進(jìn)行過(guò)濾導(dǎo)致的。踩了坑之后,才去研究了一下,發(fā)現(xiàn)釘釘也沒(méi)有處理特殊字符的問(wèn)題,圖片縮略圖顯示有問(wèn)題,心里一陣竊喜。

不過(guò),現(xiàn)在再去看的時(shí)候,發(fā)現(xiàn)釘釘已經(jīng)把這個(gè)問(wèn)題修復(fù)了,大家都是在讓自己的產(chǎn)品越來(lái)越好。

坑4:圖片拖拽的拖拽區(qū)域太小,導(dǎo)致用戶體驗(yàn)很差

支持拖拽這種上傳,一定要設(shè)置足夠大的拖拽區(qū)域,不然拖拽這個(gè)功能就很難用,還不如點(diǎn)擊上傳。上線之后,用戶也不太喜歡用,那么開發(fā)這個(gè)功能的意義也就不大。

所以說(shuō),做產(chǎn)品還是要做得好一點(diǎn),這樣晚上才睡得安心。

嗯,該分享的內(nèi)容分享完了,這次就到這里啦。我們,下次再見。

—— End ——

 

本文由 @Q_misky 原創(chuàng)發(fā)布于人人都是產(chǎn)品經(jīng)理。未經(jīng)許可,禁止轉(zhuǎn)載

 

更多精彩內(nèi)容,請(qǐng)關(guān)注人人都是產(chǎn)品經(jīng)理微信公眾號(hào)或下載App
評(píng)論
評(píng)論請(qǐng)登錄
  1. 我….還以為會(huì)有答案呢,還想看看作者怎么處理這個(gè)問(wèn)題的,沒(méi)想到都是問(wèn)題,正愁如何解決所有問(wèn)題 呃呃呃…

    來(lái)自廣東 回復(fù)
  2. 預(yù)覽的邏輯您當(dāng)時(shí)是怎么設(shè)計(jì)的呢

    來(lái)自廣東 回復(fù)
  3. 我想問(wèn)下15s短視頻上傳多大需要前端壓縮,前端壓縮是可以壓縮到指定范圍還是說(shuō)不確定的,第二視頻分辨率怎么定,其實(shí)就是您說(shuō)的上傳前要做哪些處理,上傳中(可略),上傳后要做哪些處理

    回復(fù)
  4. 百度網(wǎng)盤上傳文件是分類上傳,而TimQQ則是所有分類都可以直接上傳,實(shí)在是想不明白,這兩種有啥區(qū)別

    來(lái)自河北 回復(fù)
  5. 學(xué)習(xí)了

    來(lái)自河北 回復(fù)
  6. 1.單人最大支持多少任務(wù)同時(shí)上傳
    2.服務(wù)器最大支持多少任務(wù)同時(shí)上傳
    3.各狀態(tài)任務(wù)排序和展示
    4.若服務(wù)器即將達(dá)到上限,是否需要進(jìn)行大文件和小文件上傳區(qū)分

    來(lái)自廣東 回復(fù)
    1. 哇,感謝補(bǔ)充,服務(wù)器這端我都沒(méi)怎么考慮到。 ??

      來(lái)自四川 回復(fù)
  7. 好厲害 學(xué)習(xí)了

    來(lái)自廣東 回復(fù)
    1. 嘻嘻,如果你有疑問(wèn),可以提哈~

      來(lái)自四川 回復(fù)