FileSaver.js在Safari中无法下载PDF文件

Question

我遇到了一个关于FileSaver.js的问题，在Safari上无法下载PDF（或PNG或Excel文件），但在其他任何网络浏览器上都可以。控制台中会显示错误信息：“Failed to load resource: The network connection was lost.”

奇怪的是，如果是Tomcat提供服务，则无法下载此PDF文件，但如果是Apache提供服务，则下载正常。

以下是一段代码示例（我正在使用Angular 1.5.8）：

$http.get(url, { responseType: 'arraybuffer' })
            .success(function (response) {
                var file = new Blob([response], {type: 'application/pdf'});
                fileSaverService(file, filename);
            });

- Moussa

---

Safari似乎有一个bug。你尝试过使用saveAs的解决方法吗？var blob = new Blob([response], {type:"application/octet-stream"}) saveAs(blob, "mypdf.pdf") - zer02

$http 的遗留 promise 方法 success 和 error 已被弃用，请改用标准的 then 方法。 - Vivz

@Vivz，你的回答在这里完全没有用，但还是谢谢。正如我在帖子中指定的那样，我正在使用angular 1.5.8，并且success和error方法已经在angular 1.6中被弃用。 - Moussa

@Mouss，我参考了这个链接https://dev59.com/C1wX5IYBdhLWcg3wrBB6，在这里，OP使用的是比你更低版本的angular，并且.then对他起作用了。所以我认为这可能与此有关。 - Vivz

@zer02：我弄错了测试，我在Chrome上做了，而不是在Safari上，但在Safari上仍然无法工作 :( - Moussa

Answer 1

我曾经遇到过类似的问题，当时我使用axios发起了一个调用（在我的情况下是post请求）到下载服务。以下代码对我有效：

axios.post(url, downloadRequest, {responseType:'blob'})
    .then(response =>{              
        var filename = 'example.zip';
        var blob = new Blob([response.data], {type:"application/octet-stream"});
        saveAs(blob , filename);
    })
    .catch(error => {
        console.error(error);       
    });

- Murat Aykanat

Answer 2

我曾经在使用base64时遇到了问题，导致PDF无法打开。 我通过将base64转换为bin并将其转换为Uint8Array（byteNumbers）来解决了这个问题。 请查看下面的片段，这对我起了作用。

const byteCharacters = atob(b64);
const byteNumbers = new Array(byteCharacters.length);
for (let i = 0; i < byteCharacters.length; i++) {
   byteNumbers[i] = byteCharacters.charCodeAt(i);
}
const byteArray = new Uint8Array(byteNumbers);
            
var blob = new Blob([byteArray], {type: "application/pdf"});
saveAs(blob, "sample.pdf");

- Bhupesh Upadhyay