对于截取读入的文件,一定要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读取流注意事项的更多相关文章

  1. HTML5 FileReader读取Blob对象API详解

    使用FileReader对象,web应用程序可以异步的读取存储在用户计算机上的文件(或者原始数据缓冲)内容,可以使用File对象或者Blob对象来指定所要读取的文件或数据.其中File对象可以是来自用 ...

  2. html5 filereader 读取图片信息

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  3. HTML5 文件域+FileReader 读取文件(一)

    在HTML5以前,HTML的文件上传域的功能具有很大的局限性,这种局限性主要体现在如下两点: 每次只能选择一个文件进行上传 客户端代码只能获取被上传文件的文件路径,无法访问实际的文件内容 一.File ...

  4. 使用html5 FileReader获取图片,并异步上传到服务器(不使用iframe)

    使用html5 FileReader获取图片,并异步上传到服务器(不使用iframe)   原理: 1.使用FileReader 读取图片的base64编码 2.使用ajax,把图片的base64编码 ...

  5. FileReader读取文件详解

    FileReader是一种异步文件读取机制,结合input:file可以很方便的读取本地文件. input:file 在介绍FileReader之前,先简单介绍input的file类型. <in ...

  6. FileReader读取文件

    前言:FileReader是一种异步文件读取机制,结合input:file可以很方便的读取本地文件. input:file 在介绍FileReader之前,先简单介绍input的file类型. < ...

  7. 通过HTML5 FileReader实现上传图片预览功能

    原文:http://www.htmleaf.com/ziliaoku/qianduanjiaocheng/201706224590.html 在上传图片到服务器之前,我们希望可以预览一下要上传的图片. ...

  8. 使用html5 FileReader获取图片,并异步上传到server(不使用iframe)

    使用html5 FileReader获取图片,并异步上传到server(不使用iframe) 原理: 1.使用FileReader 读取图片的base64编码 2.使用ajax.把图片的base64编 ...

  9. 使用 html5 FileReader 获取图片, 并异步上传到服务器 (不使用 iframe)

    为什么80%的码农都做不了架构师?>>>   原理: 1.使用FileReader 读取图片的base64编码 2.使用ajax,把图片的base64编码post到服务器. 3.根据 ...

随机推荐

  1. doTjs源码研究笔记

    首先是入口方法 /*tmpl:模板文本 c:用户自定义配置 def:定义编译时执行的数据*/doT.template = function(tmpl, c, def) { } 然后进入第一句代码 c ...

  2. 安装mac os x时about a second remaining解决方法

    转自: http://www.hongkiat.com/blog/clean-install-mavericks/ During the installation process, you may e ...

  3. 如何使用box2d做碰撞检测

    cocos2dx3.0+vs2012编译通过. 主要是通过body->SetTransform来设置body的位置和角度,然后自己写个ContactListener来监听碰撞事件 源代码下载 # ...

  4. iOS 端的第三方语音识别库

    最近在看语音识别方面的库,主要看了2个收费的项目,一个是 At&t 的,一个是Nuance的.这2个项目虽然是收费的,但是仅仅测试的话,是免费的,连接如下 https://developer. ...

  5. 使用eclipse开发Java web应用

    前面说了手动配置一个应用,手动配置可以更深入的理解web应用的分布,但是一般的编辑器没有语法错误提示,所以开发起来对于错误的寻找不太容易,效率相对较低,所以在理解清楚web项目的结构之后,我们使用ec ...

  6. Java for LeetCode 072 Edit Distance【HARD】

    Given two words word1 and word2, find the minimum number of steps required to convert word1 to word2 ...

  7. DP:Coins(POJ 1742)

      用硬币换钱 题目大意:就是有面值为A1,A2,A3....的硬币,各有C1,C2,C3...的数量,问在钱数为m的范围内,能换多少钱?(不找零) 这题看名字就知道是完全背包,但是这题又有点不一样, ...

  8. BSD学习(BSD系统的历史和目标)

    UNIX系统的历史 unix系统的发展历程大概经历以下几个阶段: 贝尔实验室(Bell Laboratories)阶段,该实验室发明了UNIX 加州大学伯克利分校(University of Cali ...

  9. oracle的数据库,随笔

    不多说,看代码 select b.*,a.kscj,a.paiming from (select t.kch,t.kcm,t.kscj,t.xh,        rank() over (order ...

  10. gdalwarp切割tif参数

    可以去gdal官网查询gdalwarp工具的参数,但是具体的还是不知道怎么写,例如内置数据类型-ot 和压缩-co参数. 这里有一个经过雁阵更可以使用的参数 gdalwarp -te lon1 lat ...