JavaScript 请求取消中怎么在文件下载过程中中途取消任务-js教程-PHP中文网

javascript 中文件下载本身不可取消，但 fetch + abortcontroller 方式可中断请求并释放资源；需手动清理 url.createobjecturl 防内存泄漏，原生 a 标签 download 无法取消。

javascript 请求取消中怎么在文件下载过程中中途取消任务

在 JavaScript 中，文件下载过程本身无法直接“取消”，因为 location.href 或 <a download></a> 触发的下载是浏览器原生行为，不经过 JS 控制流。但若使用 fetch + ReadableStream + Response.blob() 等方式手动发起下载（尤其是大文件或需进度控制、权限校验等场景），则可通过 AbortController 实现请求级取消 —— 这能中断网络传输、释放连接，避免无谓带宽和内存消耗。

✅ 使用 fetch + AbortController 主动下载并取消

这是目前最可控的方式：用 fetch 获取响应流，边读取边写入 Blob 或触发下载，同时监听取消信号。

创建 AbortController 实例，其 signal 传给 fetch
调用 controller.abort() 即可中止请求（触发 fetch 抛出 AbortError）
注意：取消后需清理已创建的 URL.createObjectURL，防止内存泄漏

示例代码：

Java Maven Code Review

审查Java Maven项目（ZIP压缩包或GitLab仓库URL），检查代码规范、命名、模块边界、可维护性问题以及重复代码。

下载

let controller = null;
let downloadUrl = null;

async function startDownload(url) {
  controller = new AbortController();
  
  try {
    const response = await fetch(url, { signal: controller.signal });
    
    if (!response.ok) throw new Error(`HTTP ${response.status}`);
    
    // 流式读取（可选：配合进度条）
    const blob = await response.blob();
    downloadUrl = URL.createObjectURL(blob);
    
    const a = document.createElement('a');
    a.href = downloadUrl;
    a.download = 'file.zip';
    document.body.appendChild(a);
    a.click();
    document.body.removeChild(a);
    
  } catch (err) {
    if (err.name === 'AbortError') {
      console.log('下载已取消');
    } else {
      console.error('下载失败:', err);
    }
  }
}

function cancelDownload() {
  if (controller) {
    controller.abort();
    controller = null;
  }
  if (downloadUrl) {
    URL.revokeObjectURL(downloadUrl);
    downloadUrl = null;
  }
}