如何在客户端使用JavaScript读取XLSX文件？寻求技术帮助

我看你遇到的核心问题是没搞清楚FileReader是异步操作，你现在的代码里在调用readAsBinaryString之后立刻打印list，这时候读取还没完成，自然拿不到正确的数据。另外读取XLSX这类二进制文件，选对读取方式和处理时机很重要，我给你梳理下解决方案：

1. 纠正FileReader的异步使用方式 #

FileReader的所有readAsXXX方法都是异步执行的，它们的返回值不是读取到的数据——真正的读取结果只会在onload回调函数的e.target.result里。你之前的代码里，console.log(list)执行时读取还在进行，所以输出的肯定是错误的内容。

2. 完整的客户端读取+解析XLSX示例 #

如果只是想读取文件的二进制数据，用readAsArrayBuffer是最合适的；如果还要解析XLSX内容，可以用纯客户端的SheetJS库（完全不需要服务端）。下面是修正后的代码：

function onFilesSelect(e) {
  const files = e.target.files;
  for (const file of files) {
    // 先打印文件属性，这部分你原来的代码是对的
    console.log('文件信息:', {
      name: file.name,
      type: file.type,
      size: `${(file.size / 1024).toFixed(2)} KB`
    });

    const reader = new FileReader();
    
    // 读取完成的回调（核心：所有数据处理都放这里）
    reader.onload = function(e) {
      // 拿到ArrayBuffer格式的文件数据
      const arrayBuffer = e.target.result;
      console.log('读取到的二进制数据:', arrayBuffer);

      // 如果你需要解析XLSX内容，用SheetJS的话：
      // 先确保已引入SheetJS（比如通过CDN引入xlsx.full.min.js）
      const workbook = XLSX.read(arrayBuffer, { type: 'array' });
      
      // 获取第一个工作表的名称
      const firstSheetName = workbook.SheetNames[0];
      // 获取工作表对象
      const worksheet = workbook.Sheets[firstSheetName];
      // 转成JSON格式（也可以转成其他格式，比如CSV）
      const jsonData = XLSX.utils.sheet_to_json(worksheet);
      console.log('解析后的XLSX内容:', jsonData);
    };

    // 读取出错时的回调，方便排查问题
    reader.onerror = function(e) {
      console.error('文件读取失败:', e.target.error);
    };

    // 启动读取（用ArrayBuffer读取二进制文件）
    reader.readAsArrayBuffer(file);
  }
}

3. 关键注意事项 #

• 不需要依赖你提到的FileSystem API，普通的FileReader就足够处理用户选择的本地文件。
• 如果你不需要解析XLSX，只是拿到二进制数据，那onload里的arrayBuffer就是你要的内容，可以直接用于后续处理（比如转成Base64的话，也可以在回调里处理）。
• 确保测试用的是标准的XLSX文件，如果是旧版的XLS文件，类型不同，读取方式可能需要调整。

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