如何使用beego和vue实现大文件上传、断点续传、秒传功能？

目录公众号首发、欢迎关注大文件上传0、项目源码地址1、如何唯一标识一个文件？2、断点续传是如何实现的？3、秒传是如何实现的？4、上传暂停是如何实现的？5、前端上传并发数是多少？6、单个chunk上传失败怎么办？7、超过重传次数后，怎么办？8、如何控制上传多大的文件？9、如何保证上传文件的百分百正确？10、其他细节问题：如何判断文件上传失败了，给RD展示红色？如何控制上传什么类型的文件？如何控制不能上传空文件？11、后端数据库表设计12、关于什么时候mergechunk公众号首发、欢迎关注 公众号首发、欢迎关注 大文件上传 0、项目源码地址 源码地址 ：https://github.com/zhuchangwu/large-file-upload 前端基于 vue-simple-uploader （感谢这个大佬）实现： https://github.com/simple-uploader/vue-uploader/blob/master/README_zh-CN.md vue-simple-uploader底层封装了uploader.js : https://github.com/simple-uploader/Uploader/blob/develop/README_zh-CN.md 1、如何唯一标识一个文件？ 文件的信息后端会存储在mysql数据库表中。 在上传之前，前端通过 spark-md5.js 计算文件的md5值以此去唯一的标示一个文件。 spark-md5.js 地址：https://github.com/satazor/js-spark-md5 README.md中有spark-md5.js的使用demo，可以去看看。 2、断点续传是如何实现的？ 断点续传可以实现这样的功能，比如用户上传200M的文件，当用户上传完199M时，断网了，有了断点续传的功能，我们允许RD再次上传时，能从第199M的位置重新上传。 实现原理： 实现断点续传的前提是，大文件切片上传。然后前端得问后端哪些chunk曾经上传过，让前端跳过这些上传过的chunk就好了。 前端的上传器（uploader.js）在上传时会先发送一个GET请求，这个请求不会携带任何chunk数据，作用就是向后端询问哪些chunk曾经上传过。 后端会将这些数据保存在mysql数据库表中。比如按这种格式：1:2:3:5表示，曾经上传过的分片有1，2，3，5。第四片没有被上传，前端会跳过1，2，3，5。 仅仅会将第四个chunk发送给后端。 3、秒传是如何实现的？ 秒传实现的功能是：当用户重复上传一份相同的文件时，除了第一次上传会正常发送上传请求后，其他的上传都会跳过真正的上传，直接显示秒成功。 实现方式： 后端存储着当前文件的相关信息。为了实现秒传，我们需要搞一个字段（isUploaded）表示当前md5对应的文件是否曾经上传过。 后端在处理 前端的上传器（uploader.js）发送的第一个GET请求时，会将这个字段发送给前端，比如 isUploaded = true。前端看到这个信息后，直接跳过上传，显示上传成功。 4、上传暂停是如何实现的？ 上传的暂停：并不是去暂停一个已经发送出去的正在进行数据传输的http请求～ 而是暂停发送起发送下一个http请求。 就我们的项目而言，因为我们的文件本来就是先切片，对于我们来说，暂停文件的上传，本质上就是暂停发送下一个chunk。 5、前端上传并发数是多少？ 前端的uploader.js中默认会三条线程启动并发上传，前端会在同一时刻并发 发送3个chunk，后端就会相应的为每个请求开启三个协程处理上传的过来的chunk。 在我们的项目中，会将前端并发数调整成了1。原因如下： 因为考虑到了断点续传的实现，后端需要记录下曾经上传过哪些切片。（这个记录在mysql的数据库表中，以 ”1:2:3:4:5“ ）这种格式记录。 Mysql5.7默认的存储引擎是innoDB，默认的隔离级别是RR。