我太懂这种头疼的情况了——iOS Safari在处理Blob下载时确实有不少和Chrome不一样的限制，踩过这个坑的人都懂😅。下面是修改后的代码，既能兼容iPhone Safari，又能保留Chrome等其他浏览器的正常功能：

const downloadDocument = async (url) => {
  try {
    const response = await fetch(url);
    const blob = await response.blob();
    const blobUrl = window.URL.createObjectURL(blob);
    
    // 优化文件名获取逻辑，优先从响应头提取更准确的文件名
    const getFileName = () => {
      const contentDisposition = response.headers.get('Content-Disposition');
      if (contentDisposition) {
        const fileNameMatch = contentDisposition.match(/filename[^;=\n]*=((['"]).*?\2|[^;\n]*)/);
        if (fileNameMatch?.[1]) {
          return decodeURIComponent(fileNameMatch[1].replace(/['"]/g, ''));
        }
      }
      //  fallback到原逻辑
      return url.split('/').pop() || 'document';
    };
    const fileName = getFileName();

    const link = document.createElement('a');
    link.href = blobUrl;
    // 移除target="_blank"——Safari不支持用新窗口触发Blob下载，会被拦截
    link.download = fileName;
    
    // iOS Safari专属兼容处理
    if (navigator.userAgent.match(/(iPod|iPhone|iPad)/) && navigator.userAgent.match(/AppleWebKit/)) {
      // 把Blob转为File对象，Safari对File的下载支持更稳定
      const file = new File([blob], fileName, { type: blob.type });
      link.href = window.URL.createObjectURL(file);
      
      // 必须先把元素加入DOM，且延迟触发点击，避免Safari的交互拦截
      document.body.appendChild(link);
      setTimeout(() => {
        link.click();
        document.body.removeChild(link);
        // 清理两个URL对象，避免内存泄漏
        setTimeout(() => window.URL.revokeObjectURL(blobUrl), 100);
        setTimeout(() => window.URL.revokeObjectURL(link.href), 100);
      }, 10);
    } else {
      // 其他浏览器的常规处理
      document.body.appendChild(link);
      link.click();
      document.body.removeChild(link);
      setTimeout(() => window.URL.revokeObjectURL(blobUrl), 100);
    }
  } catch (error) {
    console.error('Error downloading document:', error);
    // 异常情况下直接打开原URL，Safari也能处理常规的文件链接
    window.open(url, '_blank', 'noopener,noreferrer');
  }
};

关键修改点说明： #

• 去掉target="_blank"：iOS Safari会拦截通过新窗口触发的Blob下载，这个属性是核心问题之一。
• 优化文件名获取：优先从服务器返回的Content-Disposition头提取文件名，比单纯拆分URL更可靠，很多后端都会返回这个字段。
• iOS专属适配：
  • 将Blob转为File对象：Safari对Blob直接下载的支持存在兼容性问题，转成File后能大幅提升成功率；
  • 延迟触发点击：确保创建的a标签完全挂载到DOM后再触发点击，避开Safari的非用户交互拦截机制；
  • 额外清理File的URL：避免内存泄漏。

另外要注意：如果你的请求存在跨域，一定要确保服务器配置了正确的CORS头，iOS Safari对跨域Fetch的Blob处理要求非常严格，CORS配置错误也会导致下载失败。

内容的提问来源于stack exchange，提问作者Pedro Rufino