前端哈希计算策略

前端大文件哈希计算的两种策略:全量哈希与抽样哈希,以及 Web Worker 优化

#type / concept #status / evergreen #tech / dev / frontend #platform / browser

[!info] related notes

前端哈希计算策略

一句话定义

前端哈希计算有两种策略:全量哈希准确但慢,抽样哈希快但不够绝对准确,实际中常折中使用。

核心内容

哈希的作用

  • 唯一标识文件
  • 支持秒传判断
  • 支持断点续传匹配
  • 支持完整性校验

方案 A:整文件哈希

优点

  • 准确
  • 可直接判断文件是否相同

缺点

  • 大文件算得慢
  • 浏览器 CPU 压力大
  • 体验可能变差

方案 B:抽样哈希

比如只取:

  • 文件头
  • 文件尾
  • 中间若干块

优点

  • 快很多

缺点

  • 不如全量绝对准确

实际折中方案

  1. 前端先算抽样 hash,用于快速去重/秒传判断
  2. 后端再做严格校验

Web Worker 优化

大文件全量 hash 会卡 UI,解决思路:

  • 用 Web Worker 算 hash,避免阻塞主线程
  • 分片增量计算
  • 先抽样 hash,再服务端做严格校验
// Web Worker 中计算 hash
self.onmessage = async (e) => {
  const { file, chunkSize } = e.data;
  // 分片读取并增量计算 hash
  // 定期 postMessage 进度
};

边界与易混淆点

  • hash 算法选择:MD5 快但安全性弱,SHA-256 安全但慢,根据场景选择
  • 抽样策略:需要足够分散才能代表整个文件,通常取头、尾、中间若干位置
  • 并发计算:Web Worker 可以开多个并行计算不同片段的 hash
创建于 2026/3/28 更新于 2026/5/27