excel表格在线预览 java 在线浏览excel

项目里有个需求要在线查看服务端的Excel文件网上提供的代码不能远程访问服务端的Excel文件，只能同域访问，需要设置IIS跨域。

代码：

function  loadRemoteFile(url) {
 this.readWorkbookFromRemoteFile(url, function (workbook) {
    vueApp1.readWorkbook(workbook);
                    });},
// 从网络上读取某个excel文件，url必须同域，否则报错
//这里就要在IIS里设置了
function  readWorkbookFromRemoteFile(url, callback) {
                    // var xhr = new XMLHttpRequest();
                    var xhr = this.getHttpObj();
                    xhr.open('get', url, true);
                    xhr.responseType = 'arraybuffer';
                   // response.setHeader("Access-Control-Allow-Origin", "http:localhost:8080/");
                    xhr.setRequestHeader("Content-Type", "application/x-www-form-urlencoded;");
                    xhr.onload = function (e) {
    if (xhr.status == 200) {
          var data = new Uint8Array(xhr.response)
         var workbook = XLSX.read(data, { type: 'array' });
        if (callback) callback(workbook);
    }
                    };
                    xhr.send();}
 
 function   getHttpObj() {
                    var httpobj = null;
                    try {
                        httpobj = new ActiveXObject("Msxml2.XMLHTTP");
                    }
                    catch (e) {
                        try {
                            httpobj = new ActiveXObject("Microsoft.XMLHTTP");
                        }
                        catch (e1) {
                            httpobj = new XMLHttpRequest();
                        }
                    }
                    return httpobj; }
 
function  readWorkbook: function (workbook) {
 var sheetNames = workbook.SheetNames; // 工作表名称集合
                    var worksheet = workbook.Sheets[sheetNames[0]]; // 这里我们只读取第一张sheet

var csvcc = XLSX.utils.sheet_to_csv(worksheet);   //手动调的布局，也可以用sheet_to_html直接生成html的table，如果列文字多显示不美观
                    $("#excelPdf").css("overflow-x", "visible"); 
                    $("#excelPdf").html(this.sheetHtml(csvcc));}
 
 function  csv2table: function (csv) { 
                    var html='';
                    var first = true;
                    var rows = csv.split('\n');
                    rows.pop(); // 最后一行没用的
                    rows.forEach(function (row, idx) {
                        var columns = row.split(',');
                        var blank = columns.filter(c=>c == "");
                        var len = columns.filter(c=> {
                           let blen=  vueApp1.getBLen(c);
                           return blen > 12;
                        });                        if (blank.length > 2 && len.length>0) {
                            if (!first) html += '</table>';
                            html += '<p>';
                            columns.forEach(function (column) {
                                html += '<span style="padding-right:15px;">' + column + '</span>';
                            });
                            html += '</p>';
                        }
                        else {
                            if (first) html += '<table>'
                            first = false;                            html += '<tr>';
                            columns.forEach(function (column) {
                                html += '<td style="padding-right:15px;">' + column + '</td>';
                            });
                            html += '</tr>';
                        }
                    });

                    return html;
                }                function  getBLen(str) {     //把双字节的替换成两个单字节的然后再获得长度
                    if (str == null) return 0;
                    if (typeof str != "string"){
                        str += "";
                    }
                    return str.replace(/[^\x00-\xff]/g,"01").length;
                }