博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
Stream上传插件(HTML5支持拖拽、断点续传)
阅读量:6872 次
发布时间:2019-06-26

本文共 919 字,大约阅读时间需要 3 分钟。

hot3.png

提示:由于近期咨询的问题越来多,感觉力不从心,咨询前请先访问查看相关文档及常见问题,如果网站已经出现过相关问题,将不再回复!

1、需要描述:

    Stream的WEB上传插件支持HTML5,Flash两种方式上传,这包括两个重要的需求:①大文件上传②跨域上传。其上传的主要流程是:①获取token(本域)=》②获取文件要上传到的服务器(跨域) =》③上传文件(跨域)。主要流程更改成常规的流程:①获取token(本域,如果需要跨域,则返回跨域的服务器)=》②上传文件

2、主要特征:

  1. 支持HTML5、Flash两种方式(跨域)上传
  2. 支持多文件一起上传
  3. HTML5方式支持断点续传,拖拽等新特性
  4. 兼容性好IE7+, FF3.6+, Chrome*,Safari4+,遨游等主流浏览器
  5. 选择文件的按钮完全可以自定义
  6. 进度条、速度、剩余时间等附属信息(网易的UI)
  7. 基本的自定义属性及函数,如文件多选、上传成功的响应函数等
  8. 示例代码java实现(StreamServlet, FormDataServlet{commons-fileupload的stream api}, TokenServlet)
  9. 支持文件夹上传(Chrome21+, Opera15+)
  10. 支持自定义UI(V1.4+)

    注:Chrome没测试最低版本,不想支持IE6

3、不足:

  1. 浏览器兼容性未全部测试(工程太巨大)
  2. windows下的Safari5.1.17多选文件存在问题(初步认定是Safari的bug)
  3. 中文编码问题(tomcat容器下需要设置server.xml中的URIEncoding="UTF-8"属性)

4、快速开始:

    参见:

5、致谢:

     爬取优酷的uploader.min.js和网易的UI,其中JS强大的OOP思想不是一般的JS工程师能够写出来,UI很大程度上解决了兼容性。最后此文仅向奋斗的一线的前端工程师致敬!

项目主页:

断点续传(Firefox4+, Chrome, Safari6+, IE10+)

 

 自定义UI(bootstrap 风格)

下载地址:

              

转载于:https://my.oschina.net/twinkling/blog/155574

你可能感兴趣的文章
《Docker技术入门与实战》——3.2 查看镜像信息
查看>>
Linux有问必答:如何在CentOS或RHEL 7上修改主机名
查看>>
JVM的持久代——何去何从?
查看>>
Kafka Producer接口
查看>>
《jQuery、jQuery UI及jQuery Mobile技巧与示例》——9.8 技巧:指定自定义的过渡动画...
查看>>
《NLTK基础教程——用NLTK和Python库构建机器学习应用》——第2章 文本的歧义及其清理...
查看>>
《Hack与HHVM权威指南》——1.3.3 属性
查看>>
MongoDB Schema Design
查看>>
基于Quick BI的用户分布分析
查看>>
对《架构即未来:现代企业可扩展的web架构、流程和组织》这本书的读后感。...
查看>>
微服务架构的分布式事务解决方案
查看>>
Spark修炼之道(高级篇)——Spark源码阅读:第五节 Stage提交
查看>>
iOS8到iOS9 变化笔记
查看>>
Linux之iconv转换文本格式的问题
查看>>
MATLAB学习之滤波器设计
查看>>
Redis 消息队列介绍
查看>>
《C语言及程序设计》程序阅读——三种循环语句
查看>>
DBA+工具4:国内唯一零负载Oracle专业监控工具PeOny发布
查看>>
我理解的 Flux 架构
查看>>
Red Hat Enterprise Linux 6 “桌面”、“工作站”、“服务器” 版本差异比较
查看>>