new FileReader() 文件上传

1：FileReader : 读取文件内容

readAsText(): 读取文本文件，(可以使用Txt打开的文件)
readAsBinaryString(): 读取任意类型的文件，返回二进制字符串
readAsDataURL: 方法可以将读取到的文件编码成DataURL ，可以将资料(例如图片、excel文件)内嵌在网页之中，不用放到外部文件
abort: 中断读取

2：FileReader : 捕获读取文件的状态

onabort:读取文件断片时触发
onerror:读取文件错误时触发
onload:文件读取成功时触发
onloadend:文件读取完毕之后，不管成功还是失败触发
onloadstart: 开始读取文件时触发
onprogress:读取文件过程中触发

使用：

html部分：

<form action="http://www.baidu.com" enctype="mulitipart/form-data">
  <input id="ipnut_file" type="file" name="fileImg" accept="image/*">
  <img id="view_img" src="">
</form>

js部分：

const viewImg = document.getElementById('view_img');
const files = document.getElementById('ipnut_file').files;
if(files && files[0]) {
  if(window.FileReader) {
    const reader = new FileReader();
    reader.readAsDataURL(files[0]);
    reader.onload = () => {
      viewImg.setAttribute('src', reader.result);
    }
  }
}