为什么此代码在 MacOS Big Sur Safari 上失败？

问题描述

我正在尝试使用 PDF 浏览器扩展程序在 MacOS Big Sur Safari 上获得 PDF 预览。

我们有一个 .NET 框架 web api 返回文件数据。使用以下函数检索文件数据。

export class AttachmentService {
    constructor(
        private readonly api: apiclient
    ) { }

    public getAttachmentContentObjectUrl(identifier: string): Observable<string> {
        return this.api.getFileData(identifier,null)
            .pipe(
                switchMap((file) => {
                    return of(window.URL.createObjectURL(file.data));
                })
            );
    }
}

我们这样调用这个函数：

export class PdfPreviewComponent implements OnInit {
    constructor(
        private readonly attachmentService: AttachmentService,private readonly domSanitizer: DomSanitizer
    ) {
    }

    public ngOnInit() {
        this.setPreviewPdfSrc(<some arbitrary id>);
    }

    private setPreviewPdfSrc(identifier: string) {
        let observable = this.attachmentService.getAttachmentContentObjectUrl(identifier);

        observable
            .subscribe(
                url => this.previewSrc = this.domSanitizer.bypassSecurityTrustResourceUrl(url),() => this.previewSrc = null);
    }
}

然后我们在对象元素中使用 previewSrc 变量来加载浏览器 PDF 扩展。

<object id="preview" type="application/pdf" [data]="previewSrc">

但是，在 MacOS Big Sur Safari 14 上执行此操作时，此代码会失败并挂起浏览器。

在 MacOS Big Sur 更新之前，一切运行良好。在 Big Sur 11.0、11.0.1 和 11.1 上测试。都失败了。在相同 Big Sur 版本的 Chrome 或 Safari 中运行它时，它可以正常工作。在其他操作系统/浏览器上没有问题。

这是 MacOS Big Sur 中的错误还是我做错了什么？我尝试解析 userAgent 字符串来规避这个问题，但 Big Sur 11.0.1 返回 10.15.6 Catalina...

解决方法

不幸的是，我遇到了同样的问题。 不过，当使用 iframe 而不是对象元素时，这似乎不会发生，所以我将其用作解决方法。

<iframe [src]="previewSrc"></iframe>

编辑： 经过更多挖掘，我注意到问题仅在添加 type="application/pdf" 属性时发生。删除该属性似乎也可以解决问题。

为什么会这样，我仍然不清楚。

<object id="preview" [data]="previewSrc">

我为此创建了 an issue in the Angular repo，但我不确定这是 Angular 特有的还是 Safari 错误。