React导出Excel时sheet名称超31字符报错无法下载问题求助

问题根因 #

Sheet名称最长31字符是微软Excel官方格式的硬性规范，所有主流表格编辑器（Office、WPS、谷歌表格等）都强制遵守该规则，并非xlsx库的自定义限制。不存在完全不修改Sheet名称还能生成可正常打开的合规Excel文件的方案，强行跳过校验生成的文件会直接被识别为损坏。

如果需要保留原长表名的完整信息，可采用以下低感知兼容方案： #

方案1：Sheet名截断保留辨识度+多位置补全完整表名 #

该方案对用户使用影响最小，同时完全符合Excel规范：

• Sheet名称保留前28位原始字符，末尾拼接...标识存在截断，总长度控制在31位以内，保证辨识度
• 完整原表名可在三个位置保留，完全满足溯源需求：
  1. 导出的Excel文件名不受31字符限制，可直接使用完整原表名
  2. 在Sheet第一行插入完整表名作为备注行
  3. 写入Excel文件的自定义属性字段

修改后的代码示例：

var workbook = XLSX.utils.book_new();
// 处理Sheet名，控制长度在31字符以内，保留辨识度
const processedSheetName = title.length > 31 ? `${title.slice(0, 28)}...` : title;
workbook.SheetNames.push(processedSheetName);

// 构造带完整表名备注的数据集
const fullTableData = [
  [`完整表名：${title}`], // 首行插入完整表名备注
  [], // 空行分隔备注和数据
  ...tableData
];
var workSheet = XLSX.utils.aoa_to_sheet(fullTableData);

workbook.Sheets[processedSheetName] = workSheet;
var output = XLSX.write(workbook, {bookType:'xlsx', type:'binary'});

function s2ab(s) {
  var buf = new ArrayBuffer(s.length);
  var view = new Uint8Array(buf);
  for (var i=0; i!=s.length; ++i) view[i] = s.charCodeAt(i) & 0xFF;
  return buf;
}
// 文件名完整使用原长表名，不受长度限制
saveAs(new Blob([s2ab(output)], {type:"application/octet-stream"}), `${title}.xlsx`);

方案2：拆分超长表名为多Sheet #

如果必须完整展示表名字符，可将超长表名按语义拆分为多段，分别作为多个Sheet的名称，全量数据同步写入所有Sheet，用户打开文件后可拼接多Sheet名得到完整原表名。该方案仅适合数据量较小的场景，不会明显增加文件体积。 #

禁用操作提示 #

不要尝试修改xlsx库源码跳过长度校验，生成的不符合规范的文件会被所有主流表格工具识别为损坏，反而无法正常使用。

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