JavaScript下载DICOM坐标文件失败：保存提示无文件

我之前也碰到过类似的Blob下载故障，结合你的代码和环境情况，帮你梳理下问题根源和修复方案：

一、核心代码问题：Blob URL生成错误 #

你的原代码里直接把Blob对象赋值给了a标签的href属性，这是不符合浏览器规范的——浏览器无法直接识别Blob对象作为下载链接，必须通过URL.createObjectURL()生成临时的Blob URL才能正常触发下载。

二、过时的事件创建API #

你用的document.createEvent('MouseEvents')已经被废弃了，现代浏览器推荐使用new MouseEvent()来创建事件，兼容性更好也更规范。

三、CORS插件的干扰 #

Allow-Control-Allow-Origin这类全局启用的CORS插件确实会干扰Blob URL的解析流程。Chrome对Blob URL有严格的安全校验，插件修改的HTTP头可能破坏了浏览器对本地Blob资源的识别逻辑，建议：

• 测试时暂时禁用该插件，看下载是否正常
• 如果必须使用插件，不要全局开启，只在需要跨域请求的特定域名启用

修正后的完整代码 #

function download(data, name, type) {
  // 基于传入的DICOM坐标数据生成Blob（替换原代码的硬编码测试数据）
  const blob = new Blob([JSON.stringify(data, null, 4)], { type: type });
  const link = document.createElement('a');
  // 生成Blob的临时访问URL
  const blobUrl = URL.createObjectURL(blob);
  
  link.href = blobUrl;
  link.download = name;
  
  // 使用现代API创建点击事件
  const clickEvent = new MouseEvent('click', {
    bubbles: true,
    cancelable: true,
    view: window
  });
  
  link.dispatchEvent(clickEvent);
  
  // 下载完成后释放Blob URL，避免内存泄漏
  setTimeout(() => {
    URL.revokeObjectURL(blobUrl);
  }, 100);
}

代码改动说明： #

• 替换了硬编码的测试数据，真正使用传入的data参数（你的原代码里写死了{a: '1'}，这会导致下载的不是实际的DICOM坐标数据）
• 用URL.createObjectURL()生成正确的Blob下载链接
• 改用new MouseEvent()创建点击事件，适配现代浏览器
• 添加URL.revokeObjectURL()释放临时URL，避免内存占用

测试建议 #

1. 先关闭Allow-Control-Allow-Origin插件，调用修正后的download函数测试下载
2. 如果下载正常，再调整插件的启用范围，只在需要跨域的域名开启

内容的提问来源于stack exchange，提问作者Francisco Maria Calisto