我来帮你完善这个PDF分块上传的实现，结合你给出的代码片段，下面是完整的可运行方案：

核心思路 #

• 利用File.slice()将PDF文件切割成固定大小的分块，避免单文件过大导致上传失败
• 为每个分块携带关键元数据，方便服务端识别分块顺序与归属
• 循环发送Ajax请求传输分块，最后一块标记为最终分块，通知服务端完成文件合并

完整代码实现 #

以下是包含初始化分块、上传请求的完整逻辑：

// 配置分块大小，比如设置为1MB，可根据服务器限制调整
const CHUNK_SIZE = 1 * 1024 * 1024;

// 初始化分块上传流程
self.initFileUpload = function(docId, file) {
    const fileName = file.name;
    // 计算总块数，向上取整确保最后一块也能被处理
    const totalChunks = Math.ceil(file.size / CHUNK_SIZE);
    
    // 循环生成并上传每个分块
    for (let chunkIndex = 0; chunkIndex < totalChunks; chunkIndex++) {
        const start = chunkIndex * CHUNK_SIZE;
        const end = Math.min(start + CHUNK_SIZE, file.size);
        const chunk = file.slice(start, end);
        const isFinalChunk = (chunkIndex === totalChunks - 1);
        
        // 调用上传接口，传递分块元数据
        self.ajaxCallToUploadFile(docId, isFinalChunk, fileName, chunk, chunkIndex, totalChunks);
    }
};

// 完善后的上传Ajax方法
self.ajaxCallToUploadFile = function (docId, finalChunk, fileName, data, chunkIndex, totalChunks) { 
    var formData = new FormData(); 
    formData.append('file', data);
    // 添加服务端需要的元数据，用于分块拼接
    formData.append('docId', docId);
    formData.append('finalChunk', finalChunk);
    formData.append('fileName', fileName);
    formData.append('chunkIndex', chunkIndex);
    formData.append('totalChunks', totalChunks);
    
    var serviceUrl = "http://localhost:8080/JerseyDemos/rest/upload/chunk";
    
    // 使用原生XMLHttpRequest发送请求，也可替换为fetch/axios
    const xhr = new XMLHttpRequest();
    xhr.open('POST', serviceUrl, true);
    
    xhr.onload = function() {
        if (xhr.status === 200) {
            console.log(`分块 ${chunkIndex + 1}/${totalChunks} 上传成功`);
            if (finalChunk) {
                console.log("所有分块上传完成，等待服务端合并文件");
                // 这里可添加合并完成后的业务逻辑，比如跳转文件详情页
            }
        } else {
            console.error(`分块 ${chunkIndex + 1} 上传失败，状态码：${xhr.status}`);
            // 实际项目中可添加重试机制，比如失败后重试3次
        }
    };
    
    xhr.onerror = function() {
        console.error(`分块 ${chunkIndex + 1} 上传请求出错，请检查网络或服务端状态`);
    };
    
    xhr.send(formData);
};

关键细节说明 #

• 分块大小调整：CHUNK_SIZE可根据服务器的单请求大小限制修改，比如改成2MB或5MB，平衡请求数量与单请求大小
• 元数据必要性：docId作为文件的唯一标识，chunkIndex和totalChunks用于服务端按顺序拼接分块，缺一不可
• 并发控制：当前代码是并行发送所有分块请求，若担心服务器压力过大，可改成串行发送（即上一个分块上传成功后再发送下一个）
• 错误处理：基础的错误日志已添加，实际场景中建议增加重试、断点续传的逻辑，提升上传稳定性

服务端配套提示 #

服务端需要实现的核心逻辑：

1. 接收每个分块，根据docId和chunkIndex保存为临时文件
2. 收到finalChunk=true的请求时，按序号读取所有临时分块，合并为完整PDF
3. 合并完成后清理临时分块文件，避免占用存储空间

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