时间戳

首页 > 解决方案 > Angular iframe 无法使用 DomSanitizer 快速加载 url

angular - Angular iframe 无法使用 DomSanitizer 快速加载 url

问题描述

我的应用程序中有一个 iframe。由于 iframe url 来自另一个域，因此我使用 DomSanitizer。一切正常，但是当我运行我的应用程序时，我在 iframe 中看到“找不到网页”（见图）。为了缩小问题范围，如果我删除 DomSanitizer，问题就会消失。使用 DomSanitizer 时如何解决此问题？我尝试过使用管道，但问题仍然存在。

在此处输入图像描述

getUrl() {
    return this.sanitizer.bypassSecurityTrustResourceUrl( this.url );
}

HTML

<iframe [src]="getUrl()" style="width: inherit"
      [height]="frameHeight"
      frameborder="0" allowfullscreen="allowfullscreen">
</iframe>

标签： angular

解决方案

我通过在 url 输入属性中有一个设置器并在其中设置 this.sanitizer.bypassSecurityTrustResourceUrl 解决了这个问题，如下所示

_url: string;
get url(): string {
    return this._url;
}

@Input() set url( value: string ) {
    this._url = value;
    if( this._url ) {
        this.urlSafe = this.sanitizer.bypassSecurityTrustResourceUrl( this._url );
    }
}

然后我在 HTML 中使用 urlSafe

推荐阅读