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

本文从文件上传的三个阶段：「上传前」、「上传时」、「上传后」来说明作者现在已知的所有文件上传问题，来看看~

好久没有动笔了，久到都快要忘记文字应该怎么写、开头怎么写。最近做完了一个内部系统，趁下一个还在路上，总结一下在这个系统里遇到的「文件上传」问题。当我在准备这篇文章的素材的时候，发现自己在做「文件上传」时仍有部分细节没有考虑到，产品之路还很长，仍需不断总结、不断努力呀。

老规矩，为啥需要上传文件呢？不上传行不行得通？

涉及多方沟通的系统，肯定是需要文件往来，此时上传文件就成了系统不可或缺的功能。不上传肯定是不行的啊，任务流会断开，大家都不舒服。

额，既然绕不开，那要怎么做呢？

我会从「文件上传」的「上传前」、「上传时」、「上传后」三个阶段来说明我现在已知的所有文件上传问题。

 一、上传前

需要明确什么文件可以上传，可以进入「上传时」的流程，具体包括：

支持什么样的文件格式？ 图片？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 ——