在 Safari 中使用 FileSaver.js 会损坏下载答案

【问题标题】：Using FileSaver.js in Safari damages download在 Safari 中使用 FileSaver.js 会损坏下载
【发布时间】：2019-07-16 10:57:57
【问题描述】：

我正在使用 FileSaver.js 在客户端使用 FileSaver.js 下载图像。在 Chrome 和 IE11 中运行良好。但在 Safari 11.1（我需要对 12+ 的支持）中，图像（.png 或 .jpg）会下载，但随后无法打开，并且操作系统会抱怨文件损坏或文件类型不受支持。

我的下载是这样的：

fileName = Ext.isIE || Ext.isSafari ? fileName + fileExtension : fileName;
saveAs(new Blob([file], { type: contentType }), fileName);

（saveAs 不会在 IE11 或 Safari 中添加文件扩展名，因此添加了 fileExtension）

无论如何，file 是一个 svg 字符串，而 contentType 是“image/png”或“image/jpeg”。我还尝试了以下调整：将 ";charset=utf-8" 附加到没有帮助的 contentType 中。预先添加“数据：”以创建一个 dataURL，但我很确定 FileSaver.js 应该处理这个。

我读到在 FileSaver.js 中检查浏览器是否为 Safari 时可能存在问题，因此我进入 FileSaver.js 源代码并将检查更改为 Ext.isSafari（使用 ExtJs 6）。没有帮助。我难住了。

不胜感激，谢谢。

【问题讨论】：

标签： javascript svg extjs safari filesaver.js

【解决方案1】：

当然，问题不在于 FileSaver.js。它甚至与浏览器无关，而是操作系统。

问题是我不能只在 SVG blob 上添加 .png 或 .jpg 并期望它表现良好。在 Windows（Chrome 和 IE11）上，“通过扩展名更改转换”工作正常，但 Mac 不接受它是合法的，因此拒绝文件损坏。

我可以通过下载扩展名为 .svg 的 svg 文件来重新创建它，看到它在 Mac 上可以正常打开，然后将扩展名更改为 .png 并看到我收到了相同的错误消息。我想 Windows 只是更宽容。

【讨论】：