最近做后台项目遇到需要解析用户上传的excel文件,并导出文件中的数据的需求;在做这个需求的过程中,才感觉到我大Javascript是无所不能的啊,能够通过二进制方式读取到excel文件中的内容,然后进一步读取并操控excel文件中的数据,并将数据以自己需要的格式导出来。

  解析读取excel文件,有一个非常好用的插件,在这里强烈推荐给大家:

  Spreadsheet Parser and Writer

  这个插件能够帮助你读取到excel文件中的数据并将数据以json的格式导出来,非常好用,非常方便。

  以下是我在使用这个插件的过程中所做的demo:

  

var Excel = function () {
        this.data = []   // EXCEL数据
        this.checkResult = false   // EXCEL规范检测结果
}

Excel.prototype.check = function (fileSelector,checkStr,url,suc) {
        var self = this;

        document.querySelector(fileSelector).addEventListener('change',function (e) {
            var files = e.target.files;
            var fileReader = new FileReader();


            // 以二进制方式打开文件
            fileReader.readAsBinaryString(files[0]);

            fileReader.onload = function(ev) {
                try {
                    var result = ev.target.result,
                        workbook = XLSX.read(result, {type: "binary"});    // 以二进制流方式读取得到整份excel表格对象
                } catch (e) {
                    console.error("文件类型不正确");
                    return;
                }


                var fromTo = '';                   //要读取EXCEL的表格范围   A1:C4
                var excelHeadStr = '';             //读取的EXCEL表头
                var headCol = '';                  //表头列号
                var arr = ['A1','B1','C1','D1','E1','F1','G1','H1','I1','J1','K1','L1','M1','N1','O1','P1','Q1','R1','S1','T1','U1','V1','W1','X1','Y1','Z1']
                var index ;

                // 遍历workbook下的Sheets对象来读取每一个上传文件的内容
                for (var sheet in workbook.Sheets) {
                    if (workbook.Sheets.hasOwnProperty(sheet)) {
                        fromTo = workbook.Sheets[sheet]["!ref"];    // 获取EXCEl文件中存在数据的行号和列号

                        for(var j = 0 ; j < 3 ; j++ ){
                            excelHeadStr += workbook.Sheets[sheet][arr[j]].h + ','
                        }

                        // 去除字符串末尾','
                        excelHeadStr = excelHeadStr.substring(0, excelHeadStr.length - 1)

                        if( excelHeadStr === checkStr ){
                            self.checkResult = true
                            fileUpload(fileSelector,url,suc)
                        }else{
                            console.error('EXCEL不符合模版规范')
                            self.checkResult = false
                        }

                        self.data = self.data.concat(XLSX.utils.sheet_to_json(workbook.Sheets[sheet]));
                    }
                }
            };
        })
    }

function fileUpload(fileSelector,url,suc) {
    var file = document.querySelector(fileSelector).files[0],
        formData = new FormData(),
        reader = new FileReader();

    // 判断上传文件类型
    if (!/^.*?\.(xls|xlsx)$/i.test(file.name)){
        console.error('所上传文件类型不符')
        return false
    }

    formData.append('file',file)
    var xhr = new XMLHttpRequest();
    xhr.open('POST', url, true);
    xhr.onreadystatechange = function() {
        if (xhr.readyState === XMLHttpRequest.DONE) {
            var data = JSON.parse(xhr.responseText);
            var src = data.url;
            suc(src);
        }
    }
    xhr.onload = function (e) {
        if (xhr.status === 200) {
            console.log('uploaded');
        } else {
            console.log('file upload failed');
        }
    };
    xhr.send(formData);
}

  

  调用Excel构造方法进行解析:

var a = new Excel()
    
 a.check('#excel-file','分类,产品名称,货号','http://11.com/resource/_upload',function (src) {
        console.log(src)
     console.log(a.data)
     console.log(a.checkResult)
})

 

对内贵有志气,对外贵得人心