前端读取excel文件

由html5的FileReader这个对象来完成

FileReader接口的方法：

readAsBinaryString               file             将文件读取为二进制编码
readAsText                      file,[encoding]   将文件读取为文本，其中第二个参数是文本的编码方式，默认值为 UTF-8
readAsDataURL                    file             将文件读取为DataURL
abort                            (none)           中断读取操作(无论读取成功或失败，方法并不会返回读取结果，这一结果存储在result属性中)

相关事件：

onabort                               中断
onerror                               出错
onloadstart                        开始
onprogress                          正在读取
onload                                成功读取
onloadend                           读取完成，无论成功失败

核心代码：

    var reader = new FileReader(); //读取操作就是由它完成.
      reader.readAsBinaryString(file);//读取文件的内容,也可以读取文件的URL
      reader.onload = function (evt) {
               //当读取完成后回调这个函数,然后此时文件的内容存储到了result中,直接操作即可
               var data = evt.target.result,
      }

在上传文件之前，我们拿到文件内容，使用js-xlsx,来读取文件内容 npm install js-xlsx 在文件中，

var XLSX = require('xlsx');

var workbook = XLSX.read(data, {
                    type: 'binary'
                }), // 以二进制流方式读取得到整份excel表格对象

在reader.onload函数中

    reader.onload = function (evt) {
      //当读取完成后回调这个函数,然后此时文件的内容存储到了result中,直接操作即可
      try {
        var data = evt.target.result,
            workbook = XLSX.read(data, {
                type: 'binary'
            }), // 以二进制流方式读取得到整份excel表格对象
            buildings = []; // 存储获取到的数据
            var fromTo = '';
           // 遍历每张表读取
            for (var sheet in workbook.Sheets) {
                if (workbook.Sheets.hasOwnProperty(sheet)) {
                    fromTo = workbook.Sheets[sheet]['!ref'];
                    buildings = buildings.concat(XLSX.utils.sheet_to_json(workbook.Sheets[sheet]));
                    // break; // 如果只取第一张sheet表，就取消注释这行
                }
            }
            let fileRows = buildings.length - 1;//表格内容行数，减去表头的一行
           
    } catch (e) {
        console.log('文件类型不正确',e);
        return;
    }
  }

代码中workbook对象可以获取到文件的详细信息