Edge(WebView4Delphi)下JS批量写入QtrMinute到文件失败求助

1. 实现每500条数据分块写入 #

修改SaveQtrMin函数，将数组按500条拆分，每个块生成带序号的独立文件，同时用数组join替代字符串累加，提升大数据拼接的性能：

function SaveQtrMin() {
    const chunkSize = 500;
    // 循环拆分数组为指定大小的块
    for (let i = 0; i < qtrArray.length; i += chunkSize) {
        const currentChunk = qtrArray.slice(i, i + chunkSize);
        // 用map+join高效拼接块内数据
        const chunkContent = currentChunk.map(item => item.qtrMinute).join('\n');
        const fileName = `FileNameToSave_${Math.floor(i/chunkSize)+1}.txt`;
        try {
            saveTextAsFile(fileName, `SaveQtrMinutes\n${chunkContent}`);
        } catch(exc) {
            alert(`第${Math.floor(i/chunkSize)+1}块保存失败: ${exc.message}`);
        }
    }
}

同时优化saveTextAsFile，添加Blob URL释放逻辑，避免内存泄漏：

function saveTextAsFile(fileNameToSaveAs, textToWrite) {
    const textFileAsBlob = new Blob([textToWrite], {type:'text/plain'});
    const downloadLink = document.createElement("a");
    downloadLink.download = fileNameToSaveAs;
    
    if (window.webkitURL != null) {
        const blobUrl = window.webkitURL.createObjectURL(textFileAsBlob);
        downloadLink.href = blobUrl;
        // 下载完成后释放Blob资源
        downloadLink.addEventListener('click', () => {
            setTimeout(() => window.webkitURL.revokeObjectURL(blobUrl), 100);
        });
    }
    
    // 临时挂载元素到DOM（部分WebView环境需要此步骤）
    document.body.appendChild(downloadLink);
    downloadLink.click();
    document.body.removeChild(downloadLink);
}

2. 大量数据写入失败的原因分析 #

• 内存占用过载：原代码用字符串+=拼接2000条数据，会生成大量中间字符串，导致内存占用飙升，WebView4Delphi的Edge环境对单个Blob大小或内存使用存在限制，超过阈值后出现无响应。
• Blob资源未释放：原代码未调用revokeObjectURL释放Blob URL，多次调用后引发内存泄漏，导致后续操作因内存不足失效。
• 异步操作异常无法捕获：downloadLink.click()触发的下载是浏览器级异步行为，JS的try/catch无法捕获该过程中的异常，因此原代码的异常捕获逻辑不会触发。

3. 异常捕获优化 #

由于浏览器下载操作的异常无法通过JS同步捕获，可通过以下方式增强容错：

• 对每个分块的Blob创建、拼接过程单独捕获异常，定位具体失败的块。
• 监控WebView的内存使用情况，确认是否存在环境级别的内存限制。

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