Edge浏览器下载弹窗不弹出问题求助

问题概述 #

• 使用隐藏a标签模拟点击下载Blob文件时，Chrome会立即弹出带文件名的下载弹窗
• 改用window.open(url,'_blank')可解决弹窗不显示的问题，但无法设置自定义下载文件名

可行解决方案 #

无需改用window.open，调整原有a标签的实现逻辑即可兼顾弹窗正常显示和自定义文件名，核心是保证点击操作属于用户主动触发的同步行为。

修改后的代码示例：

// 确保此代码在按钮点击的同步回调中执行
const url = URL.createObjectURL(blob);
const downloadLink = document.createElement('a');
downloadLink.href = url;
downloadLink.download = filename;
downloadLink.style.display = 'none';
document.body.appendChild(downloadLink);
// 不设置target="_blank"，直接触发点击
downloadLink.click();
// 清理资源，避免内存泄漏
document.body.removeChild(downloadLink);
URL.revokeObjectURL(url);

核心要点 #

• 不要给a标签设置target="_blank"：该属性会触发新窗口，不仅可能被浏览器拦截，还会导致download属性失效，无法自定义文件名
• 临时插入DOM确保交互合法性：手动创建a标签并添加到DOM中，让浏览器识别这是用户主动触发的下载操作，而非脚本自动行为
• 及时释放Blob URL：下载完成后调用URL.revokeObjectURL释放资源，避免内存占用过高

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