如何在 Angular 7 中使用 Iframe

Question

我使用 Iframe 通过以下方法在 HTML 中设置外部 URL：

方法一：

 <iframe [src]="sanitizer.bypassSecurityTrustResourceUrl(srcUrl)" height="600" width="1000"></iframe>

方法 2：在此方法中，我还使用How to set <iframe src="...">创建了一个安全 PIPE，而不导致 `unsafe value` 异常？

 <iframe width="100%" height="300" [src]="srcUrl | safe"></iframe>

方法三：

 <iframe #iframe height="600" width="1000"></iframe> 
  @ViewChild('iframe') iframe: ElementRef;
ngAfterViewInit() {
    this.iframe.nativeElement.setAttribute('src', this.srcUrl);
}

但没有一个对我有用。我收到以下错误：

拒绝在框架中显示 ''，因为祖先违反了以下内容安全策略指令：“frame-ancestors 'self' ”。

请在以下链接找到我的代码：

https://stackblitz.com/edit/angular-irwasj?file=src%2Fapp%2Fapp.component.html 任何人都可以帮忙吗？

Answer 1

我正在调查这个。很少有网站（例如 google、stackoverflow、youtube）拒绝在 iframe 内加载。它使用某种 FrameKiller。如果你使用https://www.google.com它会显示google.com拒绝连接。其他网站（例如 stackoverflow）根本不显示任何消息。我已经创建了一个演示，该演示使用https.

演示： https: //stackblitz.com/edit/angular-gzvckb