使用AJAX jQuery读取.xlsx文件失败的技术求助

嘿，我明白你遇到的麻烦了——用AJAX加载CSV没问题，但换成XLSX就出现一堆乱码，这其实是两种文件格式的本质差异导致的：

• CSV是纯文本格式，可以直接通过AJAX读取并按文本解析；
• 而XLSX是二进制压缩格式（本质是打包了XML文件的ZIP包），直接用读取纯文本的方式加载，自然会出现乱码。

下面给你一个可行的解决方案，用SheetJS（xlsx.js）这个轻量库在浏览器端解析XLSX文件，替换原来的AJAX逻辑：

完整示例代码 #

<!DOCTYPE html>
<html>
<head>
    <title>XLSX File to HTML Table</title>
    <!-- 引入SheetJS库 -->
    <script src="https://cdn.jsdelivr.net/npm/xlsx@0.18.5/dist/xlsx.full.min.js"></script>
</head>
<body>
    <input type="file" id="fileInput" accept=".xlsx,.xls,.csv">
    <div id="tableContainer"></div>

    <script>
        document.getElementById('fileInput').addEventListener('change', handleFileSelect);

        function handleFileSelect(e) {
            const file = e.target.files[0];
            if (!file) return;

            const reader = new FileReader();
            reader.onload = function(e) {
                // 解析文件内容
                const data = new Uint8Array(e.target.result);
                const workbook = XLSX.read(data, { type: 'array' });

                // 获取第一个工作表
                const firstSheetName = workbook.SheetNames[0];
                const worksheet = workbook.Sheets[firstSheetName];

                // 转换成HTML表格
                const htmlTable = XLSX.utils.sheet_to_html(worksheet);
                document.getElementById('tableContainer').innerHTML = htmlTable;
            };
            // 以二进制方式读取文件
            reader.readAsArrayBuffer(file);
        }
    </script>
</body>
</html>

关键步骤说明 #

• 文件读取方式：用FileReader.readAsArrayBuffer()读取XLSX的二进制内容，而不是读文本；
• 解析逻辑：通过SheetJS的XLSX.read()解析二进制数据，得到工作簿对象；
• 生成表格：用XLSX.utils.sheet_to_html()直接把工作表转换成HTML表格，省去自己拼接DOM的麻烦。

如果你想保留原来的AJAX加载远程XLSX文件的逻辑，也可以调整AJAX的responseType为arraybuffer，再用SheetJS解析：

$.ajax({
    url: 'your-file.xlsx',
    method: 'GET',
    xhrFields: {
        responseType: 'arraybuffer'
    },
    success: function(data) {
        const workbook = XLSX.read(new Uint8Array(data), { type: 'array' });
        // 后续解析步骤和上面一致
        const firstSheetName = workbook.SheetNames[0];
        const htmlTable = XLSX.utils.sheet_to_html(workbook.Sheets[firstSheetName]);
        $('#tableContainer').html(htmlTable);
    }
});

这样处理后，XLSX文件就能正常显示成表格啦！

内容的提问来源于stack exchange，提问作者Ashwin Karki