单次会话文件批量上传用sessionstorage记录已传文件清单：1.用文件名+最后修改时间戳或轻量哈希作唯一标识；2.清单以json数组存取；3.上传前过滤已传文件；4.支持手动清空或重置。
在单次会话的文件批量上传中，用 sessionStorage 记录已成功上传的文件清单，核心是：每次上传成功后，把文件标识（如文件名、唯一 ID 或哈希）存入 sessionStorage；页面刷新或跳转后仍可读取，但关闭标签页即清空，符合“单次会话”需求。
1. 选择合适的文件标识存入 sessionStorage
不能直接存 File 对象（它不可序列化），应提取稳定、可复用的标识字段：
-
推荐用文件名 + 最后修改时间戳（兼顾可读性与轻微去重）：
file.name + "_" + file.lastModified - 或生成轻量哈希（如用
spark-md5算前 2MB 的简略 hash），适合需严格判重的场景 - 避免只用
file.name，同名文件多次选中会导致误判
2. 将清单统一维护为数组并 JSON 序列化存储
sessionStorage 只支持字符串值，需手动序列化/解析：
// 初始化或读取已有清单
const uploadedFiles = JSON.parse(sessionStorage.getItem('uploadedFiles') || '[]');
// 上传成功后追加（例如 file 是原生 File 对象）
const fileId = `${file.name}_${file.lastModified}`;
if (!uploadedFiles.includes(fileId)) {
uploadedFiles.push(fileId);
sessionStorage.setItem('uploadedFiles', JSON.stringify(uploadedFiles));
}
3. 上传前快速校验是否已传，避免重复提交
用户可能重新选择同一组文件，可在上传前过滤掉已成功的项：
function filterAlreadyUploaded(files) {
const uploadedIds = new Set(JSON.parse(sessionStorage.getItem('uploadedFiles') || '[]'));
return Array.from(files).filter(file => {
const id = `${file.name}_${file.lastModified}`;
return !uploadedIds.has(id);
});
}
// 使用示例
const pendingFiles = filterAlreadyUploaded(input.files);
if (pendingFiles.length === 0) {
alert('所选文件均已上传成功');
return;
}
// 继续发起上传请求...
4. 支持手动清除或重置清单（可选但实用）
提供“清空上传记录”按钮，方便调试或用户主动重试：
function clearUploadHistory() {
sessionStorage.removeItem('uploadedFiles');
}
// 或重置为指定数组
sessionStorage.setItem('uploadedFiles', JSON.stringify(['demo.pdf_1712345678900']));
注意：sessionStorage 同源且仅限当前标签页，多标签并行上传需额外协调（如用 BroadcastChannel）；若需跨标签同步，应改用 localStorage 配合事件监听，但就“单次会话”而言，sessionStorage 更安全、更精准。
Java免费学习笔记：立即使用
解锁 Java 大师之旅：从入门到精通的终极指南
