Question

Dears，我正在使用基于Angular 5的项目，我需要在FileReader对象的帮助下显示图像（其中base64编码为源）。它在Chrome和Firefox中运行良好但在Safari中无法运行（在Ipad和Iphone中都有效）。

这是我在Pipe中的代码：

httpClient.get(url, {headers: headers, responseType: "blob"})
  .switchMap(blob => {

    let imageBlob = new Blob([blob], {type: 'image/png'});

    return Observable.create(observer => {

      const reader = new FileReader();
      reader.readAsDataURL(imageBlob);
      reader.onloadend = ()=>{

        let securedPath = this.sanitizer.bypassSecurityTrustResourceUrl(reader.result);
        observer.next(securedPath); // emit the base64 string result

      }

      if(download){

        this.helperService.downloadFile(download, blob);
      }

    });
  });

我找到了一些建议来检查浏览器中是否存在FileReader的来源，如果没有，则相应处理，例如：

 if(FileReader) {   //returns true in Safari.

    alert("The browser SUPPORTS FileReader");
 } else {

   alert("The browser doesn't support the FileReader Object, so do this ");
}

问题是检查返回true而typeof FileReader返回function因此我的Safari浏览器版本（9.0）已经支持FileReader对象。

此外，当我检查base64编码的长度时，它始终会显示5，并且源会缩短到Safari中的data:..。其余部分在Safari中删除。

如果有人能帮助我解决这个问题，我将非常感激。谢谢！

Angular 5. Javascript FileReader不在safari中工作，但它适用于chrome和Firefox

0 个答案: