fileReader api

获取转换后的数据，我们则只需要在onload函数中将e.target.result的引用复制给定义的变量即可

1、读取txt文件（ readAsText() ）：

var reader = new FileReader();
reader.onload = function(e) {
var text = reader.result;
}
reader.readAsText(file, encoding);

两个参数，第一个为file或者blob对象，第二个为编码格式，默认utf-8，中文显示不正常可以改成'gb2312'，鉴于这是一个异步方法我们需要为文件加载结束时添加一个事件监听器。

2、将文件转换成base64（ readAsDataURL() ）

var reader = new FileReader();
reader.onload = function(e) {
  var dataURL = reader.result;
}
reader.readAsDataURL(file);

该方法接收一个文件或Blob并产生一个data URL。通常是一个base64的文件数据字符。你可以用此data URL去做类似为image设置src属性的事情。

3、将文件读取为二进制（ readAsBinaryString() ）

var reader = new FileReader();
reader.onload = function(e) {
  var rawData = reader.result;
}
reader.readAsBinaryString(file);

用于读取任何类型的文件。返回文件的原生二进制数据。如果你用readAsBinaryString() 结合 XMLHttpRequest.sendAsBinary() 方法，你利用js向服务器可以上传任何类型的文件。

4、将文件读取为二进制数组buffer（ readAsArrayBuffer() ）

var reader = new FileReader();

reader.onload = function(e) {
  var arrayBuffer = reader.result;
}

reader.readAsArrayBuffer(file);

一个ArrayBuffer是一个固定长度的二进制数组buffer。在处理文件时（如将JPEG图像转换为PNG），它们可以派上用场。

5、abort
reader.abort();

读取图片示例：链接

参考