JavaScript读取本地Excel文件：从IE ActiveX到现代方案

为什么不再推荐IE ActiveX方案

在旧版Internet Explorer浏览器中，开发人员常通过 new ActiveXObject("Excel.Application") 创建对象来操作本地Excel文件。虽然这种方式使用简单，但它存在致命缺陷：

1. 环境限制极严：仅限IE浏览器，且要求客户端必须安装完整版Microsoft Office。
2. 安全风险高：默认浏览器设置会拦截未标记的安全ActiveX控件，需要用户手动修改“可信站点”及ActiveX运行权限，普通用户难以接受。
3. 已淘汰的技术：Chrome、Firefox、Edge等现代浏览器均不支持ActiveX对象。

现代Web开发的标准方案

目前主流的前端项目不再依赖特定浏览器的私有组件，而是使用标准的Web API结合轻量级JS库来实现全平台兼容的文件读取。

第1步：引入解析库

推荐使用业界广泛使用的开源库 SheetJS (xlsx.js) 或 PapaParse（适用于CSV）。这里以处理 .xlsx/.xls 文件最常用的 SheetJS 为例：

<script src="https://cdn.sheetjs.com/xlsx-0.20.0/package/dist/xlsx.full.min.js"></script>

第2步：构建文件输入与解析逻辑

利用HTML原生的 <input type="file"> 触发读取，再通过FileReader或URL.createObjectURL将文件转为二进制流，最后由库函数解析为JSON数组。

<input type="file" id="excelInput" accept=".xlsx, .xls" />
<button onclick="processExcel()">读取文件</button>

<script>
function processExcel() {
    const fileInput = document.getElementById('excelInput');
    const file = fileInput.files[0];
    if (!file) return alert('请先选择Excel文件');

    const reader = new FileReader();
    
    // 定义加载完成后的回调
    reader.onload = function(e) {
        try {
            // 1. 获取二进制数据
            const data = e.target.result;
            
            // 2. 使用SheetJS解析 workbook
            const workbook = XLSX.read(data, { type: 'binary' });
            
            // 3. 获取第一个 sheet 的名称
            const firstSheetName = workbook.SheetNames[0];
            
            // 4. 将 sheet 转换为 JSON 格式的数据
            const worksheet = workbook.Sheets[firstSheetName];
            const jsonData = XLSX.utils.sheet_to_json(worksheet);
            
            console.log('读取到的数据:', jsonData);
            alert('成功读取 Excel 数据，请查看控制台');
        } catch (err) {
            console.error(err);
            alert('解析失败，请检查文件格式');
        }
    };

    // 以二进制字符串模式读取文件
    reader.readAsBinaryString(file);
}
</script>

关键注意事项

• 列头匹配：sheet_to_json 默认使用第一行作为键名（Key），如果您的Excel没有标准表头，可能需要配置 {header: 1} 使其返回二维数组。
• 性能考量：对于超大体积的Excel文件（例如超过10MB），建议在后端进行转换处理，或者前端采用流式分块读取，避免页面内存溢出导致卡顿。