Question

我信任带有.. DomSanitizer的URL如下：

myFunction(videoLoc:any):void { 
    videoLoc = this.sanitizer.bypassSecurityTrustResourceUrl(videoLoc); 
}

但在控制台上出错：

GET unsafe：myFunction（https://www.youtube.com/watch?v=c9F5kMUfFKk）

我的HTML代码如下：

<tr *ngFor="let fetch of fetchApi.data.featured">
  <td>
     <video width="320" height="240" controls>                                                                                                                                              
     <source src=myFunction({{fetch.video_location}})>
     </video>
  </td>                                                                                                                                                                                                                                                                                                                                     
</tr>

这就是我无法在HTML页面上呈现视频的原因。我在做什么错误？

Answer 1

您的模板似乎有误，应该是

<source [src]="myFunction(fetch.video_location)">

并在清理后返回videoLocation

myFunction(videoLoc:any):void {
 return this.sanitizer.bypassSecurityTrustResourceUrl(videoLoc);
}

或者你可以使用Pipe来处理这个问题，

@Pipe({ name: 'safe' })
export class SafePipe implements PipeTransform {
  constructor(private sanitizer: DomSanitizer) {}
  transform(url) {
    return this.sanitizer.bypassSecurityTrustResourceUrl(url);
  }
}

然后，

  <source [src]="mfetch.video_location | safe">

DomSanitizer抛出错误

1 个答案: