如何解决下载带有“Content-Disposition”标头集的文件后，Chrome 删除了“Access-Control-Allow-Origin”标头
我有一个网页，其中包含通过 Wavesurfer.js 播放的音频文件，并提供下载文件的选项。文件存储在 cdn 子域（例如 cdn.example.com）中，因此下载 a 标签进行跨源下载。我的 CDN 设置了 Content-disposition 标头，因此 a 标记会触发下载并使用特定的文件名。 CDN 还正确设置了 Access-Control-Allow-Origin 标头中的主域。
Wavesurfer 播放文件没有任何问题，但只能在第一次下载音频文件之前。 Wavesurfer 使用 fetch API 下载文件，但在第一次通过 a 标签下载后由于 CORS 失败：“请求的资源上不存在‘Access-Control-Allow-Origin’标头”。
跨源下载会重新下载音频文件，而不是使用 Chrome 缓存中的文件。此下载请求不返回“CORS”标头，此后Chrome 的缓存版本也没有“CORS”响应标头。由于缓存文件中缺少 Access-Control-Allow-Origin 标头，Wavesurfer 无法再播放音频文件。
这在 Chrome 88 中发生，但它在 Firefox 85 中运行良好，看起来它通过带有 a 标头集的 Content-disposition 标记和 {{1 }} 请求。
播放没有 fetch 标头，但音频文件的下载显示在浏览器中，而不是触发下载。至少在这样的“下载”之后播放仍然有效。
这是 Chrome 浏览器中的错误还是我可以在 CDN 站点上做些什么？我无法控制 CDN 何时设置 Content-disposition 标头。
编辑：
这是一个有这个问题的最小代码。只有一个 Access-Control-* 和一个 fetch 标签（带有虚构的跨域 URL）：
a托管版本，在项目的测试版上，can be found here
版权声明：本文内容由互联网用户自发贡献，该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容， 请发送邮件至 dio@foxmail.com 举报，一经查实，本站将立刻删除。
