使用Kendo实现Excel转指定格式JSON的文件上传功能方案求助

嘿，我刚好做过类似的需求，结合SheetJS（xlsx库）和Kendo Upload组件就能完美搞定，给你一步步拆解：

1. 核心依赖：用SheetJS解析Excel内容 #

Kendo本身没有内置Excel解析能力，所以我们需要借助SheetJS这个轻量强大的库来读取Excel文件并转成原始JSON，之后再做格式转换。

实现步骤： #

• 先引入SheetJS：可以用CDN或者npm安装（npm install xlsx），前端直接用script标签引入的话，比如<script src="https://cdn.jsdelivr.net/npm/xlsx@0.18.5/dist/xlsx.full.min.js"></script>
• 在Kendo Upload的事件中读取上传的文件，用FileReader转成ArrayBuffer，再交给SheetJS解析：

$("#excelUpload").kendoUpload({
  select: function(e) {
    // 获取上传的原始文件对象
    const file = e.files[0].rawFile;
    const reader = new FileReader();
    
    reader.onload = function(loadEvent) {
      // 解析Excel为工作簿
      const data = new Uint8Array(loadEvent.target.result);
      const workbook = XLSX.read(data, { type: 'array' });
      
      // 取第一个工作表（如果有多表的话可以循环处理）
      const firstSheet = workbook.Sheets[workbook.SheetNames[0]];
      // 转成原始JSON数组（SheetJS会自动映射Excel列名到对象键）
      const rawExcelData = XLSX.utils.sheet_to_json(firstSheet);
      
      // 把原始数据转成后端要求的格式
      const formattedJson = transformToRequiredStructure(rawExcelData);
      // 暂存起来，等后续提交给后端
      window.processedExcelData = formattedJson;
    };
    
    reader.readAsArrayBuffer(file);
  },
  // 覆盖默认的上传行为，改成提交JSON数据
  upload: function(e) {
    e.preventDefault();
    
    // 用fetch提交JSON到后端API
    fetch('/your-api-endpoint', {
      method: 'POST',
      headers: { 'Content-Type': 'application/json' },
      body: JSON.stringify(window.processedExcelData)
    })
    .then(res => res.json())
    .then(result => {
      alert('数据上传成功！');
      // 这里可以添加成功后的UI更新逻辑
    })
    .catch(err => {
      console.error('上传失败:', err);
      alert('数据上传失败，请重试');
    });
  }
});

2. 格式转换函数：映射字段+数据类型处理 #

关键是把SheetJS输出的原始JSON，转换成后端要求的字段名和数据类型，比如LineNumber是字符串，Parma是数字，IsValid是布尔值等。

示例转换函数（你需要根据自己Excel的列名调整映射关系）：

function transformToRequiredStructure(rawData) {
  return rawData.map((item, index) => {
    // 这里假设Excel的列名分别是「行号」「参数」「零件号」等，你要替换成实际的列名
    const isValid = !!item.参数 && !!item.零件号; // 简单验证必填字段
    const validationMsg = isValid ? 'test' : '必填字段缺失';
    
    return {
      LineNumber: String(item.行号 || index + 1), // 如果Excel没有行号，用索引+1代替
      Parma: Number(item.参数 || 0), // 转数字，空值设默认0
      PartNumber: Number(item.零件号 || 0),
      TestQual: item.测试资质 || 'AQ',
      UOM: item.单位 || 'LIT',
      TestCode: item.测试代码 || 'RME',
      Weight1: Number(item.重量1 || 0),
      Weight2: Number(item.重量2 || 0),
      Weight3: Number(item.重量3 || 0),
      IsValid: isValid,
      ValidationMessage: validationMsg
    };
  });
}

3. 额外注意点 #

• 数据验证：可以在转换函数里加更复杂的校验逻辑，比如判断Weight是否为正数，TestQual是否是允许的值（如"AQ"），根据校验结果动态设置IsValid和ValidationMessage。
• 多工作表处理：如果Excel有多个工作表，可以循环遍历workbook.SheetNames，把每个表的数据都转成JSON合并到数组里。
• 大文件兼容：100条记录完全没问题，要是遇到更大的文件，可以考虑在转换时做分批处理，但一般前端处理几千条都不会有性能问题。

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