Eel应用中通过JS在Chrome浏览器触发下载仅能生效一次问题求助

这是Eel框架对Chrome浏览器内置的data URI请求存在拦截缓存逻辑导致的：Eel会拦截所有Chrome窗口内的资源请求，首次设置的data URI可以正常通过路由校验，第二次复用同一个<a>标签更新href属性时，Eel的缓存逻辑没有正确识别更新后的data URI，直接拦截了下载请求，就会出现Chrome显示下载提示但最终没有文件生成的问题。Edge的请求处理逻辑和Chrome有差异，无Eel拦截的纯浏览器环境也不会触发这个逻辑，所以这两个场景下功能正常。

方案1：每次下载动态生成临时<a>标签（最稳妥，完全规避复用标签的缓存问题） #

不要复用页面中固定的jsonLink标签，每次触发下载时生成临时标签，完成后立即销毁，代码示例：

// string为你提前生成的JSON字符串
const tempLink = document.createElement('a');
tempLink.download = 'exportedToJson.json';
tempLink.href = 'data:application/json;charset=utf-8,' + encodeURIComponent(string);
document.body.appendChild(tempLink);
tempLink.click();
document.body.removeChild(tempLink);

方案2：改用Blob对象生成URL适配Eel拦截逻辑 #

如果需要兼容更大体积的JSON导出，也可以用Blob替代data URI，Eel对Blob URL的拦截适配更完善，同时记得用完释放内存：

const jsonBlob = new Blob([string], { type: 'application/json' });
const blobUrl = URL.createObjectURL(jsonBlob);
const jsonLink = document.getElementById('jsonLink');
jsonLink.download = 'exportedToJson.json';
jsonLink.href = blobUrl;
jsonLink.click();
// 延迟释放避免下载请求还没发就被回收
setTimeout(() => URL.revokeObjectURL(blobUrl), 100);

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