问 如何设置<iframe src="...">而不引发` `unsafe value`异常？

EN

这个很适合我。

import { Component,Input,OnInit} from '@angular/core';
import {DomSanitizer,SafeResourceUrl,} from '@angular/platform-browser';
@Component({
    moduleId: module.id,
    selector: 'player',
    templateUrl: './player.component.html',
    styleUrls:['./player.component.scss'],
export class PlayerComponent implements OnInit{
    @Input()
    id:string; 
    url: SafeResourceUrl;
    constructor (public sanitizer:DomSanitizer) {
    ngOnInit() {
        this.url = this.sanitizer.bypassSecurityTrustResourceUrl(this.id);      
}

老实说，所有的答案似乎都错了。使用 this.sanitizer.bypassSecurityTrustResourceUrl(url) 只会绕过安全性，并将url视为 SafeResourceUrl 。然而，给定url可能仍然是恶意的，从而导致安全违规。医生也这么说： https://angular.io/api/platform-browser/DomSanitizer#bypassSecurityTrustResourceUrl

一种解决方案是首先调用 sanitizer ，然后将 sanitizer 返回值传递给 bypassSecurityTrustResourceUrl ，如下所示：

this.sanitizer.bypassSecurityTrustResourceUrl(this.sanitizer.sanitize(SecurityContext.URL, url))

通过这种方式，您可以清理任何恶意代码，然后绕过安全机制，这表明这确实是一个安全的url。

这对我很管用

我在iframe中定义了一个id。

<iframe id="embeddedPage"></iframe>

在组件中，我使用了以下代码

export class YourComponent implements OnInit {
  constructor() {}