17370845950

本文介绍一种无需读取文件内容、仅依赖浏览器提供的 file 对象元数据（如 size、type、name）进行轻量级重复文件识别的方法，适用于表单中多个 `` 场景，兼顾实用性与性能。

在 Web 表单中处理多文件上传时，用户可能从不同路径选择同名文件（如 report.pdf），甚至重复选择同一物理文件。由于浏览器出于安全限制，File API 不暴露文件路径、inode、UUID 或内容哈希，也无法直接获取唯一标识符（如 SHA-256），因此无法 100% 精确判定两个 File 对象是否指向同一底层文件。

但实践中，我们可通过组合多个高区分度的只读属性进行概率性去重判断：size（字节大小）、type（MIME 类型）、name（文件名）三者联合匹配，可显著降低误判率。虽然理论上存在不同文件恰好 size/type/name 完全一致的极端情况（碰撞概率极低，尤其当 size > 0 且 type 非空时），但在多数业务场景（如文档上传、图片管理）中已足够可靠。

以下是一个完整、可运行的示例，实现跨多个 元素的文件列表合并与重复检测：

  
    上传组 1：
    
    

  
  
    上传组 2：
    
    

  
  提交并检查重复

? 关键说明与注意事项：

• ✅ 推荐组合判断：size + type 是最实用的双因子；添加 name 可提升用户体验（例如避免 invoice.pdf 与 scan.jpg 因巧合同 size/type 被误标），但不应作为唯一依据（同名不同内容很常见）。
• ⚠️ lastModified 不可靠：用户可能手动修改时间戳，或不同设备同步导致不一致，不建议用于去重逻辑。

• ⚠️ webkitRelativePath 仅限目录上传：需设置 webkitdirectory 属性，且非标准、兼容性有限，不适用于普通文件选择。
• ? 进阶优化方向：若需更高精度，可在用户确认后对疑似重复文件使用 FileReader.readAsArrayBuffer() 计算前 N KB 的快速哈希（如 xxHash），但会带来额外内存与 CPU 开销，需权衡。
• ? 服务端兜底：前端去重仅为体验优化，服务端仍必须做最终校验（如接收后计算内容哈希并查重），确保数据一致性。

综上，该方案以零内容加载为前提，在浏览器能力边界内实现了高效、可维护的重复文件识别，是现代文件上传流程中值得采纳的务实策略。