html5 filereader读取流注意事项
对于截取读入的文件,一定要new FileReader,不可写全局调用同一个reader.

错误代码!!!
function readAsBinaryString(file,callback){
readrSpt(); var part= 0,fileName=file.name,
step=1024*10,start= 0, a=0,b= 0,total=file.size,loaded= 0,reader=new FileRead(),fileType=file.type;///这样写是错的,将导致reader流不在是同步读取 //$("#fileLink").attr("href",URL.createObjectURL(blob));
//将文件以arraybuffer形式读入
(function(start){
var blob=file.slice(start,start+step+1),self=arguments.callee;// console.log(blob)
reader.readAsArrayBuffer(blob);
reader.onprogress=function(e){
loaded+=e.loaded;
var per=loaded/total;
if(loaded==total){
per=100;
callback(this.result,part,fileName,fileType,true);
}else{
per*=100;
callback(this.result,part);
part++;
}
}
reader.onload=function(e){
console.log(loaded)
if(loaded<total){
self(loaded);
// callback(this.result);
}else{
loaded=total;
}
}
})(start);
}

------------------------------------------------------------------------------------------------------------------------------------------------------------------------
正确代码
function readAsBinaryString(file,callback){
readrSpt(); var part= 0,fileName=file.name,
step=1024*10,start= 0, a=0,b= 0,total=file.size,loaded= 0,fileType=file.type; //$("#fileLink").attr("href",URL.createObjectURL(blob));
//将文件以arraybuffer形式读入
(function(start){
var blob=file.slice(start,start+step+1),reader = new FileReader(),self=arguments.callee;
// console.log(blob)
reader.readAsArrayBuffer(blob);
reader.onprogress=function(e){
loaded+=e.loaded;
var per=loaded/total;
if(loaded==total){
per=100;
callback(this.result,part,fileName,fileType,true);
}else{
per*=100;
callback(this.result,part);
part++;
}
}
reader.onload=function(e){
console.log(loaded)
if(loaded<total){
self(loaded);
// callback(this.result);
}else{
loaded=total;
}
}
})(start);
} 转载来源:http://www.cnblogs.com/tom-chang/p/4060650.html
html5 filereader读取流注意事项的更多相关文章
- HTML5 FileReader读取Blob对象API详解
使用FileReader对象,web应用程序可以异步的读取存储在用户计算机上的文件(或者原始数据缓冲)内容,可以使用File对象或者Blob对象来指定所要读取的文件或数据.其中File对象可以是来自用 ...
- html5 filereader 读取图片信息
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...
- HTML5 文件域+FileReader 读取文件(一)
在HTML5以前,HTML的文件上传域的功能具有很大的局限性,这种局限性主要体现在如下两点: 每次只能选择一个文件进行上传 客户端代码只能获取被上传文件的文件路径,无法访问实际的文件内容 一.File ...
- 使用html5 FileReader获取图片,并异步上传到服务器(不使用iframe)
使用html5 FileReader获取图片,并异步上传到服务器(不使用iframe) 原理: 1.使用FileReader 读取图片的base64编码 2.使用ajax,把图片的base64编码 ...
- FileReader读取文件详解
FileReader是一种异步文件读取机制,结合input:file可以很方便的读取本地文件. input:file 在介绍FileReader之前,先简单介绍input的file类型. <in ...
- FileReader读取文件
前言:FileReader是一种异步文件读取机制,结合input:file可以很方便的读取本地文件. input:file 在介绍FileReader之前,先简单介绍input的file类型. < ...
- 通过HTML5 FileReader实现上传图片预览功能
原文:http://www.htmleaf.com/ziliaoku/qianduanjiaocheng/201706224590.html 在上传图片到服务器之前,我们希望可以预览一下要上传的图片. ...
- 使用html5 FileReader获取图片,并异步上传到server(不使用iframe)
使用html5 FileReader获取图片,并异步上传到server(不使用iframe) 原理: 1.使用FileReader 读取图片的base64编码 2.使用ajax.把图片的base64编 ...
- 使用 html5 FileReader 获取图片, 并异步上传到服务器 (不使用 iframe)
为什么80%的码农都做不了架构师?>>> 原理: 1.使用FileReader 读取图片的base64编码 2.使用ajax,把图片的base64编码post到服务器. 3.根据 ...
随机推荐
- string和stringstream用法总结
参考:http://blog.csdn.net/xw20084898/article/details/21939811
- 【云计算】mesos生态系统
以 Apache Mesos 计算的开源数据中心 数据中心 易云 · 2015-09-15 16:53 Apache Mesos 是一个管理器,它通过分布式的应用或框架提供了一种高效的资源隔离和共享. ...
- css整个页面离顶部的距离
body { padding:0; margin:0; font-size:12px; line-height:22px; } 说明: 整个页面离顶部的距离是22像素
- 理解和解决MySQL乱码问题
本文将详细介绍MySQL乱码的成因和具体的解决方案 在阅读本文之前,强烈建议对字符集编码概念还比较模糊的同学 阅读下博主之前对相关概念的一篇科普:十分钟搞清字符集和字符编码 MySQL出现乱码的原因 ...
- 低配置电脑播放 flash 视频时 占 cpu 资源过高的解决方法
安装低版本的 flash player 版本, 经调试能满足播放的最低版本是 Flash Player 10.3.183.90 然后 firefox 3.6.28 + Adblock Plus 2.0 ...
- HDU 5793 A Boring Question (逆元+快速幂+费马小定理) ---2016杭电多校联合第六场
A Boring Question Time Limit: 2000/1000 MS (Java/Others) Memory Limit: 65536/65536 K (Java/Others ...
- July 25th, Week 31st Monday, 2016
We will not go quietly into the night. 今夜,我们将奋战到底. We will be the champion. We will not stop fightin ...
- 在Win8中创建热点,共享网络
在Win8中创建热点,共享网络 办公室中,我独享10M光纤,没什么要下的,便想利用来更新下Ipad里面的程序,下点公开课.那在不利用软件[用很多wifi共享的软件],从win7开始 系统本身就自带相关 ...
- Count Color(poj 2777)
题意: 给一个固定长度为L的画板 有两个操作: C A B C:区间AB内涂上颜色C. P A B:查询区间AB内颜色种类数. 分析:显然是要用线段树来操作的,设定一个sum[]来维护一个区间内的颜色 ...
- 用java程序打印菱形
代码如下