代码镇顶:https://github.com/dna2github/petalJS/blob/master/upload

前些天遇到用户须要上传10GB大小以上的文件的需求,查查网上的库。都不好用。都没有一个完整的前后端的样例,要么像resumable.js仅仅有前端,后端写得无比麻烦。要么是jquery file uploader封装得太完整。想改就非常麻烦。

懒人就自己写个小而易懂大家都能够用的东西吧。

代码支持IE 10+, Opera, Chrome, Firefox, Safari, 在Android 4.2以上的默认浏览器貌似都能顺利执行。

js代码也就80行左右。错误处理留空。

代码下载后, python manage.py runserver,然后浏览器里输入 http://127.0.0.1:8000/static/index.html就能够使用了。

代码js部分就是使用HTML5的Blob将文件分片,然后逐个POST。

为了保证传输效率,就是让整个POST请求除了HTML的Header外。都用binary形式上传。假设再配合新的API,比方后端写一个open file的API(e.g. /open)。返回一个hash。然后用hash作为URL,上传文件data的时候(e.g. /upload/:hash)就往指定文件中写数据就好了,最后使用完调用close file的API(e.g. /close/:hash)。測试了下,在单机状态下,传了2.6GB的文件用了77秒,大概30MB/s。几乎相同是硬盘的读写速度了吧。

想要实现暂停和恢复,在event_reader_loadend里使用个flag就能够了。暂停的时候设置flag为true,在上传blob成功的时候假设flag为true就跳出停止。当按恢复的时候,继续从暂停的地方按文件偏移读取文件blob。

想要达到更好的传输速度,就在uploadFile里的step上下文章就好了。通过统计没传一个blob所用的时间,动态调整step的大小。就是文件blob的大小。

要是遇到服务器错误或者用户不小心刷新了页面,就是另外的case了,这里就是简单说一下。使用file_name, file_size和file_md5是能够在即使页面刷新的情况下继续上传文件。

支持断点下载也是外话。读下Content-Range实现下206返回就好了。Enjoy :D

Web支持可暂停的超大文件上传的更多相关文章

  1. web超大文件上传

    文件夹数据库处理逻辑 publicclass DbFolder { JSONObject root; public DbFolder() { this.root = new JSONObject(); ...

  2. 【Java Web开发学习】Spring MVC文件上传

    [Java Web开发学习]Spring MVC文件上传 转载:https://www.cnblogs.com/yangchongxing/p/9290489.html 文件上传有两种实现方式,都比较 ...

  3. 4GB以上超大文件上传和断点续传服务器的实现

    随着视频网站和大数据应用的普及,特别是高清视频和4K视频应用的到来,超大文件上传已经成为了日常的基础应用需求. 但是在很多情况下,平台运营方并没有大文件上传和断点续传的开发经验,往往在网上找一些简单的 ...

  4. Java超大文件上传解决办法

    这里只写后端的代码,基本的思想就是,前端将文件分片,然后每次访问上传接口的时候,向后端传入参数:当前为第几块文件,和分片总数 下面直接贴代码吧,一些难懂的我大部分都加上注释了: 上传文件实体类: 看得 ...

  5. Spring 4 官方文档学习(十一)Web MVC 框架之multipart(文件上传)支持

    http://docs.spring.io/spring/docs/current/spring-framework-reference/html/mvc.html#mvc-multipart 1.简 ...

  6. java+web+超大文件上传

    javaweb上传文件 上传文件的jsp中的部分 上传文件同样可以使用form表单向后端发请求,也可以使用 ajax向后端发请求 1.通过form表单向后端发送请求 <form id=" ...

  7. php+超大文件上传

    1 背景 用户本地有一份txt或者csv文件,无论是从业务数据库导出.还是其他途径获取,当需要使用蚂蚁的大数据分析工具进行数据加工.挖掘和共创应用的时候,首先要将本地文件上传至ODPS,普通的小文件通 ...

  8. 怎么实现超大文件上传 2-3GB

    1 背景 用户本地有一份txt或者csv文件,无论是从业务数据库导出.还是其他途径获取,当需要使用蚂蚁的大数据分析工具进行数据加工.挖掘和共创应用的时候,首先要将本地文件上传至ODPS,普通的小文件通 ...

  9. PHP超大文件上传与下载

    前段时间做视频上传业务,通过网页上传视频到服务器. 视频大小 小则几十M,大则 1G+,以一般的HTTP请求发送数据的方式的话,会遇到的问题:1,文件过大,超出服务端的请求大小限制:2,请求时间过长, ...

随机推荐

  1. Mac 如何删除应用、软件

    首先需要跟刚接触Mac的小白分享一下卸载软件常用的两种方法: 1.点击Finder(访达)—应用程序—选择所要删除的软件—拖拽到右下方的废纸篓或者单击右键选择“移除到废纸篓”. 2.打开Launchp ...

  2. PostgreSQL 数组类型

    PostgreSQL 支持表的字段使用定长或可变长度的一维或多维数组,数组的类型可以是任何数据库内建的类型.用户自定义的类型.枚举类型, 以及组合类型.但目前还不支持 domain 类型. 数组类型的 ...

  3. [oldboy-django][6其他]rest framwork有关事

    官网地址: https://github.com/encode/django-rest-framework 英文教程:http://www.django-rest-framework.org/tuto ...

  4. jupyter-notebook快捷键的使用

    jupyter-notebook快捷键的使用 工具有个键盘图标可以看所有快捷键 Esc + F 在代码中查找.替换 Esc + O 在cell和输出结果间切换. Shift + J 或 Shift + ...

  5. BZOJ3531 [Sdoi2014]旅行 【树剖 + 线段树】

    题目 S国有N个城市,编号从1到N.城市间用N-1条双向道路连接,满足 从一个城市出发可以到达其它所有城市.每个城市信仰不同的宗教,如飞天面条神教.隐形独角兽教.绝地教都是常见的信仰.为了方便,我们用 ...

  6. 【bzoj3894】文理分科 网路流

    [bzoj3894]文理分科 2015年3月25日3,4002 Description  文理分科是一件很纠结的事情!(虽然看到这个题目的人肯定都没有纠 结过)  小P所在的班级要进行文理分科.他的班 ...

  7. 合理使用webpack提高开发效率

    虽然公司有提供现成的脚手架工具,但是作为开发人员懂得必要的相关知识还是很重要的.这样有利于提高我们的开发效率,优化我们的代码. 关于npm scripts 什么是npm scripts npm 允许在 ...

  8. (转载--修改)使用Xcode9的Instruments检测解决iOS内存泄露

    作为一名iOS开发攻城狮,在苹果没有出ARC(自动内存管理机制)时,我们几乎有一半的开发时间都耗费在这么管理内存上.后来苹果很人性的出了ARC,虽然在很大程度上,帮助我们开发者节省了精力和时间.但是我 ...

  9. about loops in assembly code

    总结: 实际上只有一种结构,都是 do-while 结构

  10. 17.2.10 NOIP模拟赛 聪哥的工资

    聪哥的工资 (money/money.in/money.out) 时限1000ms 内存256MB 题目描述 lwher: 了体验劳苦大众的生活,聪哥在暑假参加了打零工的活动,这个活动分为n个工作日, ...